coderef

Customizable <select>Limited availability

The &#x3C;select> element's appearance, including the button, selected option, picker dropdown, and options, can be customized using CSS.

Not yet supported in all major browsers — check the table and provide a fallback.

How to use ↓Compare browsers

Browser support

DesktopChrome
1–134Not supported
135+Supportedsince Apr 1, 2025
Current: 155
Edge
12–134Not supported
135+Supportedsince Apr 4, 2025
Current: 154
Firefox
✕Not supportedup to 157
Current: 157
Safari
1–26.6Not supported
27+Supportedsince Sep 14, 2026
Current: 27
MobileChrome Android
18–134Not supported
135+Supportedsince Apr 1, 2025
Current: 155
Firefox Android
✕Not supportedup to 157
Current: 157
Safari iOS
1–26.6Not supported
27+Supportedsince Sep 14, 2026
Current: 27

How to use

Not supported in Firefox, Firefox Android. Use feature detection below and provide a fallback (or a polyfill) for those browsers.

Example

Full syntax and examples are on MDN: ::checkmark.

Feature detection

CSS · check before using
@supports selector(:checkmark) {
  /* styles that use :checkmark */
}

/* or in JavaScript */
if (CSS.supports("selector(:checkmark)")) {
  // use it
}

Documentation (MDN)

Specification

Usage share

Sub-features

Support for each part of the feature (5). The overall table above shows when the whole feature works.

Sub-featureChromeEdgeFirefoxSafariChrome AndroidFirefox AndroidSafari iOS
appearance.base-select135135✕27135✕27
checkmark133133✕27133✕27
picker135135✕27135✕27
picker-icon133133✕27133✕27
selectedcontent135135✕27135✕27