notecss
Get ready! The <select> element can now be customized with CSS, check out the post on the Chrome Blog!
- Finally render custom HTML inside an
<option> - Works without JS
- Easy to progressively enhance
in Chrome 135 - Tomorrow Mar 26, 2025 customize all the parts of a <select> with #CSS! ⤷ nerdy.dev/customize-a-...Adam Argyle
@argyleink absolutely huge! Also, gorgeous demo ????
Martin Grubinger
what happens if the browser doesn't support it? still a select.Adam Argyle
Open Props UI has great examples on how to progressively enhance to this new customization try all their variants and see the "non-experimental" version too for fallback styles and what that experience is like awesome work github.com/felix-bohlin try it? open-props-ui.netlify.app/components/i...
@argyleink This looks awesome!
Sidebar: how are you capturing what key you pressed during the recording?
Hasan Ali
@argyleink I think I'll test it tomorrow, as soon as I will be at work
????
AurelieT44
@hasanhaja KeyStroke Pro ????????
Adam Argyle :chrome:
Chrome is (a) owned by an American company, (b) a security risk. So no.Vern Faulkner
customized select CSS is (a) not owned by any company, (b) a web standard that was vetted for potential security threats by a governance body. just so happens Chrome implemented it first. you do you tho!
Oh my, this is huge!Mikaël Sévigny
I am perfectly aware of what CSS is. I was coding webpages before it existed. That's not the point.
I am perfectly aware of what CSS is. I was coding webpages before it existed. That's not the point.
As a kid, I thought in 2025 we'd have flying cars. At least w̶e̶'̶l̶l̶ AI agents will be able to use C̶S̶S̶ Tailwind to customize selects!!Mike G
are we in the HTML renaissance?!!Jonathan Yee
This is one case of a Chrome-first, non-standard feature that I'd like to see standardised in browser specmilo
I'm confused. Do you refuse to customize <select> elements, because a browser you don't like supports that?Chevindu
This took 5+ years of standards work, not sure I understand the criticism here
@argyleink I love that it’s a progressive enhancement. I’ve already started using it in one of my projects! #SuiteAdvanced
suiteadvancedAdam Smith
The criticisms are valid.Captain of the CSS Enterprise ☭????????????️????????
I am old what were we supposed to do?Mojo
I'm not confused about "criticisms" (lol), I was referring to "So no"
whaaa..... This changes so much. ????????Jack Harner ???? Freelance Web Developer
@argyleink This is so good - whatever you think this is, it is. Great job getting it out the door!
Can’t wait for component libraries to use this new syntax! ????????
Felix
This _is_ the spec! :)Emanuele (Ema)
Is this based on the W3C Form Control Styling draft? www.w3.org/TR/css-forms...Pio Rasch-Halvorsen
Complete misunderstanding on my part ????????
The Point is that I'm Canadian, Chrome is owned by an American megacorp that scoops my data for profit and given the political landscape, I'm not supporting any of that shit.
Thank you so much for the mention ❤️ The customizable select is on ???? Really well explained article that covers the gains and also the losses when opting in. cool stuffBrecht De Ruyte
The only bad part about this, is that it was only shipped now ????Filipe Freire
They’re just knee jerking to a mention of ChromeGreat ideas, smart brain
I've been waiting for this for 20+ years...Mike Luby