Power Your Software Testing with AI and Cloud

Supercharge QA with AI for Faster & Smarter Software Testing

Start free Testing

Next-Gen App & Browser Testing Cloud

CSS Masks

By using CSS masks, you can mask part of an element using another element or image.

Last updated on : 2026-02-09

Browser Versions

IE

Edge

Firefox

Chrome

Safari

Opera

5.5 - 11

12 - 17

18 - 120

121 - 144

2 - 3

3.6 - 52

53 - 150

4 - 121

122 - 147

3.2 - 3.1

4 - 15.2

15.5 - 26.3

9.5 - 12

15 - 105

106 - 125

Fully Supported

Partially

No Support

Browser Compatibility

CSS Masks on IE is not supported on any IE versions.

CSS Masks on Edge is fully supported on 121-144, partially supported on 18-120, and not supported on 12-17 Edge versions.

CSS Masks on Firefox is fully supported on 53-150, partially supported on 3.6-52, and not supported on 2-3 Firefox versions.

CSS Masks on Chrome is fully supported on 122-147 and partially supported on 4-121 Chrome versions.

CSS Masks on Safari is fully supported on 15.5-26.3, partially supported on 4-15.2, and not supported on 3.2-3.1 Safari versions.

CSS Masks on Opera is fully supported on 106-125, partially supported on 15-105, and not supported on 9.5-12 Opera versions.

CSS Masks on Safari on iOS is fully supported on 15.5-26.3 and partially supported on 3.2-15.2 Safari on iOS versions.

CSS Masks on Android Browser is fully supported on 120-144 and partially supported on 2.3-119 Android Browser versions.

CSS Masks on Opera Mobile is fully supported on 80-80, partially supported on 64-73, and not supported on 10-12 Opera Mobile versions.

CSS Masks on Chrome for Android is fully supported on 120-144 and partially supported on 97-119 Chrome for Android versions.

CSS Masks on Firefox for Android is fully supported on all Firefox for Android versions.

CSS Masks on Samsung Internet is fully supported on 25-29 and partially supported on 4-24 Samsung Internet versions.

Browser Support for CSS Masks

CSS Masks on Chrome

CSS Masks on Safari

CSS Masks on Firefox

CSS Masks on Internet Explorer

CSS Masks on Opera

CSS Masks on Edge

References

Data sourced from

92

High

Overall Browser Compatibility Score

Note:CSS Masks shows a browser compatibility score of 92. This is a collective score out of 100 to represent browser support of a web technology. The higher this score is, the greater is the browser compatibility. The browser compatibility score is not a 100% reflection for every browser and the web technology support. However, it does give you an estimate on how much you should rely on a particular web technology in terms of browser compatibility.

Test on 3000+ browsers for CSS Masks & more

Test your website for CSS Masks and other web technologies. Get 100 FREE automation test minutes!

More Web Technologies

CSS
HTML 5
SVG
JS API
Security
JavaScript
Other Web Technologies

CSS background-attachment

Background-clip: text

CSS3 Background-image options

background-position-x & background-position-y

CSS background-repeat round and space

CSS3 Border images

CSS3 Border-radius (rounded corners)

calc() as CSS unit value

ch (character) unit

CSS all property

CSS :any-link selector

CSS @apply rule

CSS Counter Styles

CSS Backdrop Filter

CSS background-position edge offsets

CSS background-blend-mode

CSS box-decoration-break

CSS3 Box-shadow

CSS Canvas Drawings

CSS caret-color

CSS Cascade Layers

Case-insensitive CSS attribute selectors

CSS clip-path property (for HTML)

CSS print-color-adjust

CSS color() function

CSS Conical Gradients

CSS Container Queries (Size)

CSS Containment

CSS content-visibility

Crisp edges/pixelated images

CSS Cross-Fade Function

:default CSS pseudo-class

Explicit descendant combinator >>

CSS Device Adaptation

:dir() CSS pseudo-class

CSS display: contents

CSS element() function

CSS Environment Variables env()

CSS Exclusions Level 1

CSS Feature Queries

CSS filter() function

CSS Filter Effects

::first-letter CSS pseudo-element selector

CSS first-line pseudo-element

CSS position:fixed

:focus-visible CSS pseudo-class

:focus-within CSS pseudo-class

CSS font-display

CSS font-stretch

CSS Generated content for pseudo-elements

CSS Grid Layout (level 1)

CSS hanging-punctuation

:has() CSS relational pseudo-class

CSS Hyphenation

CSS3 image-orientation

:in-range and :out-of-range CSS pseudo-classes

:indeterminate CSS pseudo-class

CSS Initial Letter

CSS initial value

LCH and Lab color values

letter-spacing CSS property

CSS Logical Properties

CSS ::marker pseudo-element

:is() CSS pseudo-class

CSS math functions min(), max() and clamp()

Media Queries: interaction media features

Media Queries: resolution feature

CSS3 Media Queries

Blending of HTML/SVG elements

CSS Motion Path

selector list argument of :not()

selector list argument of :nth-child and :nth-last-child CSS pseudo-classes

:optional CSS pseudo-class

CSS overflow property

CSS overflow-anchor (Scroll Anchoring)

CSS overflow: overlay

CSS overscroll-behavior

CSS page-break properties

CSS Painting API

::placeholder CSS pseudo-element

:placeholder-shown CSS pseudo-class

CSS :read-only and :read-write selectors

Rebeccapurple color

CSS Reflections

CSS Repeating Gradients

CSS resize property

CSS revert value

#rrggbbaa hex color notation

CSS Scroll-behavior

CSS @scroll-timeline

CSS scrollbar styling

CSS 2.1 selectors

::selection CSS pseudo-element

CSS Shapes Level 1

CSS Scroll Snap

CSS position:sticky

CSS Table display

CSS3 text-align-last

CSS text-indent

CSS text-justify

CSS text-orientation

CSS3 Text-shadow

CSS touch-action property

CSS3 Transitions

CSS unset value

CSS Variables (Custom Properties)

CSS widows & orphans

CSS writing-mode property

CSS3 attr() function for all properties

CSS3 Box-sizing

CSS3 Cursors (original values)

CSS grab & grabbing cursors

CSS3 Cursors: zoom-in & zoom-out

CSS currentColor value

Window.devicePixelRatio

ui-serif, ui-sans-serif, ui-monospace and ui-rounded values for font-family

CSS Flexible Box Layout Module

gap property for Flexbox

display: flow-root

system-ui value for font-family

CSS font-feature-settings

CSS3 font-kerning

CSS Font Loading

CSS font-size-adjust

CSS font-smooth

Font unicode-range subsetting

CSS font-variant-alternates

CSS font-variant-numeric

@font-face Web fonts

getComputedStyle

CSS inline-block

Intrinsic & Extrinsic Sizing

CSS justify-content: space-evenly

High-quality kerning pairs & ligatures

CSS min/max-width/height

CSS3 Multiple backgrounds

CSS3 Multiple column layout

CSS3 object-fit/object-position

CSS outline properties

CSS pointer-events (for HTML)

prefers-color-scheme media query

prefers-reduced-motion media query

rem (root em) units

display: run-in

Scoped attribute

SVG in CSS backgrounds

text-decoration styling

text-emphasis styling

CSS3 Text-overflow

CSS text-size-adjust

CSS text-stroke and text-fill

CSS3 2D Transforms

CSS3 3D Transforms

TTF/OTF - TrueType and OpenType font support

CSS user-select: none

Small, Large, and Dynamic viewport units

Viewport units: vw, vh, vmin, vmax

CSS -webkit-user-drag property

CSS will-change property

CSS3 word-break

CSS3 Overflow-wrap

CSS @when / @else conditional rules

CSS font-palette

CSS Container Query Units

CSS property: accent-color

types: <color>: `color-contrast()`

types: <color>: `hwb()` (HWB color model)

types: <color>: `color-mix()`

HTMLElement API: inert

CSS at-rule: `@property`

CSS at-rule: `@media`: `prefers-reduced-data` media feature

Media Queries: Range Syntax

CSS Container Style Queries

-moz-float-edge

-moz-force-broken-image-icon

-moz-image-region

-moz-outline-radius

-moz-outline-radius-bottomleft

-moz-outline-radius-bottomright

-moz-outline-radius-topleft

-moz-outline-radius-topright

-moz-user-focus

-moz-user-input

-webkit-border-before

-webkit-box-reflect

-webkit-line-clamp

-webkit-mask-attachment

-webkit-mask-box-image

-webkit-mask-composite

-webkit-mask-position-x

-webkit-mask-position-y

-webkit-mask-repeat-x

-webkit-mask-repeat-y

-webkit-overflow-scrolling

-webkit-tap-highlight-color

-webkit-text-fill-color

-webkit-text-security

-webkit-text-stroke

-webkit-text-stroke-color

-webkit-text-stroke-width

-webkit-touch-callout

animation-composition

animation-delay

animation-direction

animation-duration

animation-fill-mode

animation-iteration-count

animation-play-state

animation-timeline

animation-timing-function

backdrop-filter

backface-visibility

background-blend-mode

background-clip

background-color

background-image

background-origin

background-position

background-position-x

background-position-y

background-repeat

background-size

border-block-color

border-block-end

border-block-end-color

border-block-end-style

border-block-end-width

border-block-start

border-block-start-color

border-block-start-style

border-block-start-width

border-block-style

border-block-width

border-bottom-color

border-bottom-left-radius

border-bottom-right-radius

border-bottom-style

border-bottom-width

border-collapse

border-end-end-radius

border-end-start-radius

border-image-outset

border-image-repeat

border-image-slice

border-image-source

border-image-width

border-inline-color

border-inline-end

border-inline-end-color

border-inline-end-style

border-inline-end-width

border-inline-start

border-inline-start-color

border-inline-start-style

border-inline-start-width

border-inline-style

border-inline-width

border-left-color

border-left-style

border-left-width

border-right-color

border-right-style

border-right-width

border-start-end-radius

border-start-start-radius

border-top-color

border-top-left-radius

border-top-right-radius

border-top-style

border-top-width

box-decoration-break

box-ordinal-group

column-rule-color

column-rule-style

column-rule-width

contain-intrinsic-block-size

contain-intrinsic-height

contain-intrinsic-inline-size

contain-intrinsic-size

contain-intrinsic-width

content-visibility

counter-increment

font-feature-settings

font-language-override

font-optical-sizing

font-variant-caps

font-variant-east-asian

font-variant-emoji

font-variant-ligatures

font-variant-position

font-variation-settings

forced-color-adjust

grid-auto-columns

grid-column-end

grid-column-start

grid-template-areas

grid-template-columns

grid-template-rows

hanging-punctuation

hyphenate-character

hyphenate-limit-chars

image-orientation

image-rendering

initial-letter-align

inset-block-end

inset-block-start

inset-inline-end

inset-inline-start

justify-content

line-height-step

list-style-image

list-style-position

list-style-type

margin-block-end

margin-block-start

margin-inline-end

margin-inline-start

mask-border-outset

mask-border-repeat

mask-border-slice

mask-border-source

mask-border-width

masonry-auto-flow

max-inline-size

min-inline-size

object-position

offset-distance

offset-position

overflow-anchor

overflow-clip-margin

overflow-inline

overscroll-behavior

overscroll-behavior-block

overscroll-behavior-inline

overscroll-behavior-x

overscroll-behavior-y

padding-block-end

padding-block-start

padding-inline-end

padding-inline-start

page-break-after

page-break-before

page-break-inside

perspective-origin

print-color-adjust

scroll-behavior

scroll-margin-block

scroll-margin-block-end

scroll-margin-block-start

scroll-margin-bottom

scroll-margin-inline

scroll-margin-inline-end

scroll-margin-inline-start

scroll-margin-left

scroll-margin-right

scroll-margin-top

scroll-padding-block

scroll-padding-block-end

scroll-padding-block-start

scroll-padding-bottom

scroll-padding-inline

scroll-padding-inline-end

scroll-padding-inline-start

scroll-padding-left

scroll-padding-right

scroll-padding-top

scroll-snap-align

scroll-snap-coordinate

scroll-snap-destination

scroll-snap-points-x

scroll-snap-points-y

scroll-snap-stop

scroll-snap-type

scroll-snap-type-x

scroll-snap-type-y

scroll-timeline

scroll-timeline-axis

scroll-timeline-name

scrollbar-color

scrollbar-gutter

scrollbar-width

shape-image-threshold

text-align-last

text-combine-upright

text-decoration-color

text-decoration-line

text-decoration-skip

text-decoration-skip-ink

text-decoration-style

text-decoration-thickness

text-emphasis-color

text-emphasis-position

text-emphasis-style

text-orientation

text-underline-offset

text-underline-position

transform-origin

transform-style

transition-delay

transition-duration

transition-property

transition-timing-function

CSS Relative color syntax

CSS text-wrap: balance

View Transitions API (single-document)

Scoped Styles: the @scope rule

CSS Anchor Positioning

View Transitions (cross-document)

CSS if() function

Did you find this page helpful?

TestMu AI forEnterprise

Get access to solutions built on Enterprise
grade security, privacy, & compliance

Advanced access controls
Advanced data retention rules
Advanced Local Testing
Premium Support options
Early access to beta features
Private Slack Channel
Unlimited Manual Accessibility DevTools Tests