Three.js landing page templates
Explore complete interactive Three.js website and landing page templates with responsive layouts, editable source, and production-ready motion.
- Tandem
A playful product studio with a luminous 3D release shelf, private photo-sharing story, selected work, studio notes, journal, and contact finale.
- Dayward
A cinematic lamp collection with five interactive 3D designs, lighting controls, editorial product stories, and a collection finale.
- DRIFT
A cinematic wearable experience with an interactive 3D device, material configuration, engineering details, collection, and frequently asked questions.
- OBLO
A sculptural brand experience with interactive 3D forms, clay materials, baked lighting, bold typography, and an editorial brand story.
- Polaroid Now+
An interactive instant-camera launch with a 3D Polaroid Now+ camera, film loading and ejection, lens filters, colorful prints, and product details.
- Rondel One
A walnut turntable product story with interactive 3D hardware, record playback, finish controls, detailed photography, and technical specifications.
- Umbra
A dark agency system with an animated 3D book, nine page layouts, live components, design tokens, and interactive pricing.
- Aureon
A connected technology ecosystem with a glowing 3D core, unfolding infrastructure chapters, layered architecture, and interactive use cases.
- Kibori
A cinematic Kyoto woodshop with eight interactive 3D crafts, glowing fire transitions, Japanese typography, a workshop index, and a commission finale.
- Kerf K1
A cinematic silicon launch with an interactive power-on sequence, a 3D processor and wafer, manufacturing story, architecture details, and sample request.
- Otto
A warm AI assistant launch with a playful 3D companion, product demonstrations, workflow stories, integrations, privacy controls, pricing, and FAQ.
- Aeris Pool
A complete pool construction website with a backyard transformation, pool collection, shapes and construction details, a 3D configurator, options, and quote form.
- KASANE
An atmospheric action RPG launch with a cinematic gate, character roster, combat arts, districts, world stories, and editions.
- Retro Gaming Handheld
A retro handheld product story with a detailed 3D console, original display modes, exploded construction, transparent finishes, multiplayer cable, and synthesizer.
- NOIR
A luxury fragrance presentation with a cinematic perfume bottle, sculpted typography, editorial scent story, product details, and shopping interactions.
- Fathomless
A continuous underwater descent through a pointer-responsive kelp forest, drifting marine snow, twilight water, and midnight bioluminescence, with a rotating typographic ring and four interactive WebGL illustration plates.
- Workshop Codex
A cinematic Codex workshop page with a snowy alpine hero, a glass ring and crystal course markers, a scroll-driven mountain ascent, illustrated chapters, and a crystalline globe.
- Workshop Codex Shelf
An interactive leather-bound library for a Codex workshop, with a draggable 3D book shelf, detailed book previews, warm lighting, and an extensive editorial curriculum.
- Corvane Vault
A gilded fantasy banking house with a pointer-reactive charter sigil, a five-chapter descent into the vault, engraved house cards, an illustrated ledger, and ceremonial charter tiers.
- Twelve Signs
An interactive zodiac atlas with a celestial sign selector, illustrated chapters, elemental profiles, and compatibility stories.
- OP–XY
A cinematic portable synthesizer and sequencer showcase with a 3D instrument, detailed controls, sound engines, sequencing, and connectivity.
- Noa Vale
A motion-led artist portfolio with an illustrated entrance, personal biography, interactive practice studies, and selected films.
- AERA 01
A mixed-reality headset experience with a spatial desktop, immersive visor world, wallpaper gallery, cinema, and product exploration.
- Aniwall
A creative productivity landing page with an animated 3D hero, feature showcases, a visual gallery, pricing, testimonials, and FAQs.
- Morrow
An interactive agency field guide with kinetic typography, studio projects, services, and a playful motion-led portfolio.
- Noctiluca
The complete Noctiluca slow-media descent, preserved unchanged with its bioluminescent Three.js water volume, looping jellyfish study, live depth ruler, stratified transect, and six cursor-lit specimen plates.
- Kage
The complete authored Kage temple experience, preserved as an interactive full-page document with its original navigation, scroll scenes, and local Three.js world.
- Inkbound River Story
The complete Inkbound river narrative, preserved unchanged with its cinematic chapters, scroll choreography, interactions, and embedded media.
- Cadence
The complete Cadence finance landing page with a responsive hero grid, an orderly bundled radial hero field, content-fit gradient pill navigation, compact dark glass CTAs, three WebGL scenes, cohesive GPT Image 2 editorial media, scroll reveals, and portfolio sequence.
- Kairo
The complete KAIRO culinary product page with its WebGL2 flame-wrapped hero, Lenis smooth scroll, GSAP ScrollTrigger reveals, pinned editorial sections, and remote product photography.
- Volta Atelier
The complete Volta Atelier studio page — services, work, process, team, pricing, FAQ, and footer as authored — with an owner-requested hero revision: the collage is respaced into a clean two-row band and the fixed corner registration marks are gone. Use Volta Atelier Hero for the isolated opening section with locally owned portraits.
- Meridian
The complete Meridian revenue-platform page, preserved unchanged with the whole Three.js r155 module inlined into the document, so the page renders its Earth-from-orbit scene without making a single network request. The authored file is named ascend.html.
- Sketchbook
A tactile personal portfolio built as a Singapore sketchbook, with nine illustrated plates, curled page turns, a draggable magnifying glass, zoom controls, a botanical paper atmosphere, and an editorial index.
- 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.
- Echo Vale
The complete Echo Vale travel page with its Three.js point-cloud drift, horizontal journey scroller, and fourteen image placements served from a responsive local WebP package sized for true 2x display coverage.
- Aurello
The complete Aurello beverage page with its can and its oranges rebuilt as real-time Three.js geometry — a lathed can traced from the product render's own silhouette and wrapped with a cylindrically un-projected label, and lit half-oranges whose cut face is un-projected from the fruit photograph — carried by the authored GSAP ScrollTrigger choreography, the pinned journey can, and the original stills as the no-WebGL fallback.
- Mara Voss
A complete field-recordist portfolio built as an editorial archive of vanishing sounds, with paper textures, specimen cards, listening records, field logs, an extruded WebGL hero wordmark and contact sheet that orbit under the pointer, and deliberately paced chapter transitions.
- MK·78 Keyboard
A complete interactive keyboard product story that rebuilds every key in DOM and CSS, moving from an oversized typing hero through construction, lineage, feature, voice, finish, and final product chapters.
- NOEMA N1
A complete humanoid robotics launch page with a full-bleed N1 hero, scroll-assembled body, technical specification sheet, exploded anatomy, domestic-use film, grip-force control, Series A gallery, parts knoll, and reservation configurator.
- Anthra A-40
A complete titanium automatic watch story staged as nine dark editorial plates, with one continuously re-posed procedural A-40, movement and material studies, finish selection, specifications, and an eased plate index.
- Astral Atlas
A complete digital object atelier whose twelve talismans are no longer photographs: every ring is modelled and lit in real time — brilliant-cut stones traced facet by facet through their own girdle, swept comfort-fit shanks, claw-set heads and pavé shoulders — carried through an editorial origin story, material studies, a gem-and-metal configurator that rebuilds the object as you choose, a horizontal archive, editions, testimonials, FAQ, and final invitation.
- MUGEN
An immersive five-scene journey through gate, path, garden, hall, and eternity, staging a fully procedural Japanese world behind flat monumental type, vertical chapter markers, a compact menu, and an authored loading sequence. The senbon-torii walk is paved in procedural flags that follow the corridor's own sway and rise, and the hero gate carries its roof as one swept tapered sweep.
- NODAL
A scroll-driven cinema-prime product story that carries the Series A 40mm from an oversized technical hero through a live object study, cost breakdown, exploded construction, optical trace, three-lens family, and order chapter. One owner-requested optics revision sits over the supplied export: the barrel stops reading as see-through, the front ring is bevelled and engraved, the coated glass mirrors its own studio and shows its rear surface through the front, dust and fibres settle on it, the traced bundles arrive as gradient light rather than hairlines, and the page opens on the ten elements scattered in full light and seats them into the finished lens.
- Kestrel 65
A deeply technical 65-percent keyboard story that keeps one WebGPU product model present through construction layers, switch travel, key groups, topology, section cut, anodised finishes, acoustics, typing angle, and reservation. One owner-requested interaction revision sits over the supplied export: the key under the cursor clicks and springs back, the camera keeps a slow idle orbit under every chapter, and each anodised finish reads as a lit cap set with a seated accent keycap.
- OSCILLA M-1
A Blender-baked synthesiser that opens as an exploded assembly drawing and closes into itself, carried through eleven scroll-linked 3D acts, then opened into a playable 49-key instrument, patch fan, signal chain, production pipeline, specifications, build numbers, and edition cards.
- Halvorsen
The Understory layout and its procedural Three.js glass hands recut as a dark monotone designer portfolio: one neutral grey ramp, a halo-lit headline carried over the lit marble, desaturated photography, and inline SVG work artefacts.
- sublevel.studio
A digital studio and brand workshop presented as a tactile black-and-white operating system: modular project cells, a floating utility dock, service diagnostics, team profiles, lab experiments, and a terminal-like contact close.
- Hanami
A blossom-front almanac and slow-travel story that moves from a living cherry canopy through bloom forecasts, held weeks, quiet routes, seasonal goods, a station map, and a deep-plum booking finale.
- Nagare
A drifting Japanese night market with a lantern-lit waterway, red torii gate, shrine crossing, teahouse, time-of-day controls, and a seven-chapter 3D journey.
- KAIRO Expeditions
A private volcanic island expedition with a floating 3D landscape, day-to-night atmosphere, waterfall suites, cinematic stays, sailing itineraries, and a private enquiry form.
- Moraine 60
An industrial gravel e-bike product story with a live 3D bicycle, frame geometry, moving drivetrain, exploded drive unit, battery details, paint finishes, and a size configurator.
- MØBEL
A luxury interior collection that furnishes an architectural 3D room as you scroll, followed by furniture shopping, a page-turning catalogue, natural materials, and an immersive spaces gallery.
- MATTER
An experimental studio landing page with a kinetic chrome-and-glass sculpture, architectural typography, an interactive object gallery, and a scroll-driven physics playground.
- Vow Atelier
An editorial engagement-ring experience with a live diamond and gold setting, an exploded anatomy view, and a ring atelier for choosing stone cut, setting, band, and metal.
- Tangelo
A cinematic wallet landing page with sculptural blue glass, dimensional serif typography, a guided payment walkthrough, floating cards, a currency calculator, testimonials, and a complete mobile app story.
- The Renaissance Edition
An editorial collection with a classical sculpture, floating celestial objects, gilded details, parallax chapters, collectible artwork, and a story archive.
- The Hunt
A fantasy card-game world with floating collectible cards, an atmospheric forest, elemental weather, three rival factions, an interactive card inspector, and a complete deck-building introduction.
- Ashforge
A pixel-art model foundry with an interactive CRT terminal, a hovering robot, ember-lit ruins, product chapters, model comparisons, pricing, and a cinematic forge footer.
- Nexus Pro X
A precision gaming-controller product story built around a cinematic 3D hero, hardware callouts, adaptive triggers, haptics, performance telemetry, finish selection, and a complete purchase journey.
- AUBE
A warm French bakery journey that follows four bagel flavors from oven to first bite through a tactile 3D story, atelier manifesto, craft process, morning collection, menu, ritual, and visit invitation, opening with a minimal wordmark loading sequence and a staged 3D reveal.
- Aurora Link
A long-form aerospace story that moves from orbital launch into satellite architecture, connectivity, antenna systems, deep-space programs, mission imagery, newsroom chapters, and a cinematic closing transmission.
- Sunseto
A warm solar and home battery landing page with Japanese-inspired illustration, interactive savings, customer letters, and a complete pricing story.
- Sunset 3D
A solar and storage story for Japanese homes, with a live 3D house, falling petals, interactive cost charts, hardware scenes, and linked brand and prompt archives.
- Agentic
A pixel-art spring landscape introduces an AI operating system for founders, followed by interactive product panels and a full launch, growth, and operations story.
- Agent AI
A dark technical AI platform story that turns an intent prompt into a five-phase agent journey, then expands into products, ecosystem architecture, use cases, journal, team, FAQ, and community network.
- AERIX
A cinematic camera-drone ascent that moves through shell architecture, exploded anatomy, power systems, optics, first-person flight, horizon scale, material finishes, and a detailed pre-order finale.
- Ravine
An immersive rainforest held in glass, combining a living 3D ravine, layered roots and canopy, water and limestone studies, tiny inhabitants, field notes, ambient sound, and a guided path toward light.
- Seijaku
A cinematic architectural walk through a private Kyoto residence, pairing a procedural Three.js house and garden with editorial room studies, seasonal states, material details, an interactive floor plan, and an inquiry journey.
- Anteroom
A spatial, brand, and motion studio journey that descends from a sunset-plaster anteroom through a reflective waterline into a submerged archive, luminous pearl, seabed typography, paper menu, and peel-away project contact form.
- Terrane
A cinematic field-geology expedition story that moves from a living desert survey into layered field notes, an interactive journal, a flight through fourteen rock exposures, an aerial lens study, expedition cards, methodology, traveller accounts, questions, and a dusk landscape.
- Arca
A vivid portfolio and membership landing page for makers and galleries, with dimensional Pass cards, a rotating cube identity, oversized typography, image trails, a bending directory, and an interactive testimonial gallery.
- Stillflora
A botanical atelier in blue and blush, with a refractive glass sculpture holding flowers, drifting petals, editorial practice cards, garden notes, and collectible editions.
- Nami
A living koi landing page with an oversized butterfly koi, layered wet scales, a refractive pond, soft typography, and three selectable color studies. Drift, Ripple, and Dusk change the pace and light.
Frequently asked questions
What is included in a Three.js landing page template?
Each template combines a complete page layout with its interactive Three.js or WebGL presentation, preview, and editable implementation source.
How is a landing page template different from a hero section?
A landing page template includes the wider page structure and content flow. A hero section focuses on the opening screen and can be added to an existing site.
Can I customize the template with a coding agent?
Yes. Use the source or copyable prompt as the starting point, then ask your coding agent to change the layout, colors, content, motion, and Three.js scene.
Are the Three.js templates responsive?
The templates are designed for responsive website layouts, but you should still test the final content, controls, and 3D performance on your target devices.