The CSS `isolation` property

Creates a new stacking context so descendants do not blend with content outside the component.

32 effects in the catalog use this property.

Syntax

isolation: isolate | auto;

Watch out

This is the clean way to contain a component that uses `mix-blend-mode`; it avoids hacks such as `opacity: .999`.

These are working effects from the catalog. Open a tile to inspect the full source.