Style My Reel by mukh.1

Try the palettes live

Palette

This is the actual HTML composition running in your browser — the same code your agent learns from.

Signature moves

  • page-advance

    The next page slides in from the right over the current one, casting a soft navy shadow; the old page drifts 22% left and is then hidden.

  • mask-rise

    Serif headlines and the cover year rise inside a clipping mask.

  • count-up

    KPI numbers count from 0 with tabular numerals; decimals via two counters.

  • yoy-pair

    Prior-year bar grows first, the current-year bar 0.1s later and longer — the comparison happens in motion.

  • baseline-grow

    Chart bars grow from the navy baseline left to right; value labels fade in as each bar settles.

  • rule-draw

    Contents rules, accent bars and dividers draw from the left.

Sound

Corporate-cinematic without cliché: warm piano ostinato, soft strings, light pulse. Confident, unhurried.

Voice

A CFO or chair speaking plainly: measured, mid-low, ≈140 wpm. Say the number, then what it means.

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: every page has a folio · numbers are set, not shouted · one accent, for the delta

More data & finance styles

Crypto Neon Grid

$19

Neon cyber charts over a running perspective grid: glowing candles, wallet cards, hex accents.

4 palettes · 16:9 9:16 1:1

Donut Pastel Finance

$19

Calm pastel money videos: donut charts that sweep in, category chips and savings-goal rings.

4 palettes · 16:9 9:16 1:1 4:5

Editorial Data Story

$19

Newsprint, serif headlines and charts that draw themselves — data journalism in motion.

4 palettes · 16:9 9:16 1:1 4:5