ClimbUK brand centre

A festival crowd, not a slideshow

Things rise into place like someone stepping up onto a stage, cards spring when you touch them, logos drift past. Press play on anything below.

Curves

Five easings

Motion is a confident rise into place: things arrive from below and settle, like stepping up onto a stage. Short, decisive, never bouncy. Respect prefers-reduced-motion: swap movement for a fade at duration.quick.

Rise

cubic-bezier(0.16, 1, 0.3, 1)

Signature curve for anything entering: fast start, long settle.

Spring

cubic-bezier(0.34, 1.56, 0.64, 1)

Playful overshoot for hover lifts on cards, stickers and photo tiles, as on the Climb27 homepage. Use with a quick or base duration; never for page-level movement.

Standard

cubic-bezier(0.2, 0, 0, 1)

State changes and things moving within the page.

Exit

cubic-bezier(0.4, 0, 1, 1)

Anything leaving: accelerate away, at about two thirds of the entrance duration.

Linear

linear

Progress, marquees and stage-light drift only.

Durations

Short and decisive

Instant 100ms
Colour and opacity feedback: hover, press.
Quick 160ms
Small UI: buttons, toggles, tooltips, focus rings.
Base 240ms
Cards lifting, menus opening, accordions.
Slow 400ms
Panels, modals, section reveals on scroll.
Stage 700ms
Hero entrances, title cards and logo reveals in video. The ceiling for any web animation.