Tiny Online Tools
The maps you were not given
Texture packs rarely ship every map a PBR material needs. You get a photo and a height map, or a normal map baked for the wrong engine, or a glossiness map when your renderer wants roughness. This free online tool turns what you have into what you need, in the browser.
Height map to normal map
A height map stores elevation as brightness; a normal map stores a direction per pixel. Converting means taking the gradient of the height field and building the surface normal from it: N = normalize(-dh/du, -dh/dv, 1).
The gradient is estimated with a 3x3 Sobel kernel rather than a plain pixel difference, because 8-bit height maps quantise badly and a raw difference turns that quantisation into visible faceting. Strength scales the gradient before it is normalised: low values give a subtle surface, high values exaggerate the relief. Add pre-blur if your source bands on gentle slopes.
Flip green: the OpenGL vs DirectX problem
The most common normal map bug in 3D, with a one-line fix. Tangent space has its V axis pointing up, but images are stored top-down, and two conventions grew out of that disagreement:
- OpenGL / glTF / Blender / Unity / Godot — green is +Y, pointing up. Also called Y+.
- DirectX / Unreal Engine / 3ds Max — green is -Y, pointing down. Also called Y-.
Use the wrong one and nothing errors out. The surface simply lights from the wrong vertical direction: bumps read as dents and screw heads look punched in. It looks plausible, which is why it survives to a final render.
The fix is g = 255 - g — invert the green channel and nothing else, which is exactly what Invert green channel does. The operation is its own inverse, so it converts in both directions.
Normal to height, honestly
Recovering height from a normal map means solving a Poisson equation, so this tool integrates the slope field and runs relaxation passes to remove the drift. Raise the pass count if soft gradients appear where the surface should be flat. Only relative depth is recoverable, so the result is normalised.
Roughness, glossiness and occlusion
Desaturate to roughness uses perceptual luminance rather than a channel average; fix its range afterwards with levels. Invert map converts roughness to glossiness or smoothness and back. Ambient occlusion from height scans outwards in several directions from each pixel and darkens it by the steepest horizon it finds — the height scale slider supplies the depth a greyscale image lacks.
Everything runs on your device through the browser's own canvas APIs; no texture is uploaded.