Generátor favicon
Prohlížeče očekávají několik velikostí ikon: klasické 16×16 favicon.ico, 32×32 ikon karet, 180×180 apple-touch-icon a 192×192 PWA ikony. Nahrajte čtvercové logo a stáhněte si kompletní sadu — vygenerovanou lokálně, aniž byste museli posílat podklady vaší značky na server.
Jak generovat favicony
1. Nahrajte čtvercový PNG nebo JPG (doporučeno 512×512 nebo větší).
2. Náhled generovaných velikostí.
3. Stáhněte si sadu ikon nebo jednotlivé soubory.
4. Přidejte značky odkazů do své HTML hlavy a umístěte soubory do /public nebo kořenového adresáře webu.
Příklady nastavení favicon
Nový statický web
Vygenerujte favicon.ico plus 32×32 PNG a přidejte standardní značky odkazu rel="icon" do layout.html.
PWA manifest
Export 192×192 a 512×512 PNG pro pole ikon manifest.json.
Výměna značky
Nahraďte jedno hlavní logo a obnovte všechny velikosti, aby se karty a zkratky na domovské obrazovce shodovaly.
Kdy použít generátor favicon
• Když spouštíte web a potřebujete všechny standardní velikosti ikon najednou.
• Když máte rastrové logo, ale nemáte soubor .ico o více velikostech.
• Když chcete místní generaci bez nahrávání podkladů značky.
Kdy ručně vyrábět ikony
• Když je vaše logo podrobné — zjednodušte na znak písmene pro čitelnost 16×16.
• Když favikony SVG postačují pouze pro moderní publikum.
• Když úložiště platforem vyžadují přesně specifikované vrstvené zdroje PSD.
Kontrolní seznam značek odkazů HTML
Zahrňte rel="icon" pro velikosti PNG, rel="apple-touch-icon" pro iOS a volitelně manifest.json pro PWA. Umístěte soubory na předvídatelné cesty (/favicon.ico stále pomáhá starým prohledávačům).
Design pro 16×16
Při velikosti favicon mizí jemné detaily. Používejte výrazné tvary, vysoký kontrast a vyhněte se tenkým tahům. Mnoho značek používá varianty monogramů pro malé velikosti.
Vynechání mezipaměti při změně značky
Prohlížeče agresivně ukládají favicony do mezipaměti. Při aktualizaci ikon přejmenujte soubory nebo přidejte dotaz ?v=2, aby uživatelé viděli novou značku.
Časté dotazy
Jakou velikost by měl mít zdrojový obrázek?
Čtverec alespoň 512×512 px. Větší předlohy zmenšují lépe než upscalování malých log.
ICO vs PNG favicon?
Moderní prohlížeče akceptují PNG; .ico sdružuje několik velikostí pro starší karty Windows.
velikost ikony apple-touch?
180×180 px pro zástupce na domovské obrazovce iOS — pro nejlepší výsledky použijte PNG bez průhlednosti.
Průhledné pozadí?
Funguje pro karty PNG; Ikony domů pro iOS mohou získat bílou matnou barvu — otestujte na zařízení.
Jsou loga nahraná na server?
Ne — změna velikosti používá plátno lokálně.
Zdroj SVG?
Nejprve převeďte SVG na PNG ve vysokém rozlišení a poté vygenerujte favicony.