David Bushell 🪿reading: SVG favicons that respect theme preference
https://pawelgrzybek.com/svg-favicons-that-respect-theme-preference/
— related: I recently found media queries inside <img> SVG had mixed browser support 😔 we can't have nice things!
Paweł Grzybek@db what do you mean by that? Are you referring to the case when the .svg file is in the “src” attribute of image tag, and this .svg file has media queries?
If yes, I would say that this is kinda expected. It would be too magical if it respected media queries in this situation.
For your use case probably the picture tag is the solution 🤷♂️
@pawelgrzybek yeah like that
but some queries do work! I'm pretty sure I saw `@media (color-gamut: p3)` working at least
@db this sounds to me like a material for a blog post. Super interesting.
Tyler Sticka@pawelgrzybek @db An example we’ve used in production once or twice that (at least at the time?) worked via `<img>`, in case it’s helpful reference for contemporary exploration! https://cloudfour.com/thinks/responsive-logo-composition-with-svg/
Responsive Logo Composition With SVG
Logos are an ideal use-case for SVG. Because they’re typically designed for reproduction and versatility, they’re almost always vector to begin with. SVG’s support of CSS and media queries means we can adapt brand imagery depending on the display size, a technique artfully documented by the likes of…
@tylersticka @pawelgrzybek wow 2016 i guess browser support is ok then!
@db @tylersticka wow!
Quite often I read about something cool on the web. Then I desperately try to publish datę in the article just to find out roughly how much on the bleeding edge author lives. Then I found out it was published decade ago. Terrible way to remind me how old I am and how long I’ve been building for the web.