JSFiddle - React, Tailwind, and code Playground

HTML

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

</div>

JavaScript

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { create: create, render: render});

var _platform;

function create() {

    var graphics = game.add.graphics(400, 300);
    graphics.beginFill(0xFF0000, 1);
    graphics.drawCircle(0, 0, 5);

    var parent = game.add.group();
    parent.position.set(400, 300);
    
    _platform = fakeSprite(100, 0, 100, 20, '#0000dd', parent);
    _platform.anchor.set(0.5, 0.5);
    game.physics.arcade.enable(_platform);
    
    parent.update = function() {
        this.angle += 0.5;
        _platform.angle -= 0.5;
    }
}

function render() {
    game.debug.body(_platform);
}

function fakeSprite(x, y, w, h, c, p) {
    // create a new bitmap data object
    var bmd = game.add.bitmapData(w, h);

    // draw to the canvas context like normal
    bmd.ctx.beginPath();
    bmd.ctx.rect(0,0,w, h);
    bmd.ctx.fillStyle = c;
    bmd.ctx.fill();

    // draw arrow pointing to right
    bmd.ctx.beginPath();
    bmd.ctx.moveTo(0, (h/2));
    bmd.ctx.lineTo(w, (h/2)); // middle line
    bmd.ctx.lineTo((w/2), (h/3)); // top arrow line
    bmd.ctx.moveTo((w/2), h-(h/3));
    bmd.ctx.lineTo(w, (h/2)); // bottom arrow line

    // draw the lines    
    bmd.ctx.strokeStyle = '#000000';
    bmd.ctx.stroke();

    // use the bitmap data as the texture for the sprite
    var sprite = game.add.sprite(x, y, bmd, 0, p);
    return sprite;
}