Hva verktøyet gjør
Dette verktøyet tar en enkelt bildefil som du oppgir, og konverterer den til en samling av ikonfiler som er egnet for ulike formål på et nettsted. Dette inkluderer ikoner for nettleserfaner, Apple touch-ikoner og ikoner for progressive webapper (PWA-er). Verktøyet pakker deretter disse ikonene inn i en nedlastbar ZIP-fil og gir deg den nødvendige HTML-kodesnutten for å integrere dem på nettstedet ditt.
Når du laster inn et bilde, viser verktøyet bredden og høyden på det innlastede bildet som "{w} × {h} px".
Slik forbereder du kildebildet
For å oppnå best mulig resultat med favicon-generatoren, bør du ta hensyn til følgende krav og anbefalinger for kildebildet:
- Støttede formater: Verktøyet støtter kun bildefiler i formatene PNG, JPG eller SVG.
- Filstørrelsesgrense: Du kan laste opp filer på opptil 50 MB.
- Anbefalt størrelse: Hvis du bruker et PNG- eller JPG-bilde, anbefales en størrelse på minst 512 × 512 piksler. Mindre kildebilder vil bli oppskalert, noe som kan føre til at de store ikonene ser uskarpe ut.
- Vektorgrafikk: Hvis kildebildet ditt er en SVG-fil, vil selve vektoren inkluderes i ikonpakken. Dette sikrer at ikonene forblir helt skarpe i alle størrelser.
Tilpasning av form og bakgrunn
Ikoner er alltid kvadratiske. Hvis kildebildet ditt ikke er kvadratisk, kan du velge hvordan bildet skal tilpasses i kvadratet:
- Tilpass (utfylling): Dette er standardvalget. Hele bildet forblir synlig og sentreres med en utfylling rundt.
- Fyll (beskjær): Bildet fyller hele kvadratet, og kantene som går utenfor blir beskåret.
Du kan også konfigurere ikonets bakgrunn:
- Gjennomsiktig: Dette er standardvalget. Gjennomsiktig bakgrunn passer best for nettleserfaner.
- Farge: Du kan velge en spesifikk bakgrunnsfarge. En bakgrunnsfarge er tryggere for hjemskjerm-ikoner på iPhone, ettersom gjennomsiktige områder på disse enhetene ellers blir farget svarte.
Innholdet i den genererte ikonpakken
Når du genererer ikonene, produserer verktøyet en komplett pakke som inneholder følgende filer:
- favicon.ico: Inneholder versjoner på 16, 32 og 48 piksler i én enkelt fil.
- PNG-ikoner: Genereres i størrelsene 16, 32, 180, 192 og 512 piksler.
- site.webmanifest: En liten tekstfil som lister opp de store ikonene.
- Vektorfil: Hvis du startet med en SVG-fil, blir selve vektoren inkludert i pakken.
I tillegg til filene får du en HTML-kodesnutt ("Kopier kode") som du kan lime inn i <head>-elementet på nettstedets sider.
Personvern og lokal behandling
Når du bruker denne favicon-generatoren, blir bildet ditt gjort om til ikoner direkte i nettleseren din. Ingenting lastes opp til BroBroGo.
Feilsøking og feilmeldinger
Hvis noe går galt under prosessen, kan du støte på en av følgende feilmeldinger i grensesnittet:
- "Bare PNG-, JPG- og SVG-bilder støttes.": Vises hvis du prøver å laste opp et uoverensstemmende filformat.
- "Denne filen er over 50 MB. Bruk et mindre kildebilde.": Vises hvis filen overskrider den tillatte størrelsesgrensen.
- "Velg et PNG-, JPG- eller SVG-bilde først.": Vises hvis du prøver å starte genereringen uten å ha valgt en fil.
- "Denne filen kunne ikke åpnes som et bilde. Den kan være skadet, tom eller ikke et faktisk bilde.": Vises hvis bildefilen ikke kan dekodes.
- "Denne SVG-filen kunne ikke leses. Sjekk at filen er et gyldig SVG-dokument.": Vises hvis en opplastet SVG-fil inneholder feil eller er ugyldig.
- "Liten kilde (
{w}×{h}px): de store ikonene kan se uskarpe ut. 512 × 512 eller større — eller en SVG — gir best resultat.": En advarsel som vises hvis det opplastede bildet er for lite. - "Genereringen mislyktes. Prøv et annet bilde.": Vises dersom den tekniske genereringen av ikonpakken feiler.
Ofte stilte spørsmål (FAQ)
Hvilke filer er inkludert i ikonpakken?
Pakken inneholder en favicon.ico (med versjoner på 16, 32 og 48 piksler inni), PNG-ikoner på 16, 32, 180, 192 og 512 piksler, samt en site.webmanifest som lister opp de store ikonene. Starter du fra en SVG, blir selve vektoren også inkludert. Én ZIP-fil inneholder alt.
Hvilken størrelse bør kildebildet mitt ha?
En SVG er ideell, ettersom hvert ikon tegnes direkte fra vektoren slik at selv 16 piksler forblir skarpt. For PNG eller JPG bør du starte med et bilde som er minst 512 × 512 piksler; mindre bilder blir oppskalert og kan se uskarpe ut.
Bør bakgrunnen være gjennomsiktig eller ha en farge?
Faneikoner ser bra ut med gjennomsiktig bakgrunn. Hjemskjermer på iPhone og iPad fyller imidlertid gjennomsiktige områder med svart. Hvis det er sannsynlig at brukere legger til nettstedet ditt på hjemskjermen, bør du velge en bakgrunnsfarge.
Hva skjer med et bilde som ikke er kvadratisk?
Ikoner er alltid kvadratiske, men bildet ditt blir aldri strukket. Som standard sentreres det med utfylling rundt ("Tilpass (utfylling)"). Du kan også bytte til "Fyll (beskjær)" for å trimme bort de overskytende kantene i stedet.
Hvor skal filene plasseres på nettstedet mitt?
Last dem opp til rotmappen på nettstedet ditt, slik at favicon.ico er tilgjengelig på /favicon.ico. Lim deretter de genererte linjene inn i <head>-elementet på sidene dine. Nettlesere vil velge riktig størrelse automatisk.