Ikony SVG i ICO

SVG to przyszłość; ICO to podstawa. Użyj obu.

4 min czytania

Check favicons on any website

Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.

Install Chrome Extension

Dlaczego SVG wygrywa w nowoczesnych przeglądarkach

Jeden plik, nieskończenie skalowalny, obsługuje zapytania o media w trybie ciemnym. Rozmiar pliku wynosi zazwyczaj poniżej 2 KB.

Dlaczego ICO jest nadal niezbędny

Starsze przeglądarki, skróty Windows i niektóre programy do osadzania odczytują tylko .ico. Pominięcie tego powoduje uszkodzenie ikony u ~5% użytkowników.

Używaj obu razem

Najpierw łącze favicon.ico jako uniwersalne rozwiązanie zastępcze, a następnie <link rel="icon" type="image/svg+xml"> na górze dla przeglądarek, które go obsługują.

FAQ

Should I use SVG or ICO for a favicon?

Use both. Link favicon.ico as the universal fallback, then add <link rel="icon" type="image/svg+xml"> for scalable rendering on modern browsers.

Does SVG work in every browser?

Most modern browsers support SVG favicons, but older browsers and some embedders still need .ico. Never ship SVG alone.

Can an SVG favicon support dark mode?

Yes. Embed a <style>@media (prefers-color-scheme: dark) { ... }</style> block inside the SVG file.

Powiązane przewodniki

Wypróbuj narzędzia

Czytaj dalej