Normal map generator.

Maintained by Bake3D · Updated 8 October 2026

What a normal map is

A normal map is a picture that tells a 3D app which way each tiny spot on a surface faces. The app uses it to light the surface as if it had bumps, cracks or grooves. The model itself stays flat, so it stays light enough for games and the web.

Each pixel stores a direction as a color:

• Red is left or right.
• Green is up or down.
• Blue is “straight out of the surface”.

A flat spot is the color (128, 128, 255), the light blue-purple you see in most normal maps. The normal mapping article explains the same color code in more detail.

This tool makes a normal map from one picture. It reads brightness as height: bright spots are high, dark spots are low. Then it measures how steep the height is at each pixel and turns that slope into a color.

How to make a normal map from an image

1. Drop a PNG, JPG or WebP picture on the box above, or try the brick texture.
2. Move the Strength slider until the bumps look right on the lit plane.
3. Use Blur if the surface looks noisy, or Sharpen for crisper detail.
4. Pick the green channel your app reads. See the list below.
5. If your picture is a tiling texture, turn on Wrap edges. Check the edges with Tile 2 × 2.
6. Pick a size and download the PNG.

Your picture never leaves your computer. All the work happens in your browser, in a background worker, so the page stays smooth even with a 4K texture.

OpenGL or DirectX: which green channel?

Apps agree on red and blue, but not on green. Some read green as “up”, others as “down”. If you pick the wrong one, bumps look like dents.

• OpenGL (Y+): Blender, Unity and Godot read this kind by default.
• DirectX (Y-): Epic’s Fab store asks for DirectX normal maps unless the file name says OpenGL. Unreal Engine’s texture settings have a Flip Green Channel box to switch a map from one kind to the other.

The download’s file name ends in -gl or -dx, so you can tell them apart later. The preview always looks right, because it reads the map the way you picked.

The other settings

Strength sets how deep the bumps look. 0 is flat. The default, 3, is a good start for most textures. Photos with soft light often need more.

Blur or sharpen. Blur smooths the height before the slope is measured. It hides noise, film grain and JPEG blocks. Sharpen does the opposite and makes small detail stand out. The blur size is in pixels of your full picture, so the preview and the download match.

Edge filter. The slope is measured with a small grid of weights around each pixel. Sobel is the classic choice. Scharr weighs the neighbours a little differently, so diagonal lines come out more even. Both are described in the Sobel operator article.

Invert height. Use this when dark parts of your picture should be high, such as white grout lines on dark tiles.

Wrap edges. For textures that repeat, the left edge continues from the right edge, and the top from the bottom. With wrap on, pixels at the edge look across to the other side, so no line shows where two tiles meet. Leave it off for a single picture, like a logo.

Use the map in your app

Blender. Add an Image Texture node with the map and set its color space to Non-Color. Connect it to a Normal Map node, then to the Normal input of your shader.

Unity. Select the PNG and set Texture Type to Normal map. Then use it in your material’s Normal Map slot.

Godot. Turn on Normal Map in a StandardMaterial3D and load the PNG into its texture slot.

Unreal Engine. Import the PNG. Open the texture and check that its compression is set for normal maps and that sRGB is off, because the colors stand for directions, not shades. If you made an OpenGL map, tick Flip Green Channel.

What this tool cannot do

A picture only shows color, not depth. This tool guesses height from brightness, and that guess has limits:

• Shadows read as dents. A dark shadow beside a stone looks like a hole. Pictures with flat, even light work best.
• Colors read as height. A red stripe on white paint is darker, so it comes out lower, even if the wall is flat.
• The outline does not change. A normal map changes lighting only. The edge of the model stays straight. For real shape, you need more polygons or a displacement map.
• It does not bake from a 3D model. To copy the detail of a high-poly model onto a low-poly one, bake the normal map in Blender. Our guide on how to reduce polygon count covers the low-poly side.
• The PNG is 8-bit. Each channel has 256 steps. That is standard for game textures. Some film work needs 16-bit maps, which this tool does not make.

The tool reads pictures up to 32 MiB and 8,192 pixels per side, up to 40 megapixels in total.

How we tested it

Automated tests check the math on pictures with known answers:

• A ramp that rises 0.05 per pixel gives exactly the expected color, with both Sobel and Scharr.
• A ramp that rises down the picture gives green above 128 in OpenGL mode and below 128 in DirectX mode. Red stays the same.
• A round bump gets a green top edge in OpenGL mode, so it looks lit from above. The peak stays (128, 128, 255).
• With wrap on, shifting a repeating pattern by 5 pixels shifts the normal map by exactly 5 pixels, edges included. With wrap off, the edges differ.
• Every pixel decodes to a direction of length 1, within rounding.
• A map made at half size matches the full-size map within 1 color step.

We also timed it in Chrome on a Mac. A 4096 × 4096 PNG showed its first preview in about 0.4 seconds. After that, each change redrew the 1024-pixel preview in about 10 milliseconds. Saving the full 4096 × 4096 normal map took 0.24 seconds, or 0.8 seconds with a 4-pixel blur. An 8192 × 4096 picture, the widest size the tool takes, saved in under half a second.

Common questions

Is my picture uploaded?

No. The picture is read and turned into a normal map inside your browser. Nothing is sent to Bake3D or anyone else. The PNG is made on your computer.

Why do the bumps look like dents in my game engine?

The green channel is the wrong way round for that app. Download again with the other green channel setting. Or flip the green channel in the app, such as Unreal’s Flip Green Channel box.

How do I make a tileable normal map?

Start from a texture that already tiles, then turn on Wrap edges. Use Tile 2 × 2 in the preview to check that no line shows between the copies. Wrap cannot fix a picture whose sides do not match in the first place.

What is the difference between a normal map, a bump map and a height map?

A height map is gray: brightness means height. A bump map is a height map used for lighting. A normal map stores the direction of the surface, already worked out, as color. Most game engines use normal maps, because the direction is ready to use and costs less to draw.

Which size should I download?

Full size keeps every detail. Pick 2048 or 1024 pixels if the texture will be small on screen, such as on a phone game. The smaller map is made from the full picture, so the bumps look the same, just with less fine detail.

Can Bake3D make the whole 3D model too?

Yes. Bake3D turns one picture into a textured, rigged and animated 3D character for your engine. See image to 3D and the game graphics workflow.