Every component, measured at three widths.

25 components

SearchSort

25 components

Navigation
Floating panel header
A fixed header that floats as a rounded bar, narrows into frosted glass once the page scrolls, and drops icon-row panels from its navigation.
Conversion
Squishy pricing card
A single pricing card that squashes slightly on hover, then springs up past its target and settles, with the price figure growing on the same curve.
Media & Effects
Shimmer border card
A dark card whose hairline border carries bright arcs sweeping continuously around the perimeter, brightening on hover and on keyboard focus.
Media & Effects
Blur image card
A small crystal-glass card that blurs the section behind it, with its own image as a soft colour field, turning over on a horizontal 3D flip to show its details on the back.
Social Proof
Staggered logo cloud
A centred "trusted by" row whose whole set of logos is replaced on a timer, each one blurring out to the right as its replacement arrives from the left a beat later.
Media & Effects
Centered card carousel
A full-bleed carousel whose active card sits centred with its neighbours peeking in from both edges, driven by arrows, dots, keyboard, drag or swipe.
Navigation
Capsule header
A fixed site header that contracts into a centred, blurred capsule once the page scrolls, collapsing its brand word and tightening its spacing as it goes.
Content & Layout
Icon feature grid
A short editorial lead-in above a dense grid of icon-topped feature cards that trade colours with their icon tile on hover.
Navigation
Sticky mega menu header
A sticky site header that frosts on the first pixel of scroll, opens wide mega panels from its nav, and collapses to a full-screen sheet.
Social Proof
Social proof closer
A dark closing section stacking a pull quote beside review artwork, a row of headline figures, and a call to action over a soft glow.
Navigation
Expanding pill nav
A floating glass navigation pill that widens once the page scrolls, and collapses its links behind a toggle on small screens.
Media & Effects
Focus reveal statement
A centred statement whose words come into focus one after another as the page scrolls past, blurring again on the way back.
Content & Layout
Pinned feature tour
A feature panel that pins to the viewport and advances step by step as the page scrolls past it.
Content & Layout
Overlapping feature tabs
A vertical tab list of features beside the artwork for the selected one, over a tinted panel that overlaps the seam.
Conversion
Split image CTA
A call to action laid out as one rounded card split between copy and a full-bleed image.
Media & Effects
Image comparison slider
Two versions of one scene in a single frame, with a divider you drag, tap or arrow across to reveal each.
Content & Layout
Bento feature grid
A centred statement over an asymmetric grid of dark feature cards whose media zooms and plays under the pointer.
Heroes
Framed hero
A full-viewport hero inside a rounded panel, with a scrimmed backdrop and a headline that rises line by line.
Navigation
Panel footer
A site footer drawn as a rounded dark panel inset from the page edge, with link groups, contact details and a call to action.
Metrics
Metric statement
A centred statement over a row of metrics that count up when the section scrolls into view.
Services
Service showcase
Alternating service rows pairing a window-framed media panel with an exclusive accordion and a call to action.
Content & Layout
Process timeline
A numbered vertical timeline whose rail fills as you scroll, beside a sticky list of principles.
Content & Layout
Capability grid
A ruled grid of numbered capability cells closing on an inverted panel, with a hover rule that wipes in.
Content & Layout
Problem ledger
A sticky editorial intro beside a numbered, hairline-ruled list whose rows indent on hover.
Social Proof
Story carousel
A fanned stack of customer-story cards on a gradient band, with dot controls and a timed advance.