Web Components Browser Support

Generated from web-features 3.40.0 and browser-compat-data 8.1.3. Each version is the oldest that browser can be for the component to behave as designed. Anything listed as optional is missing from older browsers without breaking the component.

sv-accordion

Newly available (Baseline 2024): :state() is not yet Baseline widely available.

Works in Chrome 112+, Edge 112+, Firefox 126+, Safari 17.4+.

Why these versions:

• :state() needs Firefox 126+ and Safari 17.4+.
• Nesting needs Chrome 112+ and Edge 112+.

Partially supported:

• :state() — Chrome, Chrome Android and Edge ship it partially before 125.
• Nesting (nesting) — Chrome, Chrome Android and Edge ship it partially before 120.

sv-alert-stack

Newly available (Baseline 2024): Popover, @starting-style and user-select are not yet Baseline widely available.

Works in Chrome 117+, Edge 117+, Firefox 129+, Safari 17.5+.

Why these versions:

• @starting-style needs Chrome 117+, Edge 117+, Firefox 129+ and Safari 17.5+.

Partially supported:

• Popover — Safari on iOS ships it partially before 18.3.
• Nesting (nesting) — Chrome, Chrome Android and Edge ship it partially before 120.
• user-select — Safari and Safari on iOS need the -webkit-user-select spelling, which the component ships.

sv-anchor

Widely available (Baseline 2024): Every feature it needs is Baseline widely available.

Works in Chrome 105+, Edge 105+, Firefox 106+, Safari 17.4+.

Why these versions:

• checkVisibility() needs Chrome 105+, Edge 105+, Firefox 106+ and Safari 17.4+.

sv-code-editor

Widely available (Baseline 2023): Every feature it needs is Baseline widely available.

Works in Chrome 112+, Edge 112+, Firefox 117+, Safari 16.5+.

Why these versions:

• Nesting needs Chrome 112+, Edge 112+, Firefox 117+ and Safari 16.5+.

Partially supported:

• Nesting (nesting) — Chrome, Chrome Android and Edge ship it partially before 120 and Safari and Safari on iOS ship it partially before 17.2.

Optional and older browsers lose only what is named:

• Growing with the content. The text area keeps its default height and scrolls. Needs field-sizing: Chrome 123+, Edge 123+, Firefox 152+, Safari 26.2+.
• Scrollbars keep the browser's default look instead of the component's. Needs scrollbar-color and scrollbar-width: Chrome 121+, Edge 121+, Firefox 64+, Safari 26.2+.
• Nothing. Mobile browsers never draw a resize handle. Needs resize (CSS property) and resize: none: Chrome 1+, Edge 79+, Firefox 4+, Safari 3+.
• The tinted selection color. Safari on iOS uses its own. Needs ::selection: Chrome 1+, Edge 12+, Firefox 62+, Safari 1.1+.

sv-collapsible

Newly available (Baseline 2025): ARIA attribute reflection (ariaControlsElements) and :state() are not yet Baseline widely available.

Works in Chrome 135+, Edge 135+, Firefox 136+, Safari 17.4+.

Why these versions:

• ARIA attribute reflection needs Chrome 135+, Edge 135+ and Firefox 136+.
• :state() needs Safari 17.4+.

sv-combobox

Newly available (Baseline 2025): ARIA attribute reflection (ariaLabelledByElements), ARIA attribute reflection (ariaDescribedByElements), ARIA attribute reflection (ariaActiveDescendantElement) and :state() are not yet Baseline widely available.

Works in Chrome 135+, Edge 135+, Firefox 136+, Safari 17.4+.

Why these versions:

• ARIA attribute reflection needs Chrome 135+, Edge 135+ and Firefox 136+.
• :state() needs Safari 17.4+.

sv-dialog

Limited availability: No version of Safari or Safari on iOS supports <dialog closedby>.

Works in Chrome 135+, Edge 135+, Firefox 141+, not in Safari; not fully on Safari on iOS.

Why limited:

• <dialog closedby> — no version of Safari or Safari on iOS has it, and elsewhere needs Firefox 141+. Only ignore-escape rests on it: without closedBy the browser may still force-close the dialog on repeated Escape presses.

Why these versions:

• ARIA attribute reflection needs Chrome 135+ and Edge 135+.

sv-expression-parser

Widely available (Baseline 2022): Every feature it needs is Baseline widely available.

Works in Chrome 93+, Edge 93+, Firefox 92+, Safari 15.4+.

Why these versions:

• Object.hasOwn() needs Chrome 93+, Edge 93+, Firefox 92+ and Safari 15.4+.

sv-flyout

Newly available (Baseline 2025): ARIA attribute reflection (ariaLabelledByElements), ARIA attribute reflection (ariaDescribedByElements), ARIA attribute reflection (ariaControlsElements), Popover, overscroll-behavior and :state() are not yet Baseline widely available.

Works in Chrome 135+, Edge 135+, Firefox 136+, Safari 17.4+.

Why these versions:

• ARIA attribute reflection needs Chrome 135+, Edge 135+ and Firefox 136+.
• :state() needs Safari 17.4+.

Partially supported:

• overscroll-behavior — Chrome and Chrome Android ship it partially before 144, Firefox and Firefox Android ship it partially before 150 and Safari and Safari on iOS only ship it partially.

Optional and older browsers lose only what is named:

• Scrollbars keep the browser's default look instead of the component's. Needs scrollbar-width: Chrome 121+, Edge 121+, Firefox 64+, Safari 18.2+.

sv-menu

Widely available (Baseline 2023): Every feature it needs is Baseline widely available.

Works in Chrome 103+, Edge 103+, Firefox 119+, Safari 16.4+.

Why these versions:

• ARIA attribute reflection needs Chrome 103+, Edge 103+ and Firefox 119+.
• Constructed stylesheets needs Safari 16.4+.

sv-progress-bar

Newly available (Baseline 2024): :state() is not yet Baseline widely available.

Works in Chrome 120+, Edge 120+, Firefox 126+, Safari 17.4+.

Why these versions:

• :state() needs Firefox 126+ and Safari 17.4+.
• :dir() needs Chrome 120+ and Edge 120+.

Partially supported:

• :state() — Chrome, Chrome Android and Edge ship it partially before 125.

sv-progress-ring

Newly available (Baseline 2024): :state() is not yet Baseline widely available.

Works in Chrome 112+, Edge 112+, Firefox 126+, Safari 17.4+.

Why these versions:

• :state() needs Firefox 126+ and Safari 17.4+.
• Nesting needs Chrome 112+ and Edge 112+.

Partially supported:

• :state() — Chrome, Chrome Android and Edge ship it partially before 125.
• Nesting (nesting) — Chrome, Chrome Android and Edge ship it partially before 120.
• SVG (mask) — Chrome, Chrome Android and Edge ship it partially before 120.

sv-radio

Newly available (Baseline 2024): Keyboard events (repeat), user-select and :state() are not yet Baseline widely available.

Works in Chrome 112+, Edge 112+, Firefox 126+, Safari 17.4+.

Why these versions:

• :state() needs Firefox 126+ and Safari 17.4+.
• Nesting needs Chrome 112+ and Edge 112+.

Partially supported:

• :state() — Chrome, Chrome Android and Edge ship it partially before 125.
• Nesting (nesting) — Chrome, Chrome Android and Edge ship it partially before 120.
• user-select — Safari and Safari on iOS need the -webkit-user-select spelling, which the component ships.
• Keyboard events (repeat) — Chrome and Chrome Android ship it partially before 137.

sv-rating

Widely available (Baseline 2023): Every feature it needs is Baseline widely available.

Works in Chrome 112+, Edge 112+, Firefox 119+, Safari 16.5+.

Why these versions:

• ARIA attribute reflection needs Firefox 119+.
• Nesting needs Chrome 112+, Edge 112+ and Safari 16.5+.

Partially supported:

• Nesting (nesting) — Chrome, Chrome Android and Edge ship it partially before 120 and Safari and Safari on iOS ship it partially before 17.2.

sv-reveal-animation

Widely available (Baseline 2023): Every feature it needs is Baseline widely available.

Works in Chrome 90+, Edge 90+, Firefox 101+, Safari 16.4+.

Why these versions:

• Constructed stylesheets needs Firefox 101+ and Safari 16.4+.
• Events needs Chrome 90+ and Edge 90+.

sv-segmented-control

Widely available (Baseline 2023): Every feature it needs is Baseline widely available.

Works in Chrome 112+, Edge 112+, Firefox 119+, Safari 16.5+.

Why these versions:

• ARIA attribute reflection needs Firefox 119+.
• Nesting needs Chrome 112+, Edge 112+ and Safari 16.5+.

Partially supported:

• Nesting (nesting) — Chrome, Chrome Android and Edge ship it partially before 120 and Safari and Safari on iOS ship it partially before 17.2.

sv-select

Newly available (Baseline 2025): ARIA attribute reflection (ariaLabelledByElements) is not yet Baseline widely available.

Works in Chrome 135+, Edge 135+, Firefox 136+, Safari 16.4+.

Why these versions:

• ARIA attribute reflection needs Chrome 135+, Edge 135+, Firefox 136+ and Safari 16.4+.
• Constructed stylesheets needs Safari 16.4+.
• Form-associated custom elements needs Safari 16.4+.

sv-slider

Newly available (Baseline 2025): ARIA attribute reflection (ariaLabelledByElements), user-select and :state() are not yet Baseline widely available.

Works in Chrome 135+, Edge 135+, Firefox 136+, Safari 17.4+.

Why these versions:

• ARIA attribute reflection needs Chrome 135+, Edge 135+ and Firefox 136+.
• :state() needs Safari 17.4+.

Partially supported:

• user-select — Safari and Safari on iOS need the -webkit-user-select spelling, which the component ships.

Optional and older browsers lose only what is named:

• Whether a focus ring appears is left to the browser instead of being asked for. Needs Focus events: Chrome 145+, Edge 145+, Firefox 104+, Safari 18.4+.

sv-template

Widely available (Baseline 2022): Every feature it needs is Baseline widely available.

Works in Chrome 92+, Edge 92+, Firefox 95+, Safari 15.4+.

Why these versions:

• Web Cryptography needs Chrome 92+, Edge 92+, Firefox 95+ and Safari 15.4+.

sv-text-flow

Widely available (Baseline 2023): Every feature it needs is Baseline widely available.

Works in Chrome 120+, Edge 120+, Firefox 120+, Safari 16.5+.

Why these versions:

• lh unit needs Firefox 120+.
• Masks needs Chrome 120+ and Edge 120+.
• Nesting needs Safari 16.5+.

Partially supported:

• Nesting (nesting) — Safari and Safari on iOS ship it partially before 17.2.

sv-toggle

Newly available (Baseline 2024): Keyboard events (repeat), user-select and :state() are not yet Baseline widely available.

Works in Chrome 112+, Edge 112+, Firefox 126+, Safari 17.4+.

Why these versions:

• :state() needs Firefox 126+ and Safari 17.4+.
• Nesting needs Chrome 112+ and Edge 112+.

Partially supported:

• :state() — Chrome, Chrome Android and Edge ship it partially before 125.
• Nesting (nesting) — Chrome, Chrome Android and Edge ship it partially before 120.
• user-select — Safari and Safari on iOS need the -webkit-user-select spelling, which the component ships.
• Keyboard events (repeat) — Chrome and Chrome Android ship it partially before 137.

sv-toggle-checkbox

Newly available (Baseline 2025): ARIA attribute reflection (ariaControlsElements), Keyboard events (repeat), user-select and :state() are not yet Baseline widely available.

Works in Chrome 135+, Edge 135+, Firefox 136+, Safari 17.4+.

Why these versions:

• ARIA attribute reflection needs Chrome 135+, Edge 135+ and Firefox 136+.
• :state() needs Safari 17.4+.

Partially supported:

• user-select — Safari and Safari on iOS need the -webkit-user-select spelling, which the component ships.
• Keyboard events (repeat) — Chrome and Chrome Android ship it partially before 137.

sv-toggle-group

Widely available (Baseline 2023): Every feature it needs is Baseline widely available.

Works in Chrome 103+, Edge 103+, Firefox 119+, Safari 16.4+.

Why these versions:

• ARIA attribute reflection needs Chrome 103+, Edge 103+, Firefox 119+ and Safari 16.4+.
• Constructed stylesheets needs Safari 16.4+.
• Form-associated custom elements needs Safari 16.4+.

sv-toggle-switch

Newly available (Baseline 2024): Keyboard events (repeat), user-select and :state() are not yet Baseline widely available.

Works in Chrome 112+, Edge 112+, Firefox 126+, Safari 17.4+.

Why these versions:

• :state() needs Firefox 126+ and Safari 17.4+.
• Nesting needs Chrome 112+ and Edge 112+.

Partially supported:

• :state() — Chrome, Chrome Android and Edge ship it partially before 125.
• Nesting (nesting) — Chrome, Chrome Android and Edge ship it partially before 120.
• user-select — Safari and Safari on iOS need the -webkit-user-select spelling, which the component ships.
• Keyboard events (repeat) — Chrome and Chrome Android ship it partially before 137.

sv-tooltip

Newly available (Baseline 2026): Popover, transition-behavior, Anchor positioning, @starting-style and :state() are not yet Baseline widely available.

Works in Chrome 128+, Edge 128+, Firefox 147+, Safari 26+.

Why these versions:

• Anchor positioning needs Chrome 128+, Edge 128+, Firefox 147+ and Safari 26+.

Optional and older browsers lose only what is named:

• The arrow hides without anchored container queries, and the tooltip still shows. Needs Anchor position container queries: Chrome 143+, Edge 143+, not in Firefox or Safari.
• The arrow. The tooltip cannot tell which side it landed on, so the arrow stays hidden while the tooltip still shows. Needs Anchor position container queries: Chrome 143+, Edge 143+, not in Firefox or Safari.

sv-ui-state

Widely available (Baseline 2022): Every feature it needs is Baseline widely available.

Works in Chrome 95+, Edge 95+, Firefox 93+, Safari 15.4+.

Why these versions:

• reportError needs Chrome 95+, Edge 95+, Firefox 93+ and Safari 15.4+.