Softonic

Favicon-generator för initialer och emoji

Skapa en enkel och lättigenkännlig favicon utan att först förbereda en bild. Ange en eller två initialer eller välj en enda emoji och justera sedan form och bakgrundsfärg. För initialer kan du även välja teckenfärg och typsnittsstil; emoji behåller webbläsarens inbyggda utseende. Förhandsvisningen på 512 px uppdateras i webbläsaren. Den färdiga nedladdningen innehåller små webbläsarikoner, mobilikoner och konfigurationsfiler som behövs för att lägga till motivet på en webbplats. Ingenting laddas upp och ingen AI används.

Så skapar du en favicon

  1. 1

    Välj ikonens innehåll

    Ange en eller två initialer för ett kompakt bokstavsmärke eller använd en emoji som motiv.

  2. 2

    Formge motivet

    Välj kvadrat, rundad kvadrat eller cirkel och ställ in bakgrundsfärgen. För initialer kan du även ändra teckenfärg och typsnittsstil; emoji behåller sitt inbyggda utseende.

  3. 3

    Kontrollera förhandsvisningen

    Granska förhandsvisningen på 512 px och bedöm även om motivet förblir tydligt när det minskas till 16 px i en webbläsarflik.

  4. 4

    Ladda ner och installera

    Ladda ner favicon-paketet som skapats lokalt, lägg till filerna på webbplatsen och klistra in eller anpassa det medföljande kodavsnittet för `<head>`.

Det här ingår i favicon-paketet

En och samma favicon måste fungera på flera platser, från en liten webbläsarflik till en mobil hemskärm. Generatorn renderar motivet i de praktiska storlekarna nedan och paketerar filerna lokalt.

Paketfil Storlek eller innehåll Avsedd användning
favicon.ico Bilder på 16, 32 och 48 px Webbläsarflikar, bokmärken och program som fortfarande begär en ICO-fil
favicon-16x16.png 16 × 16 px Liten favicon för webbläsare
favicon-32x32.png 32 × 32 px Standardfavicon för webbläsare
apple-touch-icon.png 180 × 180 px Apple-touchikon
android-chrome-192x192.png 192 × 192 px Webbappikon för mindre Android-sammanhang
android-chrome-512x512.png 512 × 512 px Större webbappikon
mstile-150x150.png 150 × 150 px Bild för Microsoft-panel
site.webmanifest JSON-manifest Hänvisar till Android-ikonerna i webbläsare som använder ett webbappmanifest
browserconfig.xml XML-konfiguration Hänvisar till Microsoft-panelens bild och färg
favicon-head.html HTML-avsnitt Färdiga hänvisningar till ikoner, manifest och webbläsarkonfiguration att kopiera

Skapa en favicon som fungerar även i 16 px

En favicon är inte en miniatyraffisch. Små detaljer, långa ord och subtila färgskillnader försvinner snabbt i storleken för en webbläsarflik. En tydlig initial, ett kort märke med två bokstäver eller en enkel emoji är oftast lättare att känna igen än en komplicerad komposition.

  • Använd stark kontrast mellan tecken och bakgrund när du gör en favicon av initialer.
  • Lämna luft runt bokstäver och emoji så att plattformarnas masker inte tränger ihop motivet.
  • Jämför kvadrat, rundad kvadrat och cirkel innan du väljer den tydligaste silhuetten.
  • Bedöm de små exporterade ikonerna utöver förhandsvisningen på 512 px. Ett motiv som ser välgjort ut i full storlek kan bli otydligt i 16 px.
  • Testa den installerade faviconen i flera webbläsare och mot både ljust och mörkt webbläsargränssnitt.

Lägg till de genererade filerna på webbplatsen

Behåll de genererade filnamnen och placera filerna där det medföljande avsnittet för <head> förväntar sig dem, vanligtvis i webbplatsens rotkatalog. Klistra in avsnittet i <head> i varje sidmall. Om ditt ramverk levererar statiska resurser från en annan katalog eller via ett innehållsleveransnätverk ska du uppdatera sökvägarna i kodavsnittet, manifestet och webbläsarkonfigurationen före publicering.

De medföljande filerna ger hänvisningar till ikonerna, men de gör inte en webbplats installerbar som en progressiv webbapp på egen hand. Installation kan kräva fler manifestfält, säker hosting och webbläsarspecifika villkor.

Vanliga frågor

Ja. Ange en eller två initialer och välj sedan form, bakgrundsfärg, förgrundsfärg och typsnittsstil. Den korta texten är avsiktlig eftersom den förblir mer läsbar i små favicon-storlekar.

Ja. Emojin behåller webbläsarens inbyggda utseende, medan form och bakgrundsfärg fortfarande kan ändras. Kontrollera förhandsvisningen före nedladdningen, eftersom utseendet varierar mellan system och webbläsare och komplexa emoji inte finns överallt.

Ja. Paketet innehåller en favicon.ico med bilder på 16, 32 och 48 px, separata PNG-favicons på 16 och 32 px samt större ikoner för Apple, Android och Microsoft.

Favicon-generator skapar ett nytt motiv av initialer, kort text eller en emoji. Favicon-konverterare är det separata verktyget för att omvandla en befintlig PNG-, JPEG- eller WebP-bild till favicon-filer.

Nej. Texten eller emojin, renderingen av förhandsvisningen och skapandet av paketet stannar i webbläsaren. Verktyget laddar inte upp motivet och hämtar ingen webbplats.

Nej. Den tillämpar dina val och använder ingen AI. Den kan inte heller avgöra om initialer, en emoji, färger eller det färdiga motivet strider mot ett varumärke eller någon annans rättigheter. Kontrollera rättigheterna innan du använder faviconen kommersiellt.

Webbläsare lagrar ofta favicons i cacheminnet. Kontrollera att de genererade filerna och hänvisningarna i <head> har publicerats på de förväntade sökvägarna. Rensa sedan webbläsarens cache eller testa i ett privat fönster. Vissa sökmotorer och plattformar uppdaterar ikoner enligt sitt eget schema.

Relaterade verktyg

PNG till JPG-omvandlare

Omvandla PNG till JPG i webbläsaren. Platta ut transparens mot valfri bakgrundsfärg, behåll måtten och minska många fotoliknande PNG-filer med 60-90 %.

Streckkodsgenerator

Skapa skanningsbara 1D-streckkoder i Code 128, Code 39, EAN-13, UPC-A, ITF-14 och Codabar. Exportera som PNG, SVG eller PDF för tryck.

Memegenerator

Skapa memes med kända mallar som Drake, Distracted Boyfriend eller Doge, eller ladda upp en egen bild. Över- och undertext med Impact-typsnitt, kontur och skugga.

Bildstorleksändrare för sociala medier

Ändra storlek på en bild till inbyggda sociala medie-presets för Instagram, Facebook, X, LinkedIn, YouTube, Pinterest och TikTok. Förhandsgranska varje PNG och ladda ned de storlekar du behöver.

Vektorisera PNG till SVG

Spåra PNG-rasterbilder till SVG-banor direkt i webbläsaren. Bäst för logotyper, ikoner och linjeteckningar. Styr tröskelvärde, antal färger och utjämning.

BMP till PNG

Konvertera BMP-filer till PNG i webbläsaren. Förlustfritt, bevarar färgdjup och lägger till valfri transparens från BMP-filens ursprungliga alfakanal.