Free Normal Map Generator
Upload a height map, a bump map or a plain diffuse texture and get a tangent-space normal map with a live preview. Choose OpenGL or DirectX output for your engine. The image never leaves your browser.
- Free
- No signup
- Files stay on your device
How to use the Normal Map Generator
A normal map stores the direction a surface faces in every pixel, so a flat polygon catches light as if it had real bumps and grooves. This generator reads the brightness of your image as height, measures the slope with a Sobel filter, and writes a standard tangent-space normal map for Unity, Unreal Engine, Godot or Blender.
- 1Drop a height map or texture onto the tool. Brighter pixels are treated as higher.
- 2Drag Strength until the relief looks right in the preview, and raise Smoothing if a photo produces grainy noise.
- 3Choose the format: OpenGL for Unity, Godot and Blender, DirectX for Unreal Engine.
- 4Turn on Invert height if dark areas should be raised, and keep Tileable edges on for repeating textures.
- 5Download the PNG and import it as a normal map in your engine.
Frequently asked questions
What is the difference between OpenGL and DirectX normal maps?
Only the green channel. OpenGL-style maps (Y+) store "up" as bright green; DirectX-style maps (Y−) store it as dark green. Unity, Godot and Blender expect OpenGL, while Unreal Engine and 3ds Max expect DirectX. If bumps look like dents when lit from above, you have the wrong one, and switching the format here fixes it.
Can I make a normal map from a photo or diffuse texture?
Yes. The generator uses brightness as height, which works well for surfaces where dark really does mean deep: brick, stone, bark, fabric, cracks. It is an approximation, because a photo also contains colour and baked-in shadows. Raise Smoothing to remove noise, and for the best result start from a dedicated height or bump map.
Why is a normal map mostly blue and purple?
Each pixel’s red, green and blue hold the X, Y and Z of a direction. A flat surface points straight out, which is encoded as the colour (128, 128, 255), the familiar lilac blue. Reddish and greenish tints mark where the surface tilts sideways or up and down.
How do I import a normal map into Unity, Unreal Engine or Godot?
In Unity, select the PNG, set Texture Type to Normal map and assign it to the material’s Normal Map slot. In Unreal Engine, import the PNG and check that Compression Settings is Normalmap with sRGB turned off. In Godot, enable Normal Map on a StandardMaterial3D and assign the texture there.
What does the Tileable edges option do?
When it is on, the filter reads pixels from the opposite side of the image at each border, so the normal map repeats without a visible seam as long as the source texture tiles too. Turn it off for one-off images such as a logo or decal, where the left edge should not influence the right.
What is the difference between a height map, a bump map and a normal map?
A height map and a bump map are the same thing: a grayscale image where brightness means elevation. A normal map stores the surface direction itself in three colour channels, which lets the renderer light it more precisely and with less work. This tool converts height to normals; recovering exact heights from a normal map is not possible in general.