Playground

Exploring interaction, motion, and the space between design and code.

  • Design tokens
  • Motion curves
  • Layout grids
  • Color systems
  • Typography scale

Spring Reorder

Drag items to reorder with spring physics

Magnetic Buttons

Buttons that pull toward your cursor with parallax depth

Morphing Cards

Click cards to see shared layout animation

0
0
0

Number Ticker

Odometer-style counter with spring physics

Particle Field

Constellation dots with cursor repulsion

Magnetic Mesh

Grid that warps toward your cursor like rubber

Fluid Gradient

Blurred color blobs drifting with cursor influence

Cursor Trail

Rainbow trail that fades as it ages

INTERACTIVE
3D Tilt
Move your cursor across the card

3D Tilt

Perspective card with glare that follows your cursor

Design Engineer

Text Scramble

Characters resolve from random noise

Gravity Balls

Click to drop bouncing balls with physics

hovereachletter

Wave Text

Characters ripple on hover with staggered timing

Move cursor to reveal
Spotlight Effect
A radial gradient follows your cursor to illuminate the card

Spotlight

Radial light follows your cursor across the card

Off

Elastic Toggle

Satisfying switch with spring overshoot