Lab

Elements fade and rise as they enter the scroller, one after another.

A thumbnail morphs into a header using the View Transitions API, with a crossfade fallback.

A path draws itself as you scroll the sandbox, segment by segment.

A headline arrives one character at a time, 24ms apart.

Lines of text slide up from behind an invisible edge, overlapping as they go.

A button label leans toward the pointer and eases back when it leaves.

A dimmed panel reveals its content only inside a circle that follows the pointer.

A card tilts toward the pointer with a highlight sweeping across its face.

A seamless scrolling row of service names that pauses when you hover it.

Generated noise laid over a flat panel, with the strength on a slider.

Three blurred blobs drifting on long offset loops behind the content.

A poster that swaps to a silent looping clip on hover, drawn here in the browser.

A tiny placeholder scales up blurred and resolves into the full image.

Numbers counting from zero to their value, easing out as they land.

A thin bar tracking how far through the sandbox's own scroller you are.

The cursor-reactive field from the home page, with cell size and radius on sliders.

Two frames from the real quote tool, which lives on its own page.

A divider you drag — or move with arrow keys — to wipe between two states.

Four palettes restyling a sample layout by swapping custom properties inside the sandbox.

HTML you type, rendered live into a sandboxed iframe with scripts and same-origin off.

⌘K opens a filterable list of this page's demos and jumps to the one you pick.

A list narrowing as you type, with the layout holding still.

Real open slots read from a connected calendar.

A signed-in area for your customers or staff, annotated here rather than simulated.

Uptime and incidents read from a monitor.

Traffic and conversion figures read from an analytics source.

Where an enquiry goes after someone presses send, drawn as the route it takes.

Share images rendered on request by a real route on this site.

A page per service and area, generated at build time from one array.

The JSON-LD search engines read, with every factual field still to be supplied.

A locale toggle over a sample block, with the hreflang markup shown beneath.

A live call answered by the agent, which needs a number and an endpoint to exist.

Placeholders shaped exactly like the content that replaces them, so nothing jumps.

An added item appears at once and rolls back visibly when the save is made to fail.

A designed keyboard focus ring across five controls. Tab through them.

Text selection styled to match the site, next to the browser default.

A missing page that offers the likely destinations instead of an apology.

A quote that prints properly, with the rules that make it do so.

The tab icon reflecting idle, working and done, restored when you stop.

Four shortcuts bound only while the demo runs, with a key-press readout.

The pointer replaced by a drawn one, inside this sandbox only.

Eased scrolling that takes over the sandbox's own scroller.

A fragment shader running on the GPU, written without a library.

A gate held in front of the content for 1400ms.

A click synthesised in the browser, muted until you turn it on.

A sideways track of panels inside the sandbox.

A heading resolving out of random characters.

Layers moving at different rates as the sandbox scrolls.