pixel chess

pro

Get the prompt, project and Figma file with monthly ($29 a month) or yearly ($249 a year). Plus tax where it applies.

A camera films a pixel chess board, mint and teal squares inside a gold line and a wooden frame, with motes drifting up through the dark. Every piece is a little character that bobs on the beat: soldiers with swords, riders on horses, hooded mages, stone tower golems, sorceresses with crystal staffs and crowned, bearded kings; white in ivory, gold and blue, black in slate, red and wine. The 12-second seamless loop plays an opening: 1. e4 d5, the soldiers hop forward in puffs of dust; 2. exd5, the camera dives in, the white soldier winds up, dashes and slashes, the frame flashes white and shakes, the black soldier freezes, splits in two along the cut and bursts into pixels; Qxd5, the sorceress charges a cyan orb on her staff and fires lightning down the file, the soldier turns to ash and she teleports onto his square in a ring of sparks; 3. Nc3, the rider jumps in and a red "!" pops over her head; then a wave of sparks sweeps the board and every piece re-forms at home. Square highlights mark each move, and a move list of five chips comes in below, the newest in gold. The board and characters are drawn pixel by pixel on a 360 × 360 canvas from sprite strings and cropped by the camera with nearest-neighbour sampling; no images. ?rec and window.__render(t) draw any moment for frame-exact video export, and reduced motion gets one still.

what you get

prompt
Paste it into Claude, Codex, Kimi or Cursor to rebuild this template. Tested: we rebuild every template from its prompt before it goes live.
project
The Vite + React source code as a .zip, ready to run.
figma file
The editable design as a .fig file to import into Figma.

what's inside

  • pixel art
  • chess
  • game ui
  • sprite animation
  • character design
  • camera moves
  • screen shake
  • hit flash
  • particle burst
  • lightning
  • teleport
  • dissolve
  • move list
  • canvas 2d
  • nearest-neighbour scaling
  • autoplay loop
  • frame-exact recorder

stack

  • react
  • vite
  • typescript
  • canvas

fonts

Geist

Free fonts, linked in the prompt.

colors

  • #0A1114
  • #D9EAD9
  • #2E7D72
  • #F2B33D
  • #5A3C2A
  • #3F86E0
  • #8D1F2A
  • #9FE8FF

license

With monthly or yearly: personal and commercial work, client projects included. Don't resell or share the template, prompt or files.

read the license