Techniques · 14 effects, taught

Effects, explained.

About the techniques

One effect per page: a live demo you can tune, how it works in plain steps, the code, and prompts for your coding agent. Where the library has measured it, the numbers come from real sites.

Techniques: 14
Measured: 2
Site links: 198

Demos are free. Code & prompts · Pro →

2 techniques

Ease-out intro reveal: The page's first elements fade and rise into place in about 300 ms, on a curve measured…

Live demo ●

The page's first elements fade and rise into place in about 300 ms, on a curve measured on real sites.

Ease-out intro reveal

Intro · CSS only· 7 sites

Split-text mask reveal: Headlines that rise line by line out of invisible masks, the SplitText look without the…

Live demo

Headlines that rise line by line out of invisible masks, the SplitText look without the library.

Split-text mask reveal

Intro · Scroll· 23 sites