Patterned Facets Generator

Generate hard-edge faceted patterns using layered linear gradients over a colorful base.
Pick a starting point, then customize colors for a multi-stop base gradient.
6
More layers add detail (1–24).
66
Higher values increase opacity and contrast (0–100).

Patterned facets: hard-edge linear layers

This generator stacks multiple grayscale linear-gradients with hard edges (straight “facet” cuts), then adds a multi-stop color linear gradient as the base.

Controls

Palette / Base colors

Pick a palette and customize colors for a multi-stop base gradient.

Facet layers

More layers add more intersecting planes.

Intensity

Controls the alpha + contrast of the grayscale facets.

Fine-tune in the Editor

Click Open in Editor to fine-tune the generated stack: reorder layers, tweak angles, or replace individual facet layers. Use Copy CSS if you prefer to paste the background directly.

Tip

If the pattern feels too busy, reduce Layers or lower Intensity.