value-stagger-gradient
Shot recipes · A number or a chart · Apache-2.0
- What it does
Sixteen bars rise in a staggered sweep where height, hue, travel distance and blur are each spread as a gradient across the row, then a second beat re-origins the stagger at the center so the pulse amplitude fans out symmetrically.
- Get it
Copy demos/ui-entrance/value-stagger-gradient/ValueStaggerGradient.tsx into a Remotion project with demos/_fixtures/Motion.tsx, demos/_fixtures/Polish.tsx; fix the import paths; then <Composition id="ValueStaggerGradient" component={ValueStaggerGradient} durationInFrames={VALUE_STAGGER_GRADIENT_DURATION} fps={30} width={1920} height={1080} />. With the skill installed, say: "use the value-stagger-gradient shot card". Read the card first: references/shots/ui-entrance/value-stagger-gradient.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)
No props. It uses no named look: about 7 color values are written in the demo. Fonts come from the shared fixture files (FONT in Polish.tsx, type() in Look.tsx).
- License
Apache-2.0
- From