Use on my site

The SVG and image hold only the pattern. The sample text, guides and zone outlines are left out.

Share link

The whole design is stored in the link itself. Nothing is uploaded.

Repeating tile

Responsive preview

The exported SVG inside common section sizes. With “slice”, the pattern fills the box and crops the overflow, so zones keep their relative position.

Custom shape

Paste SVG path data or choose an .svg file. The shape is scaled to fit one cell and placed on the grid.

Keyboard shortcuts

Fine-tune\
Select, Zone, Shape toggle, BrushV Z T B
Peak tool (Halftone dots)P, Shift + click adds a peak
Pan view / pan patternSpace drag, ShiftSpace drag
Heat map, guidesM G
Fit, 100%, zoomF 0 + −
Undo, redoCtrlZ, CtrlShiftZ or CtrlY
Delete selected zone, peak or fill shapeDelete
Nudge selection 1 px / 10 pxArrows, Shift + arrows
Zone intensity, peak strengthAlt + scroll over it
Brush size[ ]
Deselect, cancelEsc
ShuffleS
Save project, export SVGCtrlS, CtrlE