Try the palettes live
This is the actual HTML composition running in your browser — the same code your agent learns from.
Signature moves
word-drop
The question lands one word at a time.
bar-fill
Bars grow from the left while their % counts up beside the tip.
rank-sort
After filling, rows slide into rank order — the data rearranges itself.
winner-pop
The top answer turns --winner, a 'Top answer' chip pops with a small overshoot, others dim to 45%.
dot-cascade
Respondent dots fill in reading order, winner colour first.
ballot-push
Scene change: the whole card stack pushes up; the next scene rides in from below with its content already set.
Sound
Light, curious pop: pizzicato or plucks, claps, a playful bass line; leave space for VO.
Voice
Curious, friendly presenter (≈155 wpm). Read the question as a question; pause before the winner.
What's in the pack
STYLE.md
341 lines: tokens, motion system, 6+ scene recipes, captions, sound, ratios, self-audit.
SKILL.md
Auto-loads in Claude Code when you ask for this look.
palettes.json
4 tested palettes + rules for mapping your brand colours.
showcase.html
A working reference composition of every signature move.
Principle: ask, count, rank, reveal · one winner colour · n is always on screen
More data & finance styles
Annual Report Navy
$19Corporate annual-report films: navy and white, big numbers, clean charts, year-over-year.
Crypto Neon Grid
$19Neon cyber charts over a running perspective grid: glowing candles, wallet cards, hex accents.
Donut Pastel Finance
$19Calm pastel money videos: donut charts that sweep in, category chips and savings-goal rings.