Phaser AE

Candy UI skin

Free packv3.0.0-32DLookUpdated

Pill buttons with a white rim, a jelly highlight, a passing shine and a lip they press into, under chunky white captions: the candy look for every widget in a game. It is the look the `ui` pack starts with, and this pack adds its display face, its colour options and its material.

This is a Free pack. Every phaser.io account can use it in their games.

Released October 18, 2026 · updated October 21, 2026

Candy UI skin: a screenshot of its demo
A note about these graphics

Expansion packs don't come with graphics. This screenshot is one way of drawing what the pack does, made for its demo: none of the sprites, tiles or backgrounds in it are in the pack.

That's by design. A pack is a game's logic, mechanics and effects, and it works with whatever art you give it. Some packs draw effects, backdrops or 3D scenes of their own, but none carries a game's sprites.

So the look is yours. Make the art on phaser.io, bring your own, or let your agent draw it in code: the same pack can look like anything.

The pack

uiSkinCandy

function uiSkinCandy(options: UiSkinOptions = {}): Pack<{}>

Pack ui-skin-candy: the candy game UI skin — a pill with a white rim, a jelly highlight, a shine that sweeps across, and a chunky white caption stroked and extruded. Registers the theme 'candy' (made with these options: its main colour, surface colour, corners, lip, role colours and extra colours) for game.ui.theme = 'candy', and the material, so game.skins.make({ material: 'candy', … }) makes more. Requires ui-skins.

Constants

UI_SKIN_CANDY

const UI_SKIN_CANDY: UiSkinMaterialDef

The candy material: a pill with a white rim, a jelly highlight, a shine that sweeps across, and a chunky white caption stroked and extruded. For buildUiSkin, validateUiSkin and tools; a game composes the pack instead.