Small recipes, one mechanic each.
Each page is a focused how-to: the minimum code to make a single mechanic work, plus a live mini-demo you can replay.
Copy-paste foundations to clone for a new slot.
CardSymbol. debug / prototyping helper
No-asset PIXI.Graphics symbol class for recipes, mechanic tests, and prototypes. NOT for production. ship Sprite/Animated/Spine instead.
EmptySymbol: render nothing for a registered id
Register an EmptySymbol against an id like `empty` to reserve a grid slot that produces no visual output. The canonical background for hold-and-win bonus boards, miss cells, and any pattern where "blank" is the intended visual.
Classic 5×3 starter
The foundation of 95% of slot games. copy-paste starting point for line-pays.
Cascade 6×5 tumble
Modern tumble mechanic with an ever-growing multiplier. MultiWays-adjacent.
Hold & Win respin
Coins lock on land, respin until the grid fills. the "coin" formula every studio is shipping.
Static jagged shapes. non-uniform row counts fixed at build time.
Per-reel shape (pyramid)
Non-uniform reel set. 3-5-5-5-3 pyramid, diamond, half-pyramid. Static shape set at build time.
Pyramid shape with Spine
Same 3-5-5-5-3 pyramid, every cell a Spine 2D skeleton. Crisp at every per-reel cell size, with idle/landing/win/destroy animations baked in.
Per-spin row variation. each reel can land on a different row count between minRows and maxRows.
MultiWays
Per-spin row variation. each reel can land on a different row count between minRows and maxRows.
MultiWays cascade
Per-spin row variation on a strip-spin landing; cascade tumble pops winners and drops new symbols in from above. Shape-aware on every reel.
Sticky wild on MultiWays
Pin survives every MultiWays reshape. clamps when shape shrinks, restores to originRow when it grows back.
Single symbol that occupies an N×M block of cells. 2×2 bonuses, 3×3 giants, 1×3 bars.
Big symbols with Spine
Same 2×2 anchor mechanic, every cell a Spine skeleton. The bigWild reuses the regular wild rig. Spine scales it to the larger block without losing crispness.
MxN big symbols. every shape
Square 2×2, tall 1×3, giant 3×3, wide 2×4. one focused interactive demo per shape, with the placement logic spelled out.
Land a big symbol partially in buffer
A tall 1xH block lands with its anchor in bufferAbove. Only the bottom cell shows at row 0. Nudge to drag the rest into view. Works end-to-end through setResult, refill, nudge, and the cross-reel resolver.
Nudge a big symbol in, then hold it across a respin
A tall wild lands with its anchor in bufferAbove (tail-visible at row 0). Nudge the trigger reel to drag the full block into view, then call `spin({ holdReels: [...] })` so the revealed wild survives a respin of the other reels. The held strip is never touched.
Big symbol falls into view through a cascade
A tall wild lands with its tail peeking in from bufferAbove. The cells below the tail form a winning cluster, clear in the cascade, and the wild's anchor falls down through the strip into full visibility.
getBlockBounds. outline a big symbol
Draw a single rectangle that hugs an entire N×M block, regardless of which cell you pass. Works for 1×1 (equivalent to getCellBounds) and 1×N expanding wilds.
Sticky, expanding, walking, multiplier wilds. all powered by the pin primitive.
Sticky wild (CellPin)
Same sticky wild, built on the engine primitive. no ghost sprites, no manual grid injection.
Expanding wild
Wild lands, entire column becomes wild for N spins. auto-expires when the turn counter runs out.
Multiplier wild
Each wild carries a per-instance multiplier in its pin payload. a ×N badge overlays the cell.
Sticky-win respin
Winners lock for N respins while the rest of the grid spins independently. the Dead-or-Alive-II pattern.
Walking wild (movePin)
Walking wild migrating one column left each spin. engine-native reelSet.movePin(), no ghost sprites.
Mystery reveals, value coins, collectors, symbol upgrades.
Symbol transform
A symbol morphs into a different (usually higher) one mid-round. winning lows upgrade to meds.
Value-carrying coin (Hold & Win)
Coin symbols carry their payout value in the pin payload; a running total updates as coins lock.
Collector symbol
Collector absorbs adjacent coin pin payloads into its own total. pins coordinating across cells.
Mystery reveal (CellPin)
Mystery symbols land, all reveal to the same random class via eval pins. auto-cleared at next spin.
Positional multiplier cells
Specific cells carry multipliers. any symbol that lands there boosts the win passing through.
Drop physics, anticipation drops, removing winners.
Tumble feels. every preset
Five interactive canvases. same spin + cascade-refill, only .tumble({ fall, dropIn }) changes. Click each to compare feels.
Cascade refill orders
Four interactive canvases. same destruction, only the post-win refill ordering changes. Simultaneous, LTR wave, bottom-up, top-down.
Cascade anticipation refill
Two-stage refill: survivors slide down first, then a global anticipation beat for multipliers / mascots, then new symbols drop in column by column.
Lead-in delay before the fall
Four interactive canvases. same spin, only the gap between SPIN click and the first frame of fall-out varies. From 0 ms (instant) to 700 ms (dramatic).
Remove symbol in a cascade
Fade winners out, then drop the next-stage symbols in from above. no reel respin.
Cascade pops with WinPresenter
Same presenter, same Win shape. just cells vanishing from a cascade.
Spin first, cascade after
Open every play with a classic strip-spin, then cascade the respins. one ReelSet, the per-spin mode override does the switch.
Highlight winning cells; draw your own paylines from events.
Slow a reel, slam-stop, near-miss, single-reel respin.
Anticipate a reel
Slow a specific reel to build tension before it lands.
Peek symbol from buffer-above
Pre-fill the buffer-above slot so a teaser symbol sits just out of frame, visible during scroll-in on the next spin.
Anticipation teaser
Pair setAnticipation with a buffer-above prefill so the next cell to scroll into view on a slow reel is a caller-chosen symbol.
Slam-stop
Let the player smash the button to land the reels now.
Fake a near-miss
Place N-1 scatters plus anticipation on the reel that "almost" landed one.
Nudge a reel
After landing, shift one reel down or up by N positions to reveal caller-supplied symbols.
Spotlight after a nudge
Land a near-miss, parallel-nudge three reels to complete a wild line, then run SymbolSpotlight on the new winners. Chains nudge() and spotlight.show() in their canonical order.
Skip an in-flight nudge
reelSet.skipNudge(col) fast-forwards a running nudge tween to its landed position. The original nudge() promise resolves normally. success path still runs.
Abort a nudge
Cancel a running nudge via NudgeOptions.signal. Strip still snaps to landed; nudge() rejects with AbortError; nudge:cancelled fires on the bus.
Staggered nudge. wave reveal
Promise.all + NudgeOptions.startDelay dispatches every reel's tween concurrently with a per-reel offset. Total wall time is (cols.length - 1) * stagger + duration.
Nudge through a big symbol
A 1xH block on the target reel is nudged through as a unit. Survival formula enforced; cross-reel (w>1) blocks throw.
Pixel rects per cell; pointer-aligned overlays.
Cell bounds. overlays, paylines & hit areas
getCellBounds(col, row) returns the pixel rectangle of any visible cell. draw paylines, win outlines, or hit areas that align exactly with symbols.
Cell hit areas. click to pick, hover to preview
Attach pointer events to individual grid cells with getCellBounds. cursor turns to pointer on hover, click toggles a pick state.
Texture atlases, animated sprite sequences, AI-generated art.
Mid-spin mode swaps, frame middleware.