What is 3D Terrain Viewer?

3D Terrain Viewer turns grayscale height map images into interactive 3D terrain. Upload any height map where brightness equals elevation, then orbit around the result to explore it from any angle.

The height map gets sampled into a triangle mesh on load; resolution controls how many vertices are generated (low for fast rotation, high for crisp ridges). Color schemes run from topographic (blue/green/brown/white by elevation) through flat satellite tones to desert, volcanic, and arctic palettes, plus a pure wireframe. Switch to the top-down view for a flat orthographic map, and read the min/max/mean elevation panel to gauge contrast. PNG and JPG height maps both work as long as they're square.

How to use

1. Upload a grayscale height map image (PNG or JPG) where white represents the highest elevation and black the lowest.
2. Adjust the height scale to exaggerate or flatten the terrain, pick a color scheme (topographic, satellite, desert, volcanic, arctic, or wireframe), and set the terrain resolution.
3. Orbit around the terrain by dragging, zoom with scroll wheel, and export a screenshot of your favorite viewpoint as a PNG.

When to use

• Previewing Perlin noise output or Photoshop height maps before importing into Unity or Unreal.
• Turning real-world DEM (digital elevation model) tiles into 3D illustrations for a blog post.
• Sanity-checking a procedural terrain script by exporting a height map and orbiting it.

Result

A game developer uploads a 512x512 Perlin noise height map, sets height scale to 150%, applies topographic coloring, and rotates to find the best camera angle for a mountain pass scene in their RPG.

FAQ

What pixel size should the height map be?

Square images between 256x256 and 1024x1024 work best. The viewer downsamples to the resolution you pick, so a 4096-pixel input gets thinned to about 512 vertices per side at the default setting. Non-square images are stretched to a square footprint.

Why does my terrain look like a flat sheet?

Either the height map has too little contrast (a near-grey image yields a near-flat mesh) or the height scale slider is at the minimum. Try raising height scale to 150-200% and check your source image's histogram in any editor.

Does white always mean high and black always mean low?

Yes. The viewer reads the pixel's grey value and maps it to height directly: 255 (white) is the peak, 0 (black) is the floor. If your height map uses the inverted convention, just flip the Invert heights toggle to correct it on the spot.

Can I overlay a satellite texture or colour map?

Not currently. The viewer uses procedural shading based on elevation, or a wireframe. For real satellite overlays you'd export the mesh to a tool that supports separate diffuse textures, like Blender or QGIS with QGIS2threejs.

How big is the PNG screenshot?

The PNG matches the on-screen canvas resolution, typically around 1200x800 depending on your viewport. The download includes the current camera angle, lighting, and colour scheme, so adjust those before clicking export.

Related Tools