Bygg en webbplatsikon av en eller två bokstäver

Små varumärken och webbplatsskapare gör en skarp ikon före lansering utan att öppna ett fullskaligt grafikprogram.

Bygg en webbplatsikon av en eller två bokstäver. Dina uppgifter stannar lokalt medan resultatet är lätt att kontrollera och återanvända.

Så använder du

  1. Ange en eller två bokstäver som ska representera din webbplats i ikonen.
  2. Välj en bakgrundsfärg och ange sedan eventuellt en textfärg.
  3. Kör generatorn för att skapa en SVG-ikon.
  4. Kopiera eller ladda ner SVG:n och placera den i webbplatsens filer.

Exempel

Ett enkelt fall är att använda initialerna i ett varumärke med en ljus bakgrund och ljus text. Efter genereringen bör du öppna SVG:n för att kontrollera att bokstäverna är centrerade och att resultatet fortfarande är läsbart i en liten webbläsarflik.

Indata

YT
#0b57b7
#ffffff

Gränser och format

Var bearbetningen sker

Ikonens komposition sker i din webbläsare. Bokstäverna och färgerna du anger skickas inte till en extern tjänst. Du kan förbereda en favicon utan att överföra dina designval.

Vanliga frågor

Kan jag använda fler än två bokstäver?

Verktyget är avsett för en eller två bokstäver för att hålla ikonen läsbar. Om du anger fler tecken kan resultatet se för trångt ut. För en mer detaljerad logotyp bör du använda en särskild grafikredigerare.

Är SVG-filen redo att använda?

Ja, resultatet är en SVG som du kan kopiera eller ladda ner. Lägg till den i ditt projekt och referera till den i webbplatskoden. Kontrollera sedan hur den visas i en webbläsare och i en förminskad flik.

Kan jag välja en exakt färg?

Du kan ange en bakgrundsfärg och vid behov en textfärg. Använd ett igenkänt hexadecimalt värde. Kontrollera kontrasten efter genereringen så att bokstäverna förblir synliga mot bakgrunden.

Kan jag skapa en avancerad logotyp med gradienter och former?

Nej, verktyget är begränsat till en eller två bokstäver och enkla färger. Det har inga avancerade former eller gradienter och ersätter inte ett grafikprogram för komplexa logotyper. Om du behöver en detaljerad ikon bör du rita den i ett bildredigeringsprogram och sedan lägga in den i ditt projekt. Testa alltid hur ikonen ser ut i liten storlek.

Fungerar SVG-favicon i alla webbläsare?

Inte nödvändigtvis. SVG-favicons stöds inte av alla webbläsare eller visningssammanhang. Därför bör du testa hur ikonen renderas i liten storlek och i en flik innan du publicerar den på en produktionssajt. Verktyget skapar SVG i webbläsaren, och bokstäverna och färgerna du anger skickas inte till någon extern tjänst.

Verktyg i samma kategori