Grid components and templates
Explore 20 ThreeUI components, templates, backgrounds, and interactive effects tagged Grid, with previews and editable implementation source.
- Attune
The complete attune hero page, preserved unchanged with its procedural Three.js Mars, orbital telemetry, dust haze, and full-bleed product layout.
- RenderLab
The complete RenderLab motion-house page, preserved unchanged with its ruled column overlay, tracking cursor label, scroll progress bar, light and dark toggle, marquee bands, and the twenty remote stills and one remote loop the original page references.
- Trochil Hummingbird — Hummingbird
The authored page's own scene: a 390,000-point hummingbird whose wings are skinned in the vertex shader into a real swept blur, hovering over a bed of trumpet blossoms, flying to a standoff from the cursor whenever the pointer moves.
- Trochil Hummingbird — Sakura
A butterfly on a cherry branch: forewings and hindwings filled by area off their own outline tables, veined and lit at the margin, settling onto a limb hung with five-petal blossoms while cut petals tumble through the frame — the ember ramp regraded plum to blossom.
- Trochil Hummingbird — Reef
A deep-bodied reef fish over a coral shelf, driven by a travelling body wave that yaws each section into its own turn, with staghorn heads, boulder coral and sea fans below and sun shafts fed into the density buffer so the light through the water carries the same dot lattice.
- Trochil Hummingbird — Abyss
Eight jellyfish rising through midnight water: one bell built once and stamped out through a per-vertex seed, each on its own contraction phase, its oral arms and tentacle veil inheriting the squeeze a stroke late — the nearest one leans its crown toward the cursor.
- Gallery
The isolated Vantrix hero image ribbon: sixteen curved editorial panels orbiting a vertical cylindrical rail on a quiet paper grid.
- Grid Illustrations — Keyboard
A compact isometric keyboard built as a pale dimensional grid with raised keycaps, a slim frame, soft grounding shadow, and damped pointer orbit.
- Grid Illustrations — Typewriter
A mechanical typewriter resolved as a stepped isometric grid study, from its key field and carriage to the paper assembly and grounded base.
- Grid Illustrations — Journal
An open journal translated into a dimensional isometric grid, with layered pages, a central spine, structured linework, and the collection's soft monochrome lighting.
- Grid Illustrations — Charts
An analytics board resolved as a dimensional isometric grid: a two-row column field, a pair of line series floating on dropped stems, and a share ring whose sectors carry their own depth, all building themselves under a travelling scan head.
- Isometric Motion Grid — Figure Grid
The original six-figure specimen sheet: three columns of hairline product scenes, each with its own timeline and its own pointer camera.
- Isometric Motion Grid — Hero
A split hero where the headline sits opposite a field console: a console and a signal mast set apart on one deck, with the panel and the pass chip parked in their own corners of the frame.
- Isometric Motion Grid — Testimonials
Three quote columns under one rule, each carrying its own figure: a quote plate rising in place, a score settling on a dial, and three records lifting lane by lane.
- Isometric Motion Grid — Contact
A hairline contact form beside a dispatch dock, where the dock and keypad sit apart on one deck and the outgoing message and its acknowledgement park in opposite corners.
- Isometric Motion Grid — Footer
A bottom-anchored footer whose link columns sit above a full-width module rail — seven evenly gapped bays on one bar, scanned end to end on a six-second sweep.
- Laser — Matrix Junction
The preserved pointer-reactive three-way matrix junction.
- Laser — Atmospheric Blade
A white-hot emerald blade cutting through layered procedural vapor and faint mirage rails.
- Laser — Vanishing Array
Violet and amber carrier rails accelerate from a pointer-steered horizon origin.
- Laser — Halftone Relay
An off-axis cyan relay where vapor resolves into an animated screen-space dot field.