A texture with no image behind it

Procedural texture builder

An image texture is a lookup: coordinates in, stored colour out. A procedural texture is a function: coordinates in, computed colour out. Nothing is stored, so there is no resolution to run out of and no file to load — but every pixel pays for the arithmetic, every frame. Build one below and watch it wrap onto a torus.

The function, evaluated over the unit square —
Hover to read the function's value

This is not an image — it is the same function you would run in the fragment shader, sampled once per pixel of this panel. Blow the panel up and it stays sharp, because there is nothing to interpolate.

Mapped onto a torus —
Drag to rotate

The torus's texture coordinates run 0 to 1 around each of its two circles. With scale at 1 you would get exactly one tile stretched over the whole surface, which is why the notes' checkerboard example uses 8.

Coordinate under pointer
—
Function value there
—
Storage cost
0 bytes
Cost per pixel
—
Parameters —
8
0.50
0.50
The fragment shader live 

      

    

  


  

    

      The trade you are making. A procedural texture costs no memory and no bandwidth, has infinite resolution, and can be varied endlessly by changing a seed — which is why terrain, clouds, wood and marble are so often generated rather than painted. Against that: it burns arithmetic on every fragment of every frame, it is far harder to art-direct than opening an image editor, and it cannot be mip-mapped for free, so it tends to alias in the distance exactly where an image texture would have been getting cheaper. Most real materials use both — a painted albedo with procedural detail layered on top.