All Collections
Editor
Stylebar
Blend mode, Filter, and Backdrop filter
Blend mode, Filter, and Backdrop filter
Saika avatar
Written by Saika
Updated over a week ago

Click "▶" on the style bar to open the style detail menu.

Here you can set the Blend mode, Filter, and Backdrop filter values respectively.

*The backdrop filters feature may not be compatible with some browsers such as Firefox. Please report if you find other issues under specific conditions via chat.

Blend mode

Blend mode allows you to blend the selected box style with its parent box style.

Here are the styles you can choose from.

  • Normal

  • Multiply

  • Screen

  • Overlay

  • Darken

  • Lightne

  • Color-Dodge

  • Color-Burn

  • Hard-Light

  • Soft-Light

  • Difference

  • Exclusion

  • Hue

  • Saturation

  • Color

  • Luminosity

The following image is just an example.

*Cannot be blended with boxes other than the parent box, such as parents of parents.

Filter

You can set the following visual effects for the selected box:

  • Brightness

  • Contrast

  • Saturate

  • Glayscale

  • Sepia

  • Blur

With the Filter feature, you can filter the selected box and all the child elements in the box unlike the Image filter feature in the Box mode that filters the only image box.

The image below is an example.

Backdrop filter

You can set graphical effects such as blurring to the back of the selected box.

Because backdrop filters apply to the back of the selected box, you can see the effect most when the selected box's fill is transparent.

The properties that you can set are the same as the Filter function.

The following image is an example.

Did this answer your question?