Gradient circle

Is it possible to create a uniform gradient in a drawn circle? When I use fillGradientStyle it uses a gradient on internal triangles.
It can be seen in this example\game%20objects\graphics\primitives\arc%20gradient%20filled.js

Great question, I am struggling with this myself. Anyone have thoughts on how to accomplish this?

Edit: Nvm, figured it out

Well, how did you figure it out?

One way to do it: =;

        const shape =;

        //  Create a hash shape Graphics object

        //  You have to begin a path for a Geometry mask to work
        shape.fillCircle(50, 50, 100)

        const mask = shape.createGeometryMask();;

modified this example:

I used extra steps: draw garphics to a renderTexture, save that renderTexture as an image with a KEY.
Then I can use the images as is, and I can destroy the graphics and renderTextures.

const posX = 100
        const posY = 100
        const size = 600
        const gradient1 = 0xff0000
        const gradient2 = 0xffff00

        //create graphic: a large rectangle
        let rectangle =;
        rectangle.fillGradientStyle(0xff0000, 0xff0000, 0xffff00, 0xffff00, 1);
        rectangle.fillRect(0, 0, size, size);

        let rt1 = this.add.renderTexture(0, 0, size, size);
        let rt2 = this.add.renderTexture(0, 0, size, size);


        let eraser =, 0, size / 2, 0x000000)

        //erase the circle from the first rect
        rt1.erase(eraser, size / 2, size / 2)

        //erase the rect with the cutout from the second rect, creating the circle with gradient
        rt2.erase(rt1, 0, 0)

        //the center of the renderTexture has offset of (size / 2)
        rt2.x = posX - (size / 2)
        rt2.y = posY - (size / 2)

        //save the rendertexture with a key 
        this.add.image(posX, posY, "gradientCircle1").setOrigin(0.5).setScale(1)