Designing Stylized Toon Shading Workflows

In this lesson, you will learn how to transition from basic flat colors to professional-grade cel-shading by mapping light intensity to a custom ramp texture.

The Physics of Toon Shading

In standard PBR (Physically Based Rendering), lighting is calculated using a smooth gradient (often a Lambert or GGX model). To achieve a professional stylized look, we want to replace that smooth falloff with a discrete, stepped transition. We achieve this by calculating the Dot Product between the surface Normal and the Light Direction.

Normally, this dot product returns a value between -1 and 1, representing how much the surface faces the light. In our toon workflow, instead of using this value to multiply color directly, we use it as a UV coordinate to sample a 1D ramp texture.

Implementing the Ramp Workflow

By creating a small, horizontal texture (e.g., 64x1 pixels) with distinct color bands—black, gray, and white—we can force the engine to map the light intensity to these specific hues.

1. Calculate the Dot Product: Use the Dot Product node between the Normal Vector (World Space) and the Main Light Direction.
2. Remap and Sample: Pass that result into the U-coordinate of a Sample Texture 2D node. Because our ramp texture has clear lines, the shading will "jump" between bands rather than fading smoothly.

// Conceptual logic inside a Custom Function node
float3 lightDir = GetMainLight().direction;
float NdotL = dot(normal, lightDir);

// Remap NdotL from [-1, 1] to [0, 1] for texture sampling
float rampUV = (NdotL * 0.5) + 0.5;

// Sample the ramp texture
float3 toonColor = tex2D(_RampTexture, float2(rampUV, 0.5)).rgb;

By tweaking the ramp texture, you can define the "sharpness" of the shadow edge. A crisp vertical line in your texture results in a harsh cel-shaded edge, while a soft gradient creates a "painterly" toon look. This workflow gives you total artistic control over the lighting transition without relying on complex, mathematically heavy shaders.

Key Takeaway: By using the NdotL dot product as a UV input for a 1D ramp texture, you replace smooth light falloff with artistic, customizable shadow bands.