Narzędzia obrazów

Generator favicon

Zbuduj pakiet favicon z obrazu: rozmiary PNG, favicon.ico i tagi HTML do nich.

Generator favicon workspace

Jak używać

Wybierz JPEG, PNG, WebP lub GIF. Utwórz plik buduje pakiet. Pobierz zapisuje ZIP. Umieść pliki na stronie i skopiuj tagi link z README.txt do elementu head.

Przykład

README.txt zawiera tagi link dla ikony, PNG 32 piksele i ikony Apple touch.

Wejście

A square logo PNG

Wyjście

favicon-pack.zip zawierający favicon.ico, PNG 16, 32, 48 i 180 pikseli oraz README.txt

Jak to działa

Każdy rozmiar jest rysowany na białym kwadracie, żeby przezroczyste logo było widoczne na jasnym i ciemnym chrome przeglądarki. favicon.ico zawiera PNG 16 i 32 piksele w kontenerze PNG-in-ICO. PNG 48 pikseli to ogólna ikona skrótu. PNG 180 pikseli to rozmiar Apple touch. ZIP jest przechowywany bez ponownej kompresji i zawiera fragment HTML.

Częste błędy

  • Ikona wygląda na przyciętą Źródło jest rozciągane do kwadratu. Zacznij od kwadratowego obrazu, jeśli grafika nie może być rozciągana.
  • Stara przeglądarka ignoruje favicon.ico ICO używa osadzonych PNG, które czytają współczesne przeglądarki. Osobne pliki PNG to zapas wymieniony w README.
  • ZIP się nie pojawił Utworzenie pliku musi się udać przed Pobraniem. Uszkodzony obraz kończy się przed zbudowaniem paczki.

Ograniczenia

Paczka nie zawiera manifestu aplikacji web, favicon SVG ani maskowalnej ikony 512 pikseli. Animacja jest sprowadzana do jednej klatki. Pliki powyżej 15 MB lub 8000 pikseli na bok są odrzucane. Obraz nie jest przesyłany.

Prywatność

Plik pozostaje w Twojej przeglądarce. PepsTools go nie przesyła, nie przechowuje ani nie wysyła do innej usługi. Wyczyść narzędzie lub opuść stronę, aby usunąć go z pamięci.

Pytania

Jakich tagów powinna użyć witryna?

README w ZIP wymienia link favicon.ico, link PNG 32 piksele i link apple-touch-icon. Skopiuj je do elementu head i dostosuj ścieżki do miejsc plików.