Masking and blending

How blend modes and masks combine components in the design editor.

What's covered

  • How blend modes affect stacked layers
  • Applying different blend modes between components
  • Using masks to control where an effect is visible
  • Choosing between alpha and luminance masking
  • Combining several components into one composition
  • Trying different combinations to find new effects

Key concept

A blend mode sets how a layer combines with the layers below it, like CSS mix-blend-mode. A mask sets where a layer shows, like CSS mask-image. Together they produce results no single component does on its own.