Developing Toon Shading with Custom Light Ramps

In this lesson, you will learn how to replace standard, smooth PBR lighting with custom light ramps to achieve a sharp, illustrative aesthetic for your stylized game environments.

Breaking the Smooth Gradient

Standard physically-based rendering (PBR) uses the dot product of the light vector and surface normal to calculate a smooth, linear transition between light and shadow. To achieve a "toon" look, we need to replace this continuous gradient with a discrete, stepped lookup—a light ramp.

A light ramp is essentially a small 1D texture that maps the input light intensity (0 to 1) to specific colors or threshold values. Instead of the light intensity determining the direct brightness, we use that intensity as a UV coordinate to sample our ramp texture.

Implementing the Ramp Logic

To create this in Shader Graph, follow these steps:

1. Calculate NdotL: Use the Dot Product node with the Normal Vector (World Space) and the Main Light Direction.
2. Smoothstep: To prevent flickering, use a Smoothstep node on your NdotL value to define the hardness of your shadow edge.
3. Sample the Ramp: Use this result as the U coordinate for a Sample Texture 2D node. Set the texture wrap mode to Clamp to ensure the shadows don't repeat unexpectedly.
4. Multiply: Multiply your Base Color by the output of this ramp sample to apply the discrete lighting.

// Conceptual logic for the light ramp sampling
float NdotL = dot(Normal, LightDir);
float shadowEdge = smoothstep(0.48, 0.52, NdotL); 
float3 toonLighting = tex2D(RampTexture, float2(shadowEdge, 0.5)).rgb;
return BaseColor * toonLighting;

By manipulating the ramp texture—such as adding a hard transition in the middle or a subtle secondary highlight—you dictate exactly how the light wraps around your character or object. This gives you artistic control over the lighting "bands," moving away from realism and toward a hand-painted or cel-shaded visual style.

Key Takeaway: By using the light intensity as a UV coordinate for a 1D texture, you replace smooth light gradients with precise, stylized color bands that define the aesthetic of your game world.