motion-menu

"light the two corners" — opposing soft sources. Gives a flat panel a direction without a shape in it.

"tag the corner with a figure index" — a single frame with a museum-label tab hanging off its top edge.

"put the meta in the corners" — coordinates, status, index. The frame around the work that says a person set this.

"put registration marks in the corners" — a print-shop crosshair and four bracket corners. Structure without a single gradient.

"cards wear 86" — squircles, scoops, notches, bevels. The anti-default corner language.

"corner link cluster is <n>" — a vertical stack of generic icon buttons pinned to a corner; reach for it for email, profile, and outbound links without borrowing anyone's brand mark.

"plans render as 143" — the DAF signature artifact: a costed plan with the margin visible, not hidden. In production this reads the live catalog.

"stats section uses 13" — numbers roll up when they enter the viewport.

"stats are <n>" — three counters that count up once and stop, each with its own unit tag; reach for it when the motion should register once, not loop.

"proof is <n>" — a short ledger of credentials with a seal mark; reach for it when the trust argument is who signed off, not who spoke.

"proof is a credential list" — plain rows of what is verifiable. Reads honest precisely because it is not styled like a boast.

"pages morph with 109" — real multi-page navigation where shared elements fly between pages. Zero JS, zero router.

"archive footage = 94" — scanlines, barrel curve, rolling band, phosphor flicker. Full broadcast nostalgia.

"tiny world via 166" — a whole room in stacked CSS transforms. Story scenes without a single polygon.

"go native with 165" — hover the bars, pop the popover, open the details. Zero JavaScript in any of them.

"cheap reveals via 85" — scroll-linked animation with no JS at all. The free-performance version of 14.

"give me a CTA on a gradient band" — the ask sits inside a full-width rounded band built from the accent colours; reach for it when the CTA should look like its own coloured module, not anot

"give me a CTA with an availability line" — a small pulsing status dot and a plain availability line sit above the ask; reach for it when the CTA should feel like a real person answering, no

"give me a CTA with a countdown line" — a monospace digit readout under the heading, styled like a timer without claiming real urgency; reach for it when the ask needs a ticking visual, not

"give me a CTA with phone and email" — two direct contact links sit side by side with a hairline between them; reach for it when the fastest path to a reply is just handing over the number.

"give me a CTA with a quiet second link" — a filled primary button with an understated text link underneath for the less committed visitor; reach for it when you want one clear default witho

"give me a CTA with a next-steps checklist" — a short numbered list of what happens after someone clicks, then the button; reach for it when the ask is unfamiliar and the visitor needs to se

"currency switcher row is <n>" — a pill group for currency choice above the price it affects; reach for it for pricing pages that serve more than one region.

"add 02" — dot tracks tight, ring lags behind. Hides itself on touch devices.

"status table is <n>" — a hairline-ruled table with a status-pill column; reach for it as the working list view of a dashboard. Layout only — no live rows.

"give it evenings — 233" — one click and the sun hands off to the lamps: every light, color and shadow lerps. Nothing snaps.

"browse mode = 73" — swipeable card stack. Lookbooks, product discovery, yes/no curation.

"set the terms as definition pairs" — term and meaning, hung on a rule. For glossaries and explainers.

"freight visible via 216" — the shipment tracing its route with live position. Calm through visibility.

"show the movement, not just the number" — value plus its change, on hairlines.

"product shots get 96" — depth-map parallax makes flat photography lean like a hologram.

"the page adapts via 224" — battery, connection speed, memory, cores: real signals for serving lighter experiences when it matters.

"majors degrade with 245" — GPU string + memory + cores pick the tier; the centerpiece falls back to CSS, then to a poster. Never just reduced-motion.

"cut the closer on a diagonal" — an accent-coloured clip-path wedge carries the closing line and CTA above a plain link row.

"cut a notch for the caption" — the media panel loses a diagonal corner and the caption sits in exactly the space it gave up.

"diagonal scan behind it" — a fine rule texture that drifts. Reads technical without reading retro.

"cut the content on a diagonal" — a clip-path wedge sets one statement apart from the next, without a straight rule down the middle.

"give me a diagonal split hero" — two colour panels meet on a diagonal seam instead of a straight column; reach for it when a plain left/right split feels too safe.

"summarise the diff" — files changed with added/removed counts. The row every review starts from.

"specs draw with 132" — interactive footprints and clearance zones. Herman-Miller-depth PDPs.

"hovers know direction via 158" — fills that enter where your cursor entered, plus the macOS dock magnify.

"make it a native drawer" — a real <details> element as the menu toggle, no JS, keyboard-operable for free. Shown open here; it collapses to one row on click.

"gallery images swap with 34" — one image liquefies into another through a noise map. The signature Codrops hover.

"background texture = 37" — ordered-dither shading, the retro-print look that's everywhere on 2026 Awwwards.

"section background = 70" — a field of dots that flinches away from the cursor and springs back.

"motion graphics drop in via 236" — After Effects animation playing on a wasm renderer. The designer's tool, Rive's older sibling.

"dot matrix behind the section" — a quiet texture that gives flat panels somewhere to sit.

"run two hairlines with a dot between" — a quieter seam than one rule, for a break that shouldn't shout.