JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://rawgit.com/GoodBoyDigital/pixi.js/master/bin/pixi.dev.js"></script>

JavaScript

var stage = new PIXI.Stage(0xFFFFFF, true);
stage.interactive = true;

var bg = PIXI.Sprite.fromImage("http://www.goodboydigital.com/pixijs/examples/14/BGrotate.jpg");
bg.anchor.x = 0.5;
bg.anchor.y = 0.5;
stage.addChild(bg);

var panda = PIXI.Sprite.fromImage("http://www.goodboydigital.com/pixijs/examples/14/panda.png");
panda.anchor.x = 0.5;
panda.anchor.y = 0.5;
panda.position.x = 620 / 2;
panda.position.y = 380 / 2;

stage.addChild(panda);

var renderer = PIXI.autoDetectRenderer(620, 380);
renderer.view.style.position = "absolute"
renderer.view.style.marginLeft = "-310px";
renderer.view.style.marginTop = "-190px";
renderer.view.style.top = "50%";
renderer.view.style.left = "50%";
renderer.view.style.display = "block";

// add render view to DOM
document.body.appendChild(renderer.view);

var thing = new PIXI.Graphics();
var paths = [562, 74, 555, 77, 550, 82, 545, 90, 543, 96, 536, 113, 541, 144, 557, 158, 602, 170, 621, 172, 630, 174, 648, 161, 649, 141, 647, 114, 638, 88];
stage.addChild(thing);

thing.x = -600;
thing.y = -100;

panda.mask = thing;
panda.addChild(thing);

stage.mousemove = function (interactionData) {
    var global = interactionData.global;
    panda.x = global.x;
    panda.y = global.y;
}

requestAnimFrame(animate);

function animate() {

    thing.clear();

    thing.beginFill(0x8bc5ff, 0.4);
    thing.drawPath(paths);
    thing.endFill();

    renderer.render(stage);
    requestAnimFrame(animate);
}