[csswg-drafts] Pseudo elements and SVG for form controls (#12039)

jpzwarte has just created a new issue for https://github.com/w3c/csswg-drafts:

== Pseudo elements and SVG for form controls ==
So as part of the CSS Forms 1 spec, i love that a lot of user-interface things are being exposed. Like `::picker-icon` in `<select>` and `::checkmark` for `<input type=checkbox>`. I'm unclear however how customizable those things actually are in practice.

One common practice for design systems is to provide a custom icon for those experiences, usually in the form of SVGs. Sometimes those icons are also animated, for example the `<path>` of the checkbox when the state changes to `:checked`.

One way today would be to use `background: url("data:image/svg+xml.....");` for the pseudo element. The downside of that is that the SVG is not styleable via CSS. So using this technique, you wouldn't be able to animate it in the checkbox scenario.

Is there an existing issue for this that i'm missing?

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/12039 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 2 April 2025 09:48:51 UTC