While building a new site which will support both light and dark mode, I came across this bug. It’s not new, it’s just that so many parts the color-scheme api are well thought out and working as expected, that even MDN lists the Baseline as “widely available since February 2022”!

The bug only affects Safari, where SVG images are embedded. The curious part is that safari can detect prefers-color-scheme: light
, so even crafting SVG icons to default to dark mode won’t work.
Here is a test case I crafted to illustrate the issue (forked from the original).
https://codesandbox.io/p/devbox/svg-prefers-color-scheme-media-query-test-forked-zmdqft
Discourse
When folks talk about Safari being the Internet Explorer of Today, it is both for its sluggish pace of adopting basic web rendering standards, but especially because of it’s market dominance.
Leave a Reply