---
name: nexu-io/kinetic-headline
source: https://app.decimal.ai/s/nexu-io-kinetic-headline@1/SKILL.md
source_sha256: 7edb57921ed7
---

# kinetic-headline

Words or letters stagger in, one after another. Part of
[motion-anything](https://github.com/nexu-io/motion-anything); obeys `MOTION-SPEC.md`.

## When to use it
- One hero headline or a single key line. Title cards in launch / release videos.

## When NOT to use it (restraint)
- Body copy or must-read content. Never more than one kinetic line per screen.

## How to apply
1. Copy `kinetic-headline.css` and `kinetic-headline.js` and link them.
2. Mark a heading: `<h1 data-kinetic>…</h1>` (or `data-kinetic="letters"` for short lines).

## Accessibility & performance
- `prefers-reduced-motion`: shown immediately. Transform/opacity only.