JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/phaser/2.4.3/phaser.min.js"></script>
<div id="game"></div>

JavaScript

var BasicGame = {};

BasicGame.Game = function (game) {};

// set Game function prototype
BasicGame.Game.prototype = {
    create: function () {
        this.stage.backgroundColor = '#7BD3C6';
        
        var btnTexture = new Phaser.Graphics()
          .beginFill(0x000000, 0.5)
          .drawRoundedRect(0, 4, 200, 56, 5)
          .endFill()
          .beginFill(0xFFFFFF, 1)
          .drawRoundedRect(0, 0, 200, 56, 5)
          .endFill()
          .generateTexture();

        var btnTextureHover = new Phaser.Graphics()
          .beginFill(0xFFFFFF, 1)
          .drawRoundedRect(0, 4, 200, 56, 5)
          .endFill()
          .generateTexture();

        var btnText = this.game.add.text(0, 0, "start", {font: "30px Arial", fill: "#333333"});
        btnText.anchor.setTo(0.5);

        this.playBtn = this.add.image(this.world.centerX, this.world.centerY, btnTexture);
        this.playBtn.addChild(btnText);
        this.playBtn.anchor.setTo(0.5, 0.5);

        this.playBtn.inputEnabled = true;
        this.playBtn.input.useHandCursor = true;
        this.playBtn.events.onInputDown.add(function() { console.log('play'); }, this);
        this.playBtn.events.onInputOver.add(function() {
          this.playBtn.setTexture(btnTextureHover);
          btnText.y = 2;
          } , this);
        this.playBtn.events.onInputOut.add(function() {
          this.playBtn.setTexture(btnTexture);
          btnText.y = 0;
          } , this);
    }
};

(function () {
    var game = new Phaser.Game(400, 400, Phaser.AUTO, 'game');

    game.state.add('Game', BasicGame.Game);

    game.state.start('Game');
})();