isolation Property
Control blending scope and prevent unwanted blend effects with the isolation property.
What is isolation?
The isolation property controls whether an element creates a new stacking context that isolates its contents from the blend effects of elements outside the isolated group.
isolation: isolate
isolation: isolate creates a new stacking context without any visual effect. Its only purpose is to prevent blend modes inside the element from affecting elements outside it.
.card {
isolation: isolate;
/* blend modes of children stay within .card */
}