CSSPseudoElementLimited availability
A CSSPseudoElement object represents a pseudo-element and its context in the document tree. You get an instance through the pseudo() method of Element or CSSPseudoElement objects or the pseudoTarget property of some events.
Not yet supported in all major browsers — check the table and provide a fallback.
Browser support
DesktopChrome
1–148Not supported
149+Supportedsince Jun 2, 2026
Current: 155Edge
12–148Not supported
149+Supportedsince Jun 4, 2026
Current: 154Firefox
✕Not supportedup to 157
Current: 157Safari
✕Not supportedup to 27
Current: 27MobileChrome Android
18–148Not supported
149+Supportedsince Jun 2, 2026
Current: 155Firefox Android
✕Not supportedup to 157
Current: 157Safari iOS
✕Not supportedup to 27
Current: 27How to use
Not supported in Firefox, Safari, Firefox Android, Safari iOS. Use feature detection below and provide a fallback (or a polyfill) for those browsers.
Example
Full syntax and examples are on MDN: CSSPseudoElement.
Feature detection
JS · check before using
if ("CSSPseudoElement" in globalThis) {
// CSSPseudoElement is available
} else {
// load a polyfill or use a fallback
}Specification
Sub-features
Support for each part of the feature (6). The overall table above shows when the whole feature works.
| Sub-feature | Chrome | Edge | Firefox | Safari | Chrome Android | Firefox Android | Safari iOS |
|---|---|---|---|---|---|---|---|
| CSSPseudoElement | 149 | 149 | ✕ | ✕ | 149 | ✕ | ✕ |
| CSSPseudoElement.element | 149 | 149 | ✕ | ✕ | 149 | ✕ | ✕ |
| CSSPseudoElement.parent | 149 | 149 | ✕ | ✕ | 149 | ✕ | ✕ |
| CSSPseudoElement.pseudo | 149 | 149 | ✕ | ✕ | 149 | ✕ | ✕ |
| CSSPseudoElement.type | 149 | 149 | ✕ | ✕ | 149 | ✕ | ✕ |
| Element.pseudo | 149 | 149 | ✕ | ✕ | 149 | ✕ | ✕ |