100%

Fractal Cathedral

✓ Published0🌍 Public

Last edited May 23, 2025

Created on May 23, 2025

A procedurally generated fractal cathedral rises from recursive architectural elements, featuring repeating towers, transepts, and glowing rose windows that diminish in scale with each iteration. Built with Three.js, the structure uses `BoxGeometry`, `CylinderGeometry`, and custom `BufferGeometry` meshes with `MeshPhongMaterial` surfaces. The scene includes directional and ambient lighting through `DirectionalLight`, `PointLight`, and `AmbientLight` objects, while `OrbitControls` enable interactive camera orbiting, zooming, and panning.

AI-generated description

Three.js Fractal Cathedral

An interactive 3D visualization of a fractal cathedral created using Three.js. This project demonstrates procedural generation of architectural elements with recursive patterns to create a complex cathedral structure.

Features

Recursive generation of cathedral elements
Customizable fractal depth
Interactive camera controls
Realistic lighting and materials

Controls

Click and drag to orbit the camera
Scroll to zoom in/out
Right-click and drag to pan

MIT Licensed

Similar vizzes

Loading thumbnail…

3D Fractal Tree

This example shows a procedurally generated 3D fractal tree, where each branch recursively spawns three smaller sub-branches that tilt at a fixed angle, creating a natural, organic silhouette. The tree grows from a ground plane under ambient, directional, and point lighting, with shadows cast onto the environment. Built with Three.js and its WebGL renderer, the scene uses PerspectiveCamera, OrbitControls, MeshPhongMaterial, and custom branch/connection geometries, and includes interactive orbit controls that are initially disabled, allowing for automatic rotation.

CCurran Kelleher

74% match

Loading thumbnail…

Fork of 3D Fractal Tree

This interactive 3D visualization generates a fractal tree that grows recursively on a dome-shaped terrain, surrounded by a semi-transparent body of water and procedurally puffed clouds. Built with Three.js, it uses a WebGL renderer, perspective camera, and orbit controls for user navigation. The scene employs directional and point lights with shadow mapping, and renders a gradient sky with fog effects for depth.

NNita

73% match

Loading thumbnail…

Neon Fractal Tree

A generative 3D fractal tree is rendered with glowing cyan leaves and purple branch connections, set against an indigo backdrop with a ground plane. The tree is built recursively using Three.js, with branches and spheres formed from cylinder and geometry primitives. The scene includes orbit controls for interactive viewing, directional and point lighting for depth, and shadow mapping to enhance the structure. The visualization demonstrates procedural geometry generation and material effects within a WebGL canvas.

CCurran Kelleher

73% match

Loading thumbnail…

In the Nature

A serene 3D scene depicts a stylized Buddha statue seated before an abstract fractal tree, all rendered in real time with Three.js. The code constructs the tree and Buddha from primitive geometries—cylinders and spheres—using MeshPhongMaterial and WebGL animation. Dynamic camera controls via OrbitControls let viewers explore the scene, while hemispheric and directional lighting, plus shadow mapping, enhance depth. The visualization, written as an HTML module with an import map, uses procedural generation to assemble the organic-looking fractal structure against a sky-blue backdrop.

NNita

70% match

Loading thumbnail…

[EJ] Fork of 3D Fractal Tree

A procedurally generated fractal tree glows with purple leaves against a dark backdrop, rendered in Three.js with WebGL. The animation allows free camera orbit via mouse and WASD movement, while post-processing effects layer over the scene through EffectComposer, UnrealBloomPass for glow, RGBShiftShader for chromatic aberration, FilmPass for grain, and optional GlitchPass, DotScreenPass, and AfterimagePass toggled by keyboard input.

EEJ Fox

69% match

Loading thumbnail…

Sierpinsky Pyramid

This example visualizes a 3D Sierpinski triangle as a pyramid built from smaller tetrahedra that align with the faces of the outer shape. Animated via a recursive generation process, the scene renders with Three.js using WebGL and canvas, while OrbitControls enable interactive rotation. The code constructs pyramid geometries and materials with directional and point lights, casts shadows onto a ground plane, and applies ambient lighting. A green background and double-sided white materials highlight the fractal’s structure as the camera orbits freely.

CCurran Kelleher

68% match

Loading thumbnail…

fractal

This interactive fractal experiment uses recursive circle drawing on an HTML5 Canvas to generate branching, tree-like structures. The visualization responds to mouse movement, with cursor position controlling the fractal’s scale, branch angle, and recursion depth. The code defines a `drawGeometry` function that recursively draws circles, translating and rotating the canvas context at each step, while a `flip` parameter alternates branch direction. Rendering is handled directly through the Canvas 2D API, with event listeners triggering redraws on mouse move. No external libraries are used, relying solely on native browser canvas methods like `ctx.arc`, `ctx.translate`, and `ctx.rotate`.

CCurran Kelleher

67% match

Loading thumbnail…

Menger Sponge

This interactive visualization renders a level 3 Menger Sponge fractal, a 3D shape formed by recursively removing the center cube from each face and the central cube of the remaining structure. The sponge is built with Three.js, using recursive grouping and `BoxGeometry` meshes with `MeshPhongMaterial` shading. The scene includes multiple lighting sources—ambient, directional, hemisphere, and point lights—to highlight the fractal’s deepening cavities. The model slowly rotates via an animation loop, while `OrbitControls` allow the user to rotate, pan, and zoom the view.

CCurran Kelleher

67% match