Jak działają formaty Favicon
Znajomość działania każdego formatu pomaga w rozwiązaniu nieuniknionego problemu „nie wyświetla się moja ulubiona ikona”.
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
Kontener .ico
Plik .ico to nagłówek, po którym następuje jeden lub więcej wpisów obrazu. Każdy wpis może mieć format BMP lub PNG i każdy ma szerokość, wysokość i głębię bitową.
Przeglądarki analizują katalog, wybierają wpis pasujący do żądanego rozmiaru i dekodują właśnie ten.
PNG w .ico
W przypadku rozmiarów 64×64 i większych kompresja PNG zmniejsza rozmiar pliku 5–10 razy bez utraty wizualnej. Nowoczesne generatory (w tym nasz) robią to automatycznie.
Ulubione ikony SVG
Favikona SVG to normalny plik SVG. Przeglądarki renderują go jak każdy inny SVG, a blok <style> może dostosowywać kolory w oparciu o preferowany schemat kolorów.
Jak wybierają przeglądarki
Jeśli wysyłasz wiele tagów <link rel="icon">, przeglądarki wybierają ten, który najlepiej pasuje do powierzchni (karta, zakładka lub instalacja). Preferowany jest SVG, jeśli jest obsługiwany; .ico jest rozwiązaniem awaryjnym.
FAQ
What is inside a .ico file?
A header plus a directory of image entries. Each entry can be BMP or PNG at a specific width and height.
How do browsers choose which favicon to display?
Browsers read all <link rel="icon"> tags and pick the best match for the surface — tab, bookmark, or install prompt. SVG is preferred when supported; .ico is the fallback.
Why use PNG inside an .ico instead of BMP?
PNG compression cuts file size 5–10× at 64×256 with no visible loss, which speeds up page loads.
Can I use only SVG for favicons?
Not safely. Always ship favicon.ico as a fallback for older browsers, Windows shortcuts, and embedders that ignore SVG.