Leonxlnx / golden-temple
git clone https://github.com/Leonxlnx/golden-temple.git
v1.0.0 · 5d ago
A golden-hour Japanese temple built entirely in code with three.js. No models, no textures, no HDRIs. Rendered offline into a 70s 1080p60 film
—
stars, 24h
+79
stars, 7 days · #643
+79
stars, 30 days · #2,867
79
★ total · +79% this week
12
forks · 0 open issues
Star history starts 2026-10-20; the chart appears after the second daily snapshot.
LanguageJavaScript
LicenseMIT
Created2026-10-15 (5d ago)
Last push5d ago
Watchers0
OwnerUser
GitHub topics
Links
- GitHub: github.com/Leonxlnx/golden-temple
- Homepage: https://github.com/Leonxlnx/golden-temple/releases/latest
- Releases · Issues · Hacker News mentions
README excerpt
# Golden Temple A golden-hour Japanese temple complex built entirely in code with three.js, rendered offline into a 70-second 1080p60 film. ## Watch the film **golden-temple-1080p60.mp4** is attached to the latest release: 70 seconds, 1920×1080, 60 fps, H.264, with music. The video is not stored in the repository. ## What this is Everything you see is code. The repository contains no 3D models, no texture files, no HDRIs and no image assets. The buildings, roof tiles, bracket sets, gold fittings, statues, trees, lotus, koi, water, terrain, clouds and sky are all generated by JavaScript when the page loads, and every surface is procedural GLSL injected into three.js's physically based materials. The few textures the scene uses, such as foliage atlases and terrain masks, are computed or drawn onto canvases at load time. The only third-party runtime library is three.js (r186). - About 31,000 lines of JavaScript build a scene of 24.4 million triangles. - The world is deterministic. Every random choice comes from a seeded generator, so each load builds exactly the same scene. - The film has 10 shots of 7 seconds each. Every shot opens on a macro close-up of one detailed object and pulls back to reveal the scene around it. - The film is rendered one frame at a time in headless Chrome. Each frame averages 8 sub-frames, which gives anti-aliasing, motion blur, soft sun shadows and noise-free ambient occlusion. - The music is the one element that is not code: "Finding Movement" by Kevin MacLeod, licensed under CC BY 4.0. It is not included in the repository; a script downloads it (see Music). ## Gallery All stills are single frames from the finished film. Hanging lantern at the pond pavilion (shot 1) Lotus in full bloom (shot 2) Gilt giboshi finial on the bridge railing (shot 3) Wind bell under the pagoda eaves (shot 4) The five-storey pagoda (shot 4) Roof corner of the main hall (shot 6) The golden Amida Buddha (shot 7) The inner sanctum (shot 7) Gilt fitting on a gate pillar (shot 8) The mirror pond (shot 9) The finale: a crane up over the whole precinct (shot 10) ## Quick start Requirements: - Node.js 22 or newer - A browser with WebGL 2 for the interactive preview. The headless tools need Chrome or Edge; they find it automatically, or you can set the `CHROME` environment variable to the executable. - ffmpeg on `PATH` for contact sheets, the film and the music [code] Open . The first load builds the whole world and compiles its shaders, which can take a few minutes on an integrated GPU the first time (shaders are cached afterwards). The status line in the top-left corner shows progress. The page is controlled by URL parameters: | Parameter | Effect | |---|---| | *(none)* | Interactive preview at preview quality. Drag to orbit. Keys `1`–`9` and `0` play shots 1–10, `space` pauses, `f` returns to the free camera, and `c` copies the current camera as a `cam=…&look=…` query. | | `shot=N&t=sec` | One still frame of the film: shot `N`