Gradient Map

Overview

Colors a grayscale image such as noise or a height map from dark to light using colors from a palette. The two-node chain ノイズ → グラデーションマップ creates a palette-managed base for a pixel-art texture.

Usage tips

• For pixel art, start with mode = Steps. The number of steps matches the number of palette colors and produces crisp color regions. Smooth is better for non-pixel-art uses such as gradient wallpaper.
• The go-to shading workflow is to create only light and dark values in grayscale, then apply a 3–5-color ramp here. Separating shape/shading from color lets you batch-produce color variants by swapping only the palette.
• When unsure about source, keep the default OKLCH-L, which follows perceived brightness. Alpha is useful for coloring masks.
• Connect palette_create or common_palette_ref to the palette input to participate in project-wide color management.

Common pitfalls

• Only two colors appear: with no palette connected, the node uses the two-color Color A/Color B mode. Check the palette input connection.
• Dark and light colors are reversed: palette order is dark → light. Reorder it or turn invert ON.
• Semi-transparent areas change opacity: preserve_alpha (ON by default) keeps source alpha. When it is OFF, pixels whose source alpha is greater than zero use the ramp color's alpha. Fully transparent pixels remain untouched either way.

Technical details

• The source value (0–1) of each pixel selects a position on the ramp.
• Steps: divides the ramp into equal-width steps and uses the color of the matching step unchanged, producing crisp color regions.
• Smooth: linearly interpolates between adjacent ramp colors.
• Fully transparent pixels remain unchanged and uncolored regardless of preserve_alpha.
• With preserve_alpha ON, nontransparent pixels keep source alpha. With it OFF, those pixels use the selected ramp color's alpha.
• When a palette is connected, a swatch grid appears in the inspector.

Examples

1. Color noise: connect a grass palette to Noise(Perlin) → Gradient Map, then color with Steps to create a tile base.
2. Apply a shading ramp: color a height map from Height From Image with a 3–4-color character skin ramp.
3. Two-color gradient: leave the palette unconnected, set Color A to navy and Color B to light blue, and use steps=4 for a stepped sky background.
4. Color an inverted mask: use invert with a mask from Threshold to reverse its dark and light values before coloring.

Related nodes

• noise_generate — the go-to upstream source for grayscale patterns
• palette_create — build the ramp palette in the graph
• palette_quantize — use this to move an existing color image toward a palette by nearest-color search
• tone_curve — adjust the value distribution before coloring to balance step areas