Theme

Entrance animation

Replay the entrance animation.

01 · feedbackButtons and cards respond immediately.
02 · entranceAnimate several notes in sequence.
03 · cleanupRestore styles when leaving the page.
Replay sequence

Choose what to import

CSS transitions need no motion package. Page animations use GSAP; scroll reveals use a separate import.

CSS

Component feedback

Hover, press, selection, disclosure, and brief loading transitions.

Core

Page animations

Enter, exit, stagger, replay, and lifecycle cleanup.

Scroll

Scroll reveals

Animate sections when they enter the viewport.

CSS transitions

Use shared timing tokens for hover and press feedback. Respect reduced-motion preferences.

Animate a group

Choose the elements to animate. Call revert() when the page unmounts to restore their original styles.

Reveal on scroll

Import scroll reveals separately. Keep reading content visible and avoid taking control of scrolling.

Content starts visible. Reduced-motion preferences disable movement and shorten transitions.
Back to top