Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →Stagger a headline's words (or letters) in on load, one after another. Use for a single hero headline or a title card in a launch video. Honors prefers-reduced-motion. One per screen; never use on body copy or must-read content.
.claude/skills/nexu-io-kinetic-headline/SKILL.md| Test case | Without → With | Effect | Δ tokens | Δ turns |
|---|---|---|---|---|
| case-01 | ✗→✓ | ▲ Improved | -43% | 0% |
| case-02 | ✗→✓ | ▲ Improved | -64% | 0% |
| case-03 | ✗→✓ | ▲ Improved | -50% | 0% |
| case-05 | ✗→✓ | ▲ Improved | -53% | 0% |
| case-08 | ✗→✓ | ▲ Improved | -76% | 0% |
Words or letters stagger in, one after another. Part of motion-anything; obeys MOTION-SPEC.md.
kinetic-headline.css and kinetic-headline.js and link them.<h1 data-kinetic>…</h1> (or data-kinetic="letters" for short lines).prefers-reduced-motion: shown immediately. Transform/opacity only.Other measured skills in the registry, with their headline benchmark lift.