MOTION DESIGN

Design gallery

A glass treasure chest opens and spills a fan of design cards. Open any card to flip it and reveal its palette, type scale and components.

  • ⋮⋮Hero section
  • ⋮⋮Feature grid
  • ⋮⋮Pricing table
  • ⋮⋮Testimonials
  • ⋮⋮Footer
Press and hold the button
click anywhere
tap the button
Nice, you peeled it
The corner springs back the moment you let go.
Drag the corner

Read between the shadows

Most of this panel rests under a dark veil. A soft spotlight follows your pointer and reveals only what it touches.

Use the arrow keys when there is no pointer to hand. The light glides to wherever you point it.

Good motion stays invisible until you need it, then it is exactly where your attention already went.

Hold to confirm
    pull down to refresh
    PLAIN
    STYLED
    Panels grow by animating their measured height on a spring, so the reveal keeps its weight instead of snapping to a fixed duration.
    While the box opens, the copy fades and slides up a few pixels, so the text arrives a beat after the frame rather than pouring in with it.
    Opening one panel closes the last, so the layout stays calm and there is only ever one thing asking to be read.
    A headline that resolves out of noise, one column at a time.
    DRIFT
    Depth on hover
    layers drift at their own pace
    npm i drift
    Choose a ride
    STStandard$12
    CFComfort$18
    VNVan, up to six$24
    PRPriority pickup$29
    double-tap to like
    1,024
    Pick a reaction
    drift
      auto

      Ship the polish

      A light sheen sweeps across the headline on hover, or on replay.
        ⋮⋮