UI components and templates

A warm editorial card deck with framed portraits, numbered identity footers, paper grain, and a deep looping perspective rail.

A dark dimensional card wave with colored profile tiles, responsive horizontal-to-vertical motion, and orientation toggling.

The isolated Vantrix hero image ribbon: sixteen curved editorial panels orbiting a vertical cylindrical rail on a quiet paper grid.

The authored badge: a matte charcoal card inside a crinkled vinyl sleeve, read by a blue-to-ember thermal ramp and hung on a printed polyester lanyard.

A cloth-backed press pass: indigo cotton duck woven thread by thread, a halftone portrait screened onto the weave, saddle stitching, brass hardware, and a herringbone cotton strap.

The credential milled as a metal card: an anisotropic brushed plate, laser-etched type over an embossed account row, a contact chip and foil hologram, and an optical sleeve that mirrors the studio instead of creasing.

An injection-moulded putty badge with screw bosses, vents and moulded lettering, a screen-printed panel with a dot-matrix window and a power lamp, and a thermochromic ink that multiplies magenta into indigo where you touch it.

The authored scene, preserved unchanged: a turned wooden hourglass whose sand drains through a pinched neck, glides along the desk and tips end over end on its own rim.

A fifty-one key board in a dark walnut sandwich case on a thin honey-oak top, with a machined plate and sculpted PBT caps. It types LOADING one key at a time — each press an eighth of the capsule, a commit light out from the return key, then a wave that runs the board clear.

A low two-button mouse on a fumed-oak board, its shell one analytic surface — a rounded-rectangle section over a superellipse plan — so the curves carry no creases. Five clicks and one scroll fill the capsule; the buttons hinge on their own seam and the cord follows the body across the wood.

A saddle-stitched leather bifold lying open on a thin mahogany board, dealing the four cards terraced in its slot out into a clear row in front of it. Every card goes straight up out of the pocket before it travels, so nothing ever passes through anything; the last one lifts and turns to catch the light.

A responsive engraved certificate: plate field, dual guilloche rosettes, and a drifting harmonic pass that auto-cycles through four cam states.

Orange sunburst dial reading 0–7000 r/min with a redline band, a machined oil-temperature sub-dial, and a counterweighted red needle.

0–160 km/h scale whose travelled arc fills behind the needle, with a peak-hold marker, counting digital readout, and rolling odometer.

Navy −1.0 to 1.5 bar dial that separates the vacuum half from the pressure half and flags the wastegate threshold with a pulsing overboost lamp.

Regeneration-to-power scale that fills its track from zero, with a green charge segment, kilowatt readout, and battery state-of-charge bar.

A cinematic secure-uplink loader with stepped progress, illuminated telemetry ticks, neon readouts, technical corner markers, mirrored side rails, scanlines, and procedural grain.

A tactile stack of three Japanese koi studies with CSS 3D depth, pointer tilt, drag and keyboard navigation, pixel-mask reveals, and animated halftone imagery.

The authored Sable dock: a centred glass capsule whose items spring downward and widen as the pointer crosses them.

An inset modern header: wordmark on the left, the proximity dock centred on the bar’s midline, and a paired sign-in and gradient call to action on the right.

A fitted terminal strip: the menu cells own the whole bar and trade width with each other, over a WebGL noise field quantised through an 8×8 ordered dither into an eight-stop dusk palette.

A vertical glass rail whose proximity field runs down the y axis, over a Three.js bead field that refracts the backdrop in screen space with per-channel dispersion and a specular rim.

Five floating isometric planes with a highlighted top layer and a cropped scan-line core.

Five synchronized wireframe cubes forming a softly animated diagnostic node cluster.

An isometric wire mesh that continuously ripples around a focused central peak.

The preserved packaged export: a tactile pill with an inset track and a raised sliding thumb.

A flat, hairline-edged switch with a stretching knob, a check-to-dash mark, and one soft accent pool.

An Apple-style Three.js capsule in transmissive glass, refracting a drifting colour field around a lit core.

A raw-WebGL switch drawn entirely in one fragment pass: plasma interior, streaming sparks, chromatic bloom, and a pointer-lit thumb.

The prismatic cube study isolated as a single rotating wireframe form.

The crossed logic cylinders isolated as a single rotating wireframe form.

The nested icosahedral sphere isolated as a single rotating wireframe form.

A warm radial spark burst that expands and contracts around a bright core.

An interlocking six-loop bloom traced as a rotating monochrome dot lattice.

A rounded command-prompt mark that breathes as a dimensional prompt blob.

The Cursor arrow and frame resolved in dots with a timed click ripple.

A four-point Gemini twinkle with orbiting light and a soft central pulse.

Five dot swatches morph through the familiar stacked Figma silhouette.

The folded Framer F rendered as shifting blue dot bands.

Three luminous electron ellipses orbit a bright React nucleus.

The Swift bird silhouette sweeps through a warm coral dot field.

The DesignCode monogram travels through a dense spherical dot field.

Aura's native asymmetric dot field carries an expanding halo of light.

Six tapered petals open, breathe, and rotate as a DreamCut bloom.

A paneled interface window assembles from cool blue dot segments.

A warm journey curve connects three pulsing experience nodes.

The CSS lettermark emerges as a purple scan moving through a rounded field.

The iOS wordmark is sampled into an even monochrome dot matrix.

Eight directional Neuform chevrons rotate around a precise center.

The Octocat silhouette appears as negative space inside a luminous orb.

The X mark is swept by a rotating highlight around its diagonal strokes.

The Instagram camera mark glows through a violet-to-orange dot gradient.

The Threads loop is traced by an angular highlight sweep.

The LinkedIn mark scans across a blue rounded-square field.

A dimensional dotted envelope opens and sends a traveling signal.

The original 17.2-second DreamCut sequence: dashboard panels, glowing charts, floating task cards, adjustment sliders, the inspector, an export queue, and a closing logo reveal.

An 18.7-second DesignCode product tour through its header, animated hero, course cards, footer, terminal, pricing, and final logo reveal, with dimensional panels and cinematic focus shifts.

A 28-second tour through ThreeUI's catalog, landing pages, source code, categories, component variants, and MCP workflow, ending with the Triwave mark and wordmark.

From first take to final cut: nine cinematic scenes through the editor, recording, timeline, transcripts, captions, audio, media, and export.

The supplied Serein dashboard motion study: seven scenes of analytics, momentum, details, signals, planning, and people.