Az eszköz betöltése…
Írj be egy-három betűt vagy tölts fel egy képet, válassz színt és formát, és letöltheted a teljes favicon-csomagot: ICO, SVG, PNG-k, apple-touch-icon, maskable ikon, manifest és a beillesztendő HTML-kód.
Lépésről lépésre
Betű(k) saját betűtípussal, vagy feltöltött PNG, JPG, SVG (a kép nem kerül fel sehova).
Háttér- és betűszín, négyzet, lekerekített vagy kör forma, átlátszó háttér.
Böngészőfülön és minden méretben (16-tól 512 px-ig), a maskable változattal együtt.
ZIP: favicon.ico, favicon.svg, PNG-k, apple-touch-icon, site.webmanifest, HTML-kód és rövid útmutató.
GYIK
Igen, ingyenes, és regisztráció nélkül is használhatod. Belépve elmentheted a beállításaidat, és később folytathatod, akár másik gépen is.
Egy favicon.ico (a régi böngészőknek és a Google-nek), egy favicon.svg (éles minden méretben), egy 180 px-es apple-touch-icon (iPhone kezdőképernyő), és a manifestben 192 és 512 px-es PNG, plusz egy maskable ikon az Androidnak. Mindet megkapod.
Az Android saját formára (kör, csepp, négyzet) vágja az alkalmazásikonokat. A maskable ikonon a tartalom a középső biztonságos zónában van, teli háttérrel, így vágás után sem csonkul.
A böngészők sokáig gyorsítótárazzák a faviconokat. Csere után frissíts erősen (Ctrl+F5), vagy nézd meg privát ablakban.
Nem: a kép a böngésződben készül el minden méretben. Belépve a betűs beállításokat elmentheted; feltöltött képet nem mentünk.
Eszközök
A ZIP-ben: favicon.ico (16, 32, 48), favicon.svg, 16/32/48 PNG, apple-touch-icon (180), 192 és 512 px, maskable 512, site.webmanifest és a HTML-kód.
<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="theme-color" content="#2563eb">