Signed Distance Fields Overview
Signed Distance Fields Overview
Signed Distance Fields Overview

Signed Distance Fields Overview

Use signed distance fields (SDFs) to create procedural textures like shapes and patterns.

You can use SDFs in place of large custom textures to keep your effect size to a minimum. Using SDFs can also help overcome aliasing issues like jagged edges on scaled-up textures.

For information on how to use SDFs, see the Introduction to Signed Distance Fields tutorial.

Available SDF Operations

PatchDescription

SDF Annular

Creates a ring-like SDF around an SDF shape.

SDF Complement

Creates a complement of an SDF. This makes the inside of the SDF shape become the outside and vice versa.

SDF Difference

Removes one SDF shape from another.

SDF Flip

Flips over an SDF shape around a line. This will create a "mirrored" SDF shape from the original.

SDF Intersection

Intersects two SDF shapes.

SDF Mix

Mixes two SDF shapes.

SDF Repeat

Repeats an SDF shape in a tiled formation around a pivot.

SDF Rotation

Rotates an SDF shape around a pivot.

SDF Rotational Repeat

Repeats an SDF shape around a pivot in a pattern.

SDF Round

Rounds the edges of an SDF shape.

SDF Scale

Rescales an SDF shape on the X and Y axes.

SDF Shear

Skews an SDF shape horizontally or vertically.

SDF Smooth Difference

Removes one SDF shape from another with smoothness applied to the edges where the shape is removed.

SDF Smooth Intersection

Intersects two SDF shapes with smoothness applied to the edges where the shapes intersect.

SDF Smooth Union

Combines two SDF shapes with smoothness applied to the edges where the shapes intersect.

SDF Translation

Moves an SDF shape to a specific point on the X and Y axes.

SDF Twist

Twists an SDF shape around a pivot.

SDF Union

Combines two SDF shapes to make a single SDF shape.

Available SDF Shapes

PatchDescription

SDF Circle

Creates an SDF for a circle shape.

SDF Ellipse

Creates an SDF for an ellipse shape.

SDF Half Plane

Creates an SDF for a half plane. This dissects the screen into two areas divided by a line.

SDF Line

Creates an SDF for a line from one end of the screen to the other.

SDF Polygon

Creates an SDF for a polygon shape.

SDF Rectangle

Creates an SDF for a rectangle or a square shape.

SDF Star

Creates an SDF for a star shape.

Was this article helpful?