Przewodnik

Favicon (.ico) vs SVG

SVG to najbardziej ekscytujący format favikon współczesnej ery — wektorowy, obsługujący tryb ciemny i malutki. Nie może jednak całkowicie zastąpić domeny .ico w 2026 r. Oto dlaczego i jak korzystać z obu.

SVG skaluje się w nieskończoność i obsługuje zapytania o media w trybie ciemnym wewnątrz samego pliku. 1 KB SVG obejmuje każdą gęstość w każdej nowoczesnej przeglądarce.

ICO to uniwersalne rozwiązanie zastępcze. Starsze wersje Safari, starsze przeglądarki i konwencja „bare-URL <code>/favicon.ico</code>” nadal od tego zależą.

Zalecana konfiguracja: wysyłka <code>favicon.ico</code> + <code>favicon.svg</code>. Preferują to przeglądarki obsługujące SVG; reszta automatycznie wraca do .ico.

Jak to działa

  1. 1

    Zaprojektuj lub wyeksportuj SVG

    Kwadrat viewBox, element <svg> z pojedynczym pierwiastkiem.

  2. 2

    Wygeneruj rezerwę .ico

    Użyj FetchFavicon, aby zrasteryzować SVG do pliku .ico o wielu rozmiarach.

  3. 3

    Połącz oba

    <link rel="icon" href="/favicon.ico"> + <link rel="icon" type="image/svg+xml" href="/favicon.svg">.

Wypróbuj teraz

Wygeneruj parę .ico + SVG

Konwerter SVG na PNG

FAQ

Czy mogę całkowicie porzucić .ico, jeśli użyję SVG?+

Nie bezpiecznie. Wiele narzędzi do osadzania w mediach społecznościowych, czytników RSS i starszych narzędzi nadal zgodnie z konwencją żąda /favicon.ico.

Które przeglądarki obsługują ulubione ikony SVG?+

Chrome 80+, Edge 80+, Firefox 41+, Safari 15+ i Odważny. iOS Safari nadal preferuje apple-touch-icon PNG.

Jak mała może być favikona SVG?+

Poniżej 1 KB dla czystego znaku monochromatycznego. Nawet złożone, wielokolorowe logo rzadko przekraczają 4 KB.

Powiązane narzędzia

Więcej przewodników

Przewodniki

Przeglądaj FetchFavicon

Kategorie

Konwertery

Narzędzia

Przewodniki

Poradniki