Procedural Terrain Generation

A real-time 3D terrain generator driven by Perlin noise. Adjust scale, octaves, and elevation to explore natural-looking landscapes created directly in the browser.

Grid: 0 x 0
Seed: 0
Triangles: 0

Terrain Controls

Higher values add detail at a performance cost.

More octaves create rugged details.

Camera

Shortcuts: R regenerate, S save snapshot. Drag on canvas to orbit.

Perlin Noise

This terrain uses layered Perlin noise (fractal Brownian motion) to build natural elevation changes and valleys.

What You’re Seeing

Each frame converts a Perlin noise heightmap into a shaded mesh. The lighting model approximates sun direction to highlight ridges and valleys, demonstrating procedural 3D generation techniques.

Use Cases

  • Game environments and open-world terrain
  • Simulation and robotics test scenes
  • Rapid prototyping for 3D visualization
  • Data-driven art and generative design

Tech Stack

  • Noise: 2D Perlin noise with seeded permutation
  • Rendering: Canvas 2D painter’s algorithm
  • Math: Custom 3D projection + shading