Note: Browser support for filters
Backdrop filters are currently not supported in Firefox.
Certain combinations of features may not work in some browsers.
Setting filters on a box
Select the box you want to edit.
In the right panel, select the [Box] tab.
If the panel is closed, open the right panel.
Click the [Filter] field in the [Appearance] menu.
In the filter panel, switch between the [Blend], [Filter], and [Backdrop Filter] tabs to configure each filter setting.
Tip: When setting a color for a filter, see the article on Setting colors with the color palette.
Blend Mode
Blends the style of the selected box with the style of the box behind it (its parent). Styles within the selected box are also included in the blend.
The following options are available:
Normal
Multiply
Screen
Overlay
Darken
Lighten
Color Dodge
Color Burn
Hard Light
Soft Light
Difference
Exclusion
Hue
Saturation
Color
Luminosity
The following image shows an example.
*Blending can only be applied to the immediate parent box — it cannot be applied to grandparent or other non-adjacent boxes.
Filter
You can apply the following visual effects to the selected object:
Brightness
Contrast
Saturation
Grayscale
Sepia
Blur
Unlike image filters that can be applied to image boxes in Box mode, this filter affects the selected box and all elements within it. The following image shows an example.
Backdrop Filter
You can apply filter (visual effects) to the area behind the selected box.
Unlike blend modes, filters, and other features, backdrop filters work best when the selected object's "fill" is transparent.
The available settings are the same as the Filter feature. The following image shows an example.
dome