Jak zrobić favicon (zestaw ikon) dla strony WWW?
Generator favicon online - kompletny zestaw ikon dla strony internetowej w paczce ZIP.
Wgraj jeden obrazek (najlepiej 512×512), a my wygenerujemy wszystkie potrzebne pliki: favicon.ico (3 warstwy), 7 PNG-ów w różnych rozmiarach (16, 32, 48, 150, 180, 192, 512), manifest.webmanifest oraz gotowy snippet HTML do wklejenia w <head>.
Działa lokalnie - obrazek nie jest wysyłany na serwer.
Po wgraniu na hosting dostajesz spójny wygląd ikony na każdej platformie: Chrome, Safari, iPhone home screen, Android, Windows pinned tile.
Jak korzystać
- Wgraj kwadratowy obrazek źródłowy - najlepiej 512×512 px PNG z przezroczystością. Logo, ikona aplikacji, monogram.
- Wpisz nazwę strony - pojawi się w manifest.webmanifest jako tytuł aplikacji PWA, gdyby user dodał stronę do ekranu głównego.
- Klik "Wygeneruj zestaw" - generator stworzy 8 plików PNG/ICO + manifest + snippet HTML.
- Pobierz ZIP, rozpakuj do katalogu /public serwera, skopiuj snippet HTML do <head>. Gotowe - favicon działa na każdej platformie.
Co dostajesz w pakiecie
Zawartość paczki ZIP - co znajdziesz po wygenerowaniu:
- favicon.ico (3-warstwowy) - Internet Explorer, fallback dla starszych przeglądarek, niektóre RSS readery.
- favicon-16x16.png i favicon-32x32.png - nowoczesne przeglądarki (Chrome, Firefox, Safari) wybierają zależnie od DPI.
- apple-touch-icon.png (180×180) - iPhone i iPad. Kiedy user doda stronę do ekranu głównego, ten plik staje się ikoną aplikacji.
- android-chrome-192x192.png i 512x512 - Android Chrome - na ekran główny i splash screen PWA.
- mstile-150x150.png - Windows 10/11, kiedy user przypina stronę do menu Start.
- manifest.webmanifest - PWA-compatible manifest dla "Add to Home Screen".
- site.html - gotowy snippet do skopiowania w <head>.
Pytania i odpowiedzi
Idealnie 512×512 px lub większy, kwadratowy, PNG z przezroczystością. Większy daje generator pole do ostrego skalowania w dół do 16 px. Jeśli wgrasz mniejszy (256×256), 192/512 PNG-i będą rozmyte przy upscale.