← Basalt vault

Monolith

Brands carved from what lasts.

Fig. 1 — Monolith, live capture10 s loop · recorded frame by frame on GPU

Field notes

A floating hexagonal basalt monolith split by glowing cyan fissures, with drifting debris, a light shaft, and pointer parallax. Procedural GLSL stone — no textures, no models, no network.

Monolith is a single-screen hero built around one object: a hexagonal basalt column hanging in the dark, split by a fault line that glows from inside. The stone, the fractures, and the light are all procedural GLSL — there is not a single texture, model, or HDR file to download.

Everything moves on a 10-second loop — a slow sway, a gentle rise and fall, energy travelling up the cracks — so the page feels alive without ever feeling busy. Pointer parallax tilts the column toward the visitor, and the whole scene rests for anyone who prefers reduced motion.

Inside the prompt

Every file below is written out in full, so your agent creates the project exactly — no guessing, no missing pieces.

monolith-3d/
├─ .gitignore
├─ index.html
├─ package.json
├─ tsconfig.json
├─ vite.config.ts
└─ src/
   ├─ App.tsx
   ├─ index.css
   ├─ main.tsx
   ├─ vite-env.d.ts
   ├─ components/
   │  ├─ HeroOverlay.tsx
   │  └─ MonolithScene.tsx
   ├─ lib/
   │  └─ loop.ts
   └─ shaders/
      └─ monolithShader.ts

Recut it

  • Rename the brand and rewrite the pitchsrc/components/HeroOverlay.tsx → HeroOverlay
  • Recolor the glowing fissuressrc/shaders/monolithShader.ts → cyan
  • Move or reshape the fault linesrc/shaders/monolithShader.ts → fissure()
  • Place the stone left, right, or centeredsrc/components/MonolithScene.tsx → useLayout()
  • Slow down or speed up the whole scenesrc/lib/loop.ts → LOOP

Also in the vault