Normal Map
Upload a height/texture image and generate a real tangent-space normal map with a Sobel filter — entirely in your browser. Preview it live on a lit 3D shape. Runs in your browser — no server call, no tracking, nothing uploaded.
JPG, PNG, WebP — processed entirely in your browser, nothing uploaded
Source (Height Map)
Normal Map
Normal Map Settings
3D Preview
The Sobel Filter
Normal generation here uses a real Sobel edge-detection kernel — the same operator used in classic computer vision — to estimate the surface slope at every pixel from its neighbors' brightness, then encodes that slope direction as an RGB color.
Why Normal Maps Look Purple-Blue
A normal map's RGB channels store the X, Y, Z components of a surface direction vector, remapped from -1..1 into the 0..255 color range. A flat, undisturbed surface always encodes as roughly (128, 128, 255) — a pale blue-violet, which is why every normal map has that same base tint.
OpenGL vs. DirectX Convention
The two major graphics APIs disagree on which direction is "up" in tangent space — OpenGL-style normal maps and DirectX-style ones are mirror images on the green channel. Using the wrong convention in a game engine makes surface detail look inverted, like bumps instead of dents.
Real Texture Detail, No Extra Geometry
Normal maps are how games and real-time renders fake millions of polygons of surface detail — brick mortar, fabric weave, skin pores — on a low-polygon mesh, by perturbing the lighting calculation per-pixel instead of actually modeling the geometry.