Interactions

11 recipes, each built only from tokens. Point at a card to watch it run on the active preset. Open one for its recipe, tokens, frames, and code.

Feedback

The element answers the pointer.

3

Press
Scales down on pointer down, springs back on release.
Toggle
The thumb slides and the track color tweens.
Lift
Rises on hover while a shadow fades in.

Overlays

Something opens over the page.

5

Overlay
The backdrop fades in. The panel scales up and rises.
Notify
Slides in from the bottom edge. Fades and drops on exit.
Menu
Grows out of its trigger. Items fade in one after another.
Tooltip
Fades in and rises a few pixels. Never pulls the eye.
Drawer
Slides in from its edge over a fading backdrop.

Content

Content arrives, changes, or unfolds.

3

Reveal
Children fade and rise, one after another.
Switch
The active indicator slides. Panel content crossfades.
Expand
The height springs open. The content fades in.