PWA-ikongenerator
Generer ikonene en installerbar webapp trenger — PNG-er på 192 og 512 px pluss et site.webmanifest — fra ett bilde, helt i nettleseren din.
Personvern først: hvert bilde behandles lokalt i nettleseren din. Ingenting lastes opp, lagres eller sendes til noen server.
Ikonene som gjør en app installerbar
En progressiv webapp vurderes som installerbar delvis ut fra ikonene sine: nettlesere ser etter et webmanifest som erklærer minst en PNG på 192×192 og en på 512×512 før de tilbyr en installasjonsdialog eller legger et anstendig ikon på hjemskjermen. Denne generatoren gjengir begge fra kildebildet ditt og skriver et site.webmanifest som refererer til dem, sammen med det apple-touch-icon-et iOS vil ha og et favicon.ico til vanlige faner.
Form det for appstarteren
Android-appstartere kan maskere et ikon til en sirkel eller et avrundet kvadrat, så grafikk som går helt ut til kanten kan bli klippet. Legg til marg og en ensfarget bakgrunn her, så holder den viktige delen seg innenfor det trygge området uansett hvilken maske som brukes; den live forhåndsvisningen viser resultatet i hver størrelse. Alt gjengis på enheten din med Canvas API — logoen din lastes aldri opp — og hele settet lastes ned som en zip.
Ofte stilte spørsmål
- Blir bildet mitt lastet opp for å lage faviconet?
- Nei. Både favicon.ico-filen, PNG-ikonene og manifestet genereres lokalt i nettleseren din ved hjelp av Canvas API. Bildet ditt forlater aldri enheten din.
- Hvilke størrelser og filer får jeg?
- En favicon.ico i flere oppløsninger (16, 32 og 48px), PNG-ikoner på 16, 32, 48, 180 (apple-touch-icon), 192 og 512px, en site.webmanifest og en HTML-snutt du kan lime inn i <head>.
- Kan jeg konvertere en PNG eller SVG til en ICO?
- Ja. Slipp inn en PNG, JPG, SVG eller WebP, og last ned en ekte favicon.ico. SVG-logoer rasteriseres først lokalt i høy oppløsning.
- Hvilket bilde fungerer best?
- Et firkantet bilde med en enkel logo med høy kontrast. Bilder som ikke er firkantede, beskjæres fra midten for å passe; bruk kontrollene for utfylling og form til å ramme det inn slik du vil.
- Hvordan installerer jeg faviconet?
- Pakk ut pakken i rotmappen på nettstedet ditt, og lim den medfølgende HTML-snutten inn i <head> på sidene dine. Favicon.ico-filen plukkes opp automatisk av de fleste nettlesere.