Quick summary
Tōrō is a night walk up a mountain to a temple, told in five chapters and rendered live in the browser. One camera moves along one unbroken spline as you scroll, through the approach, the gate, the water garden, the inner hall, and the summit. The visitor never crosses a scene boundary, because there are none. The whole world is built from geometry when the page loads: hall, torii, stone stairs, lanterns, terraced ground, pines, moon, fog, rain, and embers.
Who this template is for
This build is for anyone who wants a scroll experience in three dimensions: a real camera moving through a real world, instead of a stack of pinned sections pretending to be one.
- Studios and brands who want a launch page people describe to someone else afterwards, and who need the craft to survive close inspection
- Cultural, hospitality, and place-led projects with a story that moves along a route
- Builders who want to read a complete WebGL site (world, camera, post chain, and editorial layer) in code small enough to hold in your head
What problem this template solves
Most site templates look fine in a screenshot and fall apart in production. You get interchangeable sections, stock imagery, and nothing that proves craft.
- Template marketplaces sell the same layouts to thousands of buyers, so nothing ends up feeling owned
- Buyers can usually preview a design but almost never see the exact instructions that produced it
- Teams need reference builds that survive contact with real content rather than lorem-ipsum mock-ups
What you get with this template
You get a five-chapter night walk up to a mountain temple, rendered live in the browser: one continuous camera on one unbroken spline, a world built entirely from geometry at runtime, and an editorial layer that tracks the chapter you’re in.
- Five composed chapters along a single camera path (approach, gate, water garden, inner hall, and summit) with no scene swaps or cuts anywhere
- A complete world built procedurally at load: temple hall, gate, torii, stone stairs, lanterns, terraced terrain, pines, moon, fog, rain, leaves, and embers
- The full editorial system on top: a chapter rail, oversized display type, plates in cards, and alpha-keyed foreground cutouts that hand off between chapters
Page sections overview
| Section | Purpose |
|---|---|
| One continuous camera spline | Move a single camera along one unbroken path instead of cutting between scenes |
| A world built at runtime | Construct the whole scene from geometry so nothing has to be modelled or downloaded |
| Hand-rolled post chain | Grade the frame in-house, with no post-processing library |
| Terraced mountain grading | Cut the mountain into flats and steps the way a temple site is graded |
| Chapter-bound foreground | Pin keyed cutouts to the active chapter and hand them off as the camera moves |
Design and branding system
The palette is built from one decision: the only warm light in the world comes from inside something, like a lantern or a paper screen, and everything else is cold.
- Near-black and blue-charcoal hold the world, with warm amber reserved entirely for lantern flame and shoji glow, so light always reads as coming from somewhere
- A single oversized vermilion moon anchors the sky and doubles in the water garden, so the walk has one fixed landmark to orient against
- Type runs in system-only serif and mono against bone white, with no remote font request. Vertical Japanese display type is set as an image instead of a heading
Mobile and speed optimization
This is live 3D, not a video scrub, so the mobile pass is about render budget and reading. Nothing gets swapped out for stills.
- The scene renders at a capped pixel ratio on small screens, so a phone draws the same world without paying for a retina framebuffer
- Layout reflows to a single column with a full-width legibility floor under the copy, because the text sits over the scene and not beside it
- A reduced-motion path drops the camera motion and keeps every word, plate, and chapter, so the complete reading experience survives with the animation switched off
How this template helps you convert
The page earns attention before it asks for anything. The OGtraplord homepage runs on the same logic.
- The strongest visual moment loads first, so visitors like what they see before they read a word
- Every section answers one question and hands off to the next, which keeps the scroll moving toward the call to action
- The ask arrives only after the proof: by the time visitors reach it, the work has already made the argument
Other information about this template
A few notes before you build on this one.
- It’s an original build from a published implementation brief. It uses no third-party source or artwork, and the name, chapter arc, copy, and camera choreography are its own
- There’s no framework, bundler, package manager, build step, analytics, or remote font, and no network request at all after the page loads
- The 3D runtime is vendored from its official distribution with its licence notice kept, so the whole thing runs from static files on any host
- Chapter count, world, and copy are all rebuilt around your story. The camera system, post chain, and editorial layer carry over
How it works
There’s no framework, no bundler, no build step, and no network request after load. The post chain (bloom, ACES tone mapping, film grain, and vignette) is written directly against the renderer rather than pulled from a library. So the only dependency in the build is the core 3D runtime, vendored from its official distribution with its licence notice intact.
On its origins
Tōrō is an original build made from a publicly published implementation brief, which its author offers so others can rebuild or reinterpret the experience. No third-party source or artwork is used here. The code is written from scratch, the imagery was generated fresh, and the name, chapter arc, copy, palette, and camera choreography are its own.
Screenshots
Captured from the live build, section by section, exactly as the template renders.
