Normal Map Generator
Drop an image. Get a tangent-space normal map. In your browser, in milliseconds — your file never leaves the tab.
Your image never leaves the tab. The whole thing runs on your GPU.
TL;DR. Drop any photo, drawing, or height map. The tool reads the brightness, derives surface direction, and outputs an RGB normal map. Strength slider controls how dramatic the bumps look. The Invert Y toggle swaps between OpenGL (Blender, Godot, Three.js) and DirectX (Unreal, Unity).
How it actually works
I’ve been making normal maps since 2009, and the trick hasn’t changed much. A grayscale image has brightness at every pixel. Brightness implies height. Two adjacent pixels with different brightness imply a slope. A slope is a surface direction. Encode that direction as an RGB triple and you’ve got a normal map.
This tool runs a Scharr gradient over the input on your GPU, accumulates surface direction across a couple of scales, and writes out the result in tangent space. It takes under five milliseconds for a 1K image on a laptop from 2020. The whole thing fits in a shader — no servers, no sign-up, no rate limit. The model does the heavy lifting; I just wrote the wrapper.
From an image. Or a height map. Or a holiday photo.
Three kinds of input work well:
- A photo of a real surface — brick, concrete, fabric, bark. Anything where the lighting in the photo roughly matches a flat overhead light works fine. Strong shadows confuse the gradient.
- A greyscale height map — white is high, black is low. This is the cleanest input. The result is technically correct, not just plausible.
- A drawing or pattern — line art, a tile texture, a noise pattern. Treat it like a height map: bright is up.
If your image is bigger than 2048×2048, the tool downsamples on the way in. That’s a deliberate cap to keep your tab responsive. Most normal maps end up shipping at 1K or 2K anyway, so you’re not losing much.
OpenGL or DirectX? Flip the green channel.
Nine times out of ten, when a normal map looks “lit from the inside of the model”, the green channel is pointing the wrong way. Your DCC saved an OpenGL normal map. Your engine is reading it as DirectX. They’ve been going through a rough patch about which way is up since the late nineties.
The cheat sheet:
- OpenGL (Y up) — Blender, Godot, Three.js, glTF spec. Toggle Invert Y on.
- DirectX (Y down) — Unreal Engine, standard Unity. Toggle Invert Y off.
If your engine isn’t on either list, it’s probably OpenGL. If your map still looks wrong after flipping, drop a question on the community page — somebody’s seen it before. (For the long version, I wrote a whole guide on what a normal map actually is, including the OpenGL/DirectX flip in proper detail.)
For Blender users
Blender is OpenGL by default, so leave Invert Y on when you download. Drop the PNG into a Principled BSDF’s Normal input via a Normal Map node — the node has its own “Space” setting; leave it on Tangent. If the bumps look too aggressive, lower the strength input on the Normal Map node before you re-bake the map at a lower strength here. It’s faster.
If you’re baking a normal from a high-poly mesh inside Blender, you don’t need this tool — Blender’s native bake is more accurate. This tool is for the case where all you’ve got is an image and no high-poly source.
A free alternative to the Photoshop NVIDIA filter
The Photoshop NVIDIA Texture Tools normal-map filter still exists, still works, and still nobody can find it the first time. It’s also Photoshop-only, which is a lot of subscription fee for a single filter. This tool does the same job in a browser tab. Drop the image, drag the strength slider, hit download. Open the result in Photoshop later if you want to clean it up by hand.
The other classic offline tools — AwesomeBump, Materialize, NormalMap Online, xNormal’s Photoshop plugin — all do good work. If you already have one of them dialled in, keep using it. The novelty here is that this one is one URL, zero installs, and no upload of your art to a third party.
What about an AI normal map generator?
This tool is deterministic. Same input, same output, every time — because it’s a shader, not a model. If you want a normal map generated from a text prompt (no source image needed), that’s the AI texture generator on the homepage. Describe a surface in words, get a full PBR set including a normal map. The first three runs are free; sign-up only matters after that.
Rule of thumb: have a photo or height map? Use this tool. Have only a description in your head? Use the AI one. They cover different jobs.
Straight answers
What is a normal map?
An RGB image where every pixel encodes the surface direction the renderer pretends to see. Red is the X tilt, green is the Y tilt, blue is the part facing the camera. That’s why an unused normal map looks mostly purple. Long version over here.
Normal map vs bump map — which one should I use?
In 2026, almost always a normal map. A bump map is one channel (greyscale height); a normal map is three (surface direction). For the same memory cost, a normal map gives believable lighting from every angle. Bump maps survive for tiny details on top of an already-normal-mapped surface.
Why is my normal map purple?
Flat surface direction in tangent space is RGB (128, 128, 255) — slightly blue-tinted purple. The areas of your map that aren’t purple are where the surface is sloping. If your whole map is purple, your input image was completely flat brightness. Try increasing strength.
Does this work for game assets in Unity and Unreal?
Yes. Unreal and standard Unity are DirectX — keep Invert Y off. Unity’s HDRP also defaults to DirectX. Unity URP, depending on your version, may want OpenGL — if your URP material looks wrong, flip the green channel.
How big can the input be?
Up to 2048×2048. Larger images are downsampled on the way in. The output matches the post-downsample size. If you genuinely need a 4K normal map, generate at 2K here and upscale in your DCC.
Is the result really CC0?
The tool is free to use and outputs whatever you upload. If your input image is yours, the output is yours. If you uploaded somebody else’s art, that’s on you — the licence of the source still applies.
One last thing
A normal map is a lie that lighting believes. If yours looks wrong, nine times out of ten it’s the green channel. Check the flip before you blame the engine.
Need a full PBR set instead? Try the AI texture generator — describe the surface, get albedo, normal, roughness, AO, and metalness in one go. Browsing for inspiration? The community library has thousands of CC0 PBR materials to start from.
Built by Voise. 3D artist since 2009. Melbourne. Drop me a line via the community page if a render breaks — I read everything.