BASELINE NowYouCanUse.com
Web Platform Baseline Status Breakdown Total Features: 1191
Search: Reset ×
Categories: All CSS (101) HTML elements (98) Selectors (46) JavaScript (43) Forms (40)
WebGL extensions (37) WebAssembly (22) Media queries (21) Fonts (19) Performance (19) Text (19) Scrolling (18) Arrays (17) Layout (17) HTML (16) Progressive web app (15) Typed arrays (14) Units (14) Canvas (13) Background (12) Color types (12) Media elements (12) Strings (12) Clipping, shapes, and masking (11) Security (11) Web components (11) WebXR (11) Typographic font features (10) Animation (9) Internationalization (9) Reporting (9) Text wrap (9) Clipboard (8) Workers (8) Containment (7) DOM (7) Fetch (7) JavaScript modules (7) Print media (7) Sensors (7) CSS object models (6) Image formats (6) Iterators (6) Landmark elements (6) Positioning (6) Promises (6) SVG (6) Storage (6) Streams (6) Credential management (5) Custom elements (5) Explicit defaults (5) Font synthesis (5) HTTP (5) Messaging (5) Multi-column (5) Resource hints (5) Ruby (5) Selection (5) Speech (5) Transitions (CSS) (5) View transitions (5) Web audio (5) WebGL (5) Container queries (4) Cookies (4) Counters (4) File system access (4) Flexbox (4) Gamepad (4) Grid (4) Images (4) Lists (4) Primitive types (4) Regular expressions (4) WebDriver (4) WebRTC (4) Blend mode (3) Borders and outlines (3) Gradients (3) Image scaling (3) JSON (3) Maps (3) MathML (3) Payments (3) Reading order (3) Scroll markers (3) Transforms (3) WebAuthn (3) WebGPU (3) White space (3) Worklets (3) XML (3) Collections (2) Compute pressure (2) Geolocation (2) IndexedDB (2) Parsing and serialization (2) Resource integrity (2) Sets (2) Text fragments (2) WebMCP (2) CSS environment variables (1)
Showing 30 of 33 features

2023

4 features
• December 2023
Widely Available

The :has() CSS functional pseudo-class matches an element if any of the selectors passed as parameters would match at least one element.

Chrome 105
Firefox 121
Safari 15.4
Edge 105
Baseline Date: Dec 19, 2023
Widely Available

The :dir() CSS functional pseudo-class matches elements by text direction, either right to left (rtl) or left to right (ltr).

Chrome 120
Firefox 49
Safari 16.4
Edge 120
Baseline Date: Dec 7, 2023
• November 2023

The :user-valid and :user-invalid pseudo-classes match form controls that have been marked as valid or invalid based on their validation constraints.

Chrome 119
Firefox 88
Safari 16.5
Edge 119
Baseline Date: Nov 2, 2023
• May 2023

The of syntax for the :nth-child() and :nth-last-child() CSS functional pseudo-classes match elements by the relative position of elements, counted from the first or last sibling matching a selector list.

Chrome 111
Firefox 113
Safari 9
Edge 111
Baseline Date: May 9, 2023

2022

3 features
• September 2022
Widely Available

The :modal pseudo-class selects elements that put other elements into a non-interactive state, such as a fullscreen element or a <dialog> element used with showModal().

Chrome 105
Firefox 103
Safari 15.6
Edge 105
Baseline Date: Sep 2, 2022
• March 2022
Widely Available

The ::backdrop CSS pseudo-element is a box underneath an element in the top layer, such as a <dialog>. It can be used to create obscuring effects distinguishing a modal element from the elements underneath.

Chrome 37
Firefox 47
Safari 15.4
Edge 79
Baseline Date: Mar 14, 2022
Widely Available

The :focus-visible CSS pseudo-class selects elements that match the :focus pseudo-class and meets the browser's criteria for visually emphasizing focused elements.

Chrome 86
Firefox 85
Safari 15.4
Edge 86
Baseline Date: Mar 14, 2022

2021

4 features
• April 2021

The ::file-selector-button CSS pseudo-element selects the button of a <input type="file"> element.

Chrome 89
Firefox 82
Safari 14.1
Edge 89
Baseline Date: Apr 26, 2021
• January 2021
Widely Available

The :is() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list.

Chrome 88
Firefox 82
Safari 14
Edge 88
Baseline Date: Jan 21, 2021
Widely Available

The :not() functional pseudo-class matches elements that do not match the selectors in its argument.

Chrome 88
Firefox 84
Safari 9
Edge 88
Baseline Date: Jan 21, 2021
Widely Available

The :where() CSS functional pseudo-class takes a selector list as its argument, and matches any element that can be selected by one of the selectors in that list. It is functionally equivalent to the selectors in the list, but doesn't affect the CSS rule specificity.

Chrome 88
Firefox 82
Safari 14
Edge 88
Baseline Date: Jan 21, 2021

2020

9 features
• July 2020
Widely Available

The part and exportparts HTML attributes expose elements of a shadow DOM as named parts, which can be selected by the ::part() CSS pseudo-element for styling.

Chrome 73
Firefox 72
Safari 13.1
Edge 79
Baseline Date: Jul 28, 2020
• January 2020
Widely Available

The ::placeholder CSS pseudo-element selects help text in <input> and <textarea> elements when no value is set.

Chrome 57
Firefox 51
Safari 10.1
Edge 79
Baseline Date: Jan 15, 2020
Widely Available

The :default CSS pseudo-class matches the default element in a group of related form controls, such as checkboxes and radio buttons with the checked attribute.

Chrome 10
Firefox 4
Safari 5
Edge 79
Baseline Date: Jan 15, 2020
Widely Available

The :focus-within CSS pseudo-class matches an element if the element or any of its children are focused.

Chrome 60
Firefox 52
Safari 10.1
Edge 79
Baseline Date: Jan 15, 2020
Widely Available

The :placeholder-shown CSS pseudo-element selects <input> and <textarea> elements when no value is set and the element's placeholder attribute is not empty. Not to be confused with ::placeholder, which selects the placeholder text itself.

Chrome 47
Firefox 51
Safari 9
Edge 79
Baseline Date: Jan 15, 2020
Widely Available

The :scope CSS pseudo-class matches the scoping root, for instance the element that querySelector() is called on, or the root of a DOM subtree specified with @scope.

Chrome 27
Firefox 32
Safari 7
Edge 79
Baseline Date: Jan 15, 2020

The i identifier in a CSS attribute selector matches attribute values case-insensitively in document languages like XML where attribute values are case-sensitive.

Chrome 49
Firefox 47
Safari 9
Edge 79
Baseline Date: Jan 15, 2020
Widely Available

The :host CSS pseudo-class selects the containing element of the shadow tree in which it is used. The :host() CSS pseudo-class selects the that element only if it matches the provided selector.

Chrome 54
Firefox 63
Safari 10
Edge 79
Baseline Date: Jan 15, 2020

2015

10 features
• July 2015
Widely Available

The ::first-letter CSS pseudo-element selects the first letter in an element for styling.

Chrome 1
Firefox 1
Safari 1
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The ::first-line CSS pseudo-element selects the first line of text in an element for styling.

Chrome 1
Firefox 1
Safari 1
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The :empty CSS pseudo-class matches elements without child elements.

Chrome 1
Firefox 1
Safari 3.1
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The :lang() CSS functional pseudo-class matches elements based on their content language.

Chrome 1
Firefox 1
Safari 3.1
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The :nth-child() and :nth-last-child() CSS functional pseudo-classes match elements based on their index within a list of elements. The :first-child and :last-child pseudo-classes match the first and last element in a list, and the :only-child pseudo-class matches an element with no siblings.

Chrome 1
Firefox 3.5
Safari 3.1
Edge 12
Baseline Date: Jul 29, 2015

The :nth-of-type() and :nth-last-of-type() CSS functional pseudo-classes match elements based on their position among siblings of the same type. The :first-of-type, :last-of-type, and :only-of-type pseudo-classes match the first, last, and only elements of its type.

Chrome 4
Firefox 3.5
Safari 3.1
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The :root pseudo-class matches the root element of the document, usually the <html> element.

Chrome 1
Firefox 1
Safari 1
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The :target CSS pseudo-class matches the element with an ID matching the URL fragment.

Chrome 1
Firefox 1
Safari 1.3
Edge 12
Baseline Date: Jul 29, 2015
Widely Available

The @namespace CSS rule sets a default namespace or namespace prefix. Namespace prefixes allow CSS selectors to distinguish elements with the same name but different document types, such as the HTML <a> element and the SVG <a> element.

Chrome 1
Firefox 1
Safari 1
Edge 12
Baseline Date: Jul 29, 2015

The form validity CSS pseudo-classes match <form> elements based on the constraints of a form field, such as validity (:valid, :invalid, :in-range, :out-of-range) and necessity (:optional or :required).

Chrome 10
Firefox 4
Safari 5
Edge 12
Baseline Date: Jul 29, 2015
Page 1 of 2 (33 features) Next →