Skip to content

Masks, blend modes, filters and conic gradients

Show only part of a layer with a mask, blend a layer into what's behind it, adjust it with filters, and fill it with a conic gradient.

These styles change how a layer is drawn, not what's in it. They are reaching workspaces in stages, so you may not see all of them yet.

Mask a layer

A mask decides which parts of a layer show. In the panel on the right, the Mask section offers:

  • Gradient: the layer fades along a gradient. Edit gradient opens its colours, and the canvas shows its handles, as for a fill.
  • Image: an image from your assets is the mask. Fit places it: Cover, Contain or Stretch.
  • Vector: a vector shape on the same page is the mask, and the layer shows only inside it. Pick it under Shape. The shape has to sit outside the layer you mask.
  • None removes the mask.

Mask by sets how the mask is read: Opacity shows the layer where the mask is opaque, and Lightness where it is light, which suits a black-and-white image.

A mask is set per breakpoint, like any style: set a different one, or none, on a smaller screen.

Blend a layer

In the Effects section, Add style, then Blend mode, mixes the layer with what's behind it. It starts as Multiply; the list has the usual modes, from Screen and Overlay to Color and Luminosity.

Filters

In the Effects section, Add style, then Filters, adds a list of filters, drawn in their order:

  • Brightness, Contrast and Saturation;
  • Grayscale, Invert and Sepia;
  • Hue rotate, which turns every colour round the colour wheel;
  • Drop shadow, a shadow that follows the layer's shape, with its X, Y, Blur and colour.

Add filter adds another, up to 12. Drag a filter to change the order, or press Alt+Up or Alt+Down. Each one can be hidden or removed.

Conic gradients

In a fill's colour picker, choose Conic instead of Linear or Radial: the colours sweep round the layer's centre, from the angle you set, like a colour wheel or a pie chart.

When a variant or a hover state turns a solid fill into a gradient, the change animates smoothly in browsers that support it; in others it switches at once.

Updated October 22, 2026