How to correctly load SVG favicons
- Published at
- Updated at
- Reading time
- 1min
Here's a quick snippet I found on CSS Tricks for later use.
SVG favicons are almost cross-browser supported. Unfortunately, Safari is not ready yet, and that's why we still need to define an ico favicon. Use the sizes="any" attibute to avoid Chromium browsers loading both favicon files (ico and svg).
<!-- Avoid that Chromiums download ico and svg 👇 -->
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
Was this snippet helpful?
Yes? Cool! You might want to check out Web Weekly for more snippets. The last edition went out 9 days ago.
Yes? Cool! You might want to check out Web Weekly for more snippets. The last edition went out 9 days ago.