content-visibilityBaseline · Newly available
The content-visibility CSS property delays rendering an element, including layout and painting, until it is needed.
Works in the latest version of every major browser, but older devices may not support it yet. Baseline since Sep 15, 2025.
Browser support
DesktopChrome
1–107Not supported
108+Supportedsince Nov 29, 2022
Current: 155Edge
12–107Not supported
108+Supportedsince Dec 5, 2022
Current: 154Firefox
1–129Not supported
130+Supportedsince Sep 3, 2024
Current: 157Safari
1–18.6Not supported
26+Supportedsince Sep 15, 2025
Current: 27MobileChrome Android
18–107Not supported
108+Supportedsince Nov 29, 2022
Current: 155Firefox Android
4–129Not supported
130+Supportedsince Sep 3, 2024
Current: 157Safari iOS
1–18.6Not supported
26+Supportedsince Sep 15, 2025
Current: 27How to use
Every current browser supports this, but it only became Baseline on Sep 15, 2025. Use it as a progressive enhancement, or keep a fallback if you support older devices.
Example
Full syntax and examples are on MDN: ContentVisibilityAutoStateChangeEvent.
Feature detection
CSS · check before using
@supports (content-visibility: initial) {
/* styles that rely on content-visibility */
}
/* or in JavaScript */
if (CSS.supports("content-visibility", "initial")) {
// use it
}Sub-features
Support for each part of the feature (8). The overall table above shows when the whole feature works.
| Sub-feature | Chrome | Edge | Firefox | Safari | Chrome Android | Firefox Android | Safari iOS |
|---|---|---|---|---|---|---|---|
| ContentVisibilityAutoStateChangeEvent | 108 | 108 | 125 | 18 | 108 | 125 | 18 |
| ContentVisibilityAutoStateChangeEvent.ContentVisibilityAutoStateChangeEvent | 108 | 108 | 125 | 18 | 108 | 125 | 18 |
| ContentVisibilityAutoStateChangeEvent.skipped | 108 | 108 | 125 | 18 | 108 | 125 | 18 |
| Element.contentvisibilityautostatechange_event | 108 | 108 | 130 | 18 | 108 | 130 | 18 |
| content-visibility | 85 | 85 | 125 | 18 | 85 | 125 | 18 |
| content-visibility.auto | 85 | 85 | 125 | 26 | 85 | 125 | 26 |
| content-visibility.hidden | 85 | 85 | 125 | 18 | 85 | 125 | 18 |
| content-visibility.visible | 85 | 85 | 125 | 18 | 85 | 125 | 18 |