Back to all features
Customizable <select>
The <select> element's appearance, including the button, selected option, picker dropdown, and options, can be customized using CSS.
Modern Web Guidance
How Modern Web Guidance uses this feature
Builds fully stylable select pickers with custom dropdown animations, grid or flex option layouts, and rich HTML content (icons, images, descriptions) inside <option> elements using appearance: base-select, ::picker(select), and <selectedcontent>.
Recommended fallback strategy
Degrades gracefully to native operating system select dropdowns. Non-supporting engines strip inner HTML tags and render plain text option labels. Test support using CSS.supports('appearance', 'base-select') and ensure all options retain accessible text.
Community use cases (0)
No use cases submitted yet
Be the first developer to describe your production use case and shape browser priorities!