Pořádná sada favicon je víc než jeden soubor: prohlížeče chtějí vícevelikostní .ico, iOS chce 180px apple-touch-icon, Android chce PNG 192 a 512 px plus web manifest. Tento nástroj je všechny vykreslí z jediného obrázku a zabalí do jednoho ZIP, spolu s přesnými HTML tagy k vložení do vašeho <head>.
Náhled ukazuje ikonu ve skutečných 16, 32 a 48 px, takže si před nasazením ověříte, že zůstává rozpoznatelná i v drobných velikostech.
Jak na to
- Přidejte logoNejlépe fungují čtvercové obrázky; ostatní se oříznou na střed.
- Zkontrolujte malé velikostiNáhled 16 px je to, co většina uživatelů reálně uvidí v záložce.
- Stáhněte ZIPfavicon.ico, šest PNG, site.webmanifest a html-snippet.txt připravený k vložení.
Jeden obrázek dovnitř, kompletní sada faviconů ven
Vložte jediné logo nebo ikonu a tento generátor sestaví kompletní sadu, kterou moderní web potřebuje: vícevelikostní favicon.ico sdružující verze 16, 32 a 48 pixelů, samostatné PNG v 16, 32, 48, 180 pro Apple touch icon a 192 a 512 pro Android a instalace PWA, plus site.webmanifest. Vše se stáhne jako jeden ZIP, který můžete rovnou vložit do kořene projektu.
Dostanete také HTML snippet pro head připravený k vložení, se správnými link a meta tagy již zapojenými. Zkopírujte ho do své šablony, nahrajte soubory a favicon se objeví v záložkách prohlížeče, oblíbených položkách a zkratkách na ploše, aniž byste ručně psali jakýkoli markup.
Ostré ikony v každé velikosti
Favicony jsou nemilosrdně malé, proto generátor vykresluje náhledy ve skutečné velikosti 16, 32 a 48 pixelů — přesně tak, jak je zobrazí záložka prohlížeče. Díky tomu odhalíte logo, které se v 16px rozteče do kaše, dřív, než ho vypustíte. Pokud váš zdrojový obrázek není čtvercový, nástroj ho ořízne na střed, aby ikona zůstala vyvážená, ne zdeformovaná.
Celý proces běží v prohlížeči z vašeho původního obrázku, což znamená, že můžete generovat favicon PNG a ICO z loga ve vysokém rozlišení bez nahrávání a bez účtu.
K čemu ho lidé používají
Spuštění nového webu — Vygenerujte favicon.ico a každou velikost PNG jedním průchodem, aby záložky a oblíbené položky vypadaly hotově od prvního dne.
Přidání instalační ikony PWA — Exportujte PNG 192 a 512 plus site.webmanifest, aby se vaše aplikace instalovala s pořádnou ikonou na ploše.
Apple touch icon — Vytvořte apple-touch-icon 180x180, aby záložky a plochy iOS zobrazovaly ostrou dlaždici.
Rebranding stávajícího webu — Prožeňte generátorem jedno nové logo a vyměňte celou sadu ikon najednou.
Předání klientovi — Předejte jediný ZIP s ico, PNG, manifestem a head snippetem, aby ho vývojář jen vložil na místo.
Kontrola čitelnosti v malé velikosti — Použijte náhled ve skutečné velikosti 16px a ověřte, že detailní logo stále funguje jako ikona.
Nečtvercové logo — Vložte široký nápis a nechte ořez na střed proměnit ho ve vyvážený čtvercový favicon.
Statický web nebo frameworkový projekt — Zkopírujte vygenerované head tagy do své šablony v Next, Astro nebo čistém HTML a vypusťte to.
Proč IMG.DIY
Kompletní sada
ICO + PNG 16/32/48/180/192/512 + manifest.
HTML ke zkopírování
Přesné link tagy přiložené jako textový soubor.
Náhled ve skutečné velikosti
Prohlédněte si ikonu ve skutečných 16/32/48 px předem.
Soukromé
Vaše logo nikdy neopustí prohlížeč.