Customizable select is arriving in Safari 27, enabling full visual control over native `<select>` elements without JavaScript. The WebKit team outlines one essential rule: always include text content or accessible text attributes in option elements. Omitting text in favor of icons or swatches breaks UX for users who can't interpret icons, makes options inaccessible to screen readers and braille displays, and renders dropdowns empty in browsers that don't yet support the feature. The recommended approach is to keep text as a baseline — even if visually hidden — and treat icons, swatches, and illustrations as enhancements layered on top. Using `@supports (appearance: base-select)` ensures graceful fallback in unsupported browsers.
2K Impressions