⧉Compose

Layer order, blend modes, masks, dynamic props and groups — the rules for stacking components into one effect. — 6 entries

Moves in browsers that support WebGPU

This device could not render the demo — showing a still

A container that groups shader layers and lays them out together.

Moves in browsers that support WebGPU

This device could not render the demo — showing a still

Layers draw from bottom to top, and an effect applies to layers drawn before it.

Moves in browsers that support WebGPU

This device could not render the demo — showing a still

A blend mode defines how a layer's colors combine with the layers beneath it.

Moves in browsers that support WebGPU

This device could not render the demo — showing a still

A mask uses another layer's alpha or brightness to decide where an image remains visible.

Moves in browsers that support WebGPU

This device could not render the demo — showing a still

Props can update each frame from animation, pointer position, or values sampled from another layer.

Moves in browsers that support WebGPU

This device could not render the demo — showing a still

Define a new pixel effect with `defineShader` when the built-in components cannot express it.