
Say goodbye to ugly <select>
.
CSS now gives you full control.
For years, <select>
elements have been frustrating to style.
Often needing JavaScript or UI libraries.
Now, modern browsers bring full customization to native dropdowns.
What’s New?
Chrome introduces new CSS properties for better <select>
styling.
No more browser inconsistencies!
-
Total Style Control: Customize backgrounds, borders, and padding without hacks.
-
Custom Dropdowns: Control width, height, and animations. No more default system styles.
-
Multi-Column & Scrollable Options: Create advanced layouts, scrolling areas, and better positioning.
Why It Matters?
- Dropdowns match your design system without breaking accessibility.
- Native UI is lighter and quicker.
- No need for extra libraries nor JavaScript.
Rolling out in Chrome 135+, with other browsers likely to follow. Start experimenting today!
This will finally end painful <select>
styling 🔥
Checkout the codepen: https://codepen.io/theosoti/pen/VYwqEvP
To learn more tips about CSS, make sure to join my newsletter below ❤️