blur-text
A headline that resolves from blur, word by word. Dependency-free, reduced-motion safe.
How to apply
Copy css+js; <h1 data-blur-text>Your headline</h1>.
Words resolve from a soft blur, one after another — a calm, premium headline entrance. One headline per view; not body copy. Under prefers-reduced-motion it appears instantly and sharp.
npx skillmds@latest add nexu-io/blur-text A headline that resolves from blur, word by word. Dependency-free, reduced-motion safe.
Copy css+js; <h1 data-blur-text>Your headline</h1>.
nexu-io/motion-anything/tree/main/recipes/web/blur-text commit ee931db1ac