Why does my procedural grid alias?

Sharp edges (lines) at sub-pixel scales hit Nyquist. The screen pixel covers area in UV space that crosses many grid lines at distance, and without filtering, you sample one specific UV value — aliasing flicker as the camera moves.

How does fwidth-based AA help?

fwidth(uv) returns the per-pixel UV change in screen space. Use this as line thickness: smoothstep edges over the screen-space width so the grid line is always ~1 pixel wide regardless of distance. Self-anti-aliasing.

Can I just use a texture?

Yes — bake the grid into a texture with mipmaps and anisotropic filtering. Hardware filtering handles distance gracefully. Procedural is sharper close-up and dynamic; texture is cleaner far away. Often hybrid: procedural near, texture far, blend.

Fix: Unity Shader Graph Procedural Grid Aliasing

Quick answer: Use fwidth(uv) to compute screen-space derivative; bias line width by it. Lines self-AA, staying ~1 pixel wide at all distances.

A procedural grid floor shader. Close up: crisp lines. Mid-distance: looks fine. Far distance: shimmer everywhere as the camera moves. Classic aliasing of sub-pixel features.

The Math Behind It

A pixel at far distance covers ~10 units of world space. With grid lines every 0.5 unit, the pixel spans ~20 lines. Whichever UV value the pixel happens to sample determines whether the pixel reads “line” or “empty”. Sub-pixel jitter causes flicker.

The Fix: Derivative-Based Width

// Pseudo-HLSL from Shader Graph Custom Function
float GridAA(float2 uv, float lineWidth) {
    float2 coord = frac(uv);
    float2 distToLine = min(coord, 1.0 - coord);
    float2 screenWidth = fwidth(uv);
    float line = min(
        smoothstep(0.0, screenWidth.x, distToLine.x),
        smoothstep(0.0, screenWidth.y, distToLine.y)
    );
    return 1.0 - line;
}

fwidth scales the smoothstep edge by screen-space pixel width. Lines stay ~1 pixel regardless of distance.

In Shader Graph

Wire this as a Custom Function node, or replicate the math with Subtraction, Fract, Min, fwidth (DDX+DDY), and Smoothstep nodes. The fwidth equivalent is length(ddxy).

Distance Fade

Combine with a distance-based fade to reduce grid contrast at far distance. Reduces the visual impact of any residual aliasing:

float distanceFade = saturate(1.0 - distance / fadeRange);
gridColor *= distanceFade;

The grid fades into the floor color at distance. Even imperfect AA is hidden by reduced contrast.

Alternative: Texture-Based

For static grids, bake to a power-of-two texture with mipmaps and aniso. GPU filtering handles distance for free. Less flexible (can’t change spacing at runtime) but zero aliasing concerns.

Verifying

Move the camera away from the grid. With AA, lines stay clean at distance, neither shimmering nor disappearing. Without, you see distinct flicker patterns. Compare side by side to confirm.

“Procedural patterns need derivative-based AA. fwidth tells you how much UV space a pixel covers; size lines accordingly.”

The same fwidth pattern works for hex grids, brick patterns, line art — any procedural sharp-edge shader.