theme-switch-moves
Shot recipes · A whole scene · Apache-2.0
- What it does
2 named moves on one card: theme-sweep-toggle (The dark theme sweeps across as a slanted clip-path edge with a glowing 4px line, recoloring everything it passes in one 38-frame pass); palette-theme-ripple (The command palette collapses to a bright point, and from that point a circular ripple floods the new theme across the screen).
- Get it
Copy demos/interaction/theme-switch-moves/PaletteThemeRipple.tsx (and its 1 sibling file(s) in the same folder) into a Remotion project with demos/_fixtures/Brand.tsx, demos/_fixtures/Look.tsx, demos/_fixtures/Polish.tsx; fix the import paths; then <Composition id="PaletteThemeRipple" component={PaletteThemeRipple} durationInFrames={PALETTE_THEME_RIPPLE_DURATION} fps={30} width={1920} height={1080} />. With the skill installed, say: "use the theme-switch-moves shot card". Read the card first: references/shots/interaction/theme-switch-moves.md.
- Needs (the whole pack)
Remotion 4 and React 19, and FFmpeg for its checks. No Tailwind, no CSS files, no web fonts.
- Re-skin
Edit the file (colors, logo, text)
No props (2 demo files). It uses no named look: about 62 color values are written in the demo. Fonts come from the shared fixture files (FONT in Polish.tsx, type() in Look.tsx). The logo and name on screen are the pack's own, from demos/_fixtures/Brand.tsx (one brand file every demo imports): swap…
- License
Apache-2.0
- From