Favicon genereren
Maak favicons van tekst, emoji of afbeeldingen voor uw website
Favicon-ontwerp
Kies een emoji
0% is vierkant; 100% gebruikt het oorspronkelijke volledig afgeronde pad.
Afbeeldingsbestand tot 10 MiB. De bronrenderer rekt de afbeelding uit tot een vierkant.
Voorbeeld en bestanden
Dit is een illustratie. De weergave van emoji kan per browser en systeem verschillen.
Livevoorbeeld bijgewerkt. Genereer de bestanden wanneer uw ontwerp klaar is.
Gegenereerde PNG-bestanden
Het ontwerp is gewijzigd. Deze bestanden bevatten nog het laatst gegenereerde ontwerp; genereer ze opnieuw om ze bij te werken.
PNG-bestanden: 16, 32, 48, 64, 128 en 256 px. Het ICO-bestand bevat de gegenereerde PNG van 32 px.
Toevoegen aan uw site
- Upload de gedownloade bestanden en gebruik de gekopieerde tags in de head van uw pagina.
- De standaardpaden in de tags verwijzen naar de hoofdmap van uw site; pas ze aan als u de bestanden elders plaatst.
- De ICO-download bevat één PNG-afbeelding in plaats van elk gegenereerd formaat.
- Apple touch-iconen en iconen voor het webapp-manifest zijn aparte bestanden; deze tool genereert die niet.
- Een favicon verschijnt niet gegarandeerd in zoekresultaten.
- De tool leest uw bestand in de browser zonder het te uploaden. Bewaar een ongewijzigd origineel.
Over de tool Favicon genereren
Met onze gratis online favicongenerator maakt u professionele favicons van tekst, letters, emoji's of geüploade afbeeldingen, rechtstreeks in uw browser. Favicons zijn de kleine pictogrammen in browsertabs, bladwijzers en zoekresultaten en spelen een belangrijke rol bij merkherkenning en gebruikservaring. Met deze tool ontwerpt en downloadt u favicons in meerdere formaten, zonder ontwerpsoftware of technische kennis.
De generator kent drie creatiemodi: de tekst-/lettermodus om favicons te maken van een of twee tekens, met volledige controle over lettertype, kleur en opmaak; de emojimodus om snel favicons te maken van elke emoji, met aanpasbare achtergronden en afmetingen; en de uploadmodus om vierkante faviconbestanden te maken van afbeeldingen die de browser kan decoderen. De tool verwerkt het gekozen bestand lokaal, zonder het te uploaden; dit garandeert niet dat elk ander script of verzoek op de pagina privé is.
De tool genereert zes vierkante PNG-formaten: 16, 32, 48, 64, 128 en 256 px. Download losse bestanden, een ICO van 32 px met één PNG-afbeelding en bijbehorende HTML-linktags. Deze bestanden dekken niet elke pictogramvereiste van elk platform.
Belangrijkste functies
- Drie creatiemodi: tekst/letter, emoji en afbeelding uploaden
- Aanpasbare tekstkleur, achtergrondkleur, lettertypefamilie en lettergewicht
- Instelbare hoekafronding van vierkant tot cirkel
- Ondersteuning voor transparante achtergrond in de tekst- en emojimodus
- Snelkeuzeraster met 32 veelgebruikte emoji's
- Genereert zes standaardformaten voor favicons: 16x16, 32x32, 48x48, 64x64, 128x128 en 256x256
- Direct voorbeeld dat meebeweegt met uw instellingen
- Voorbeeld van een browsertab dat laat zien hoe uw favicon eruitziet
- Losse formaten downloaden als PNG-bestanden
- Download een favicon.ico-container met één gegenereerde PNG van 32 px; compatibiliteit hangt af van de client
- HTML-linktags naar het klembord kopiëren voor eenvoudige integratie in uw website
- Alle verwerking gebeurt in de browser, zonder uploads naar een server
Zo gebruikt u Favicon genereren
- Kies een modus: Selecteer Tekst/Letter om een favicon van tekens te maken, Emoji om een emoji te gebruiken of Afbeelding uploaden om een bestaande afbeelding om te zetten.
- Pas uw ontwerp aan: Voer in de tekstmodus 1-2 tekens in en pas lettergrootte, kleuren, hoekafronding, lettertypefamilie en gewicht aan. Selecteer of typ in de emojimodus een emoji en stel achtergrond en formaat in. Kies in de uploadmodus een afbeeldingsbestand op uw apparaat.
- Bekijk het voorbeeld direct: Zie het directe voorbeeld van 256x256 meteen bijwerken als u instellingen wijzigt. Bekijk het tabvoorbeeld om te zien hoe uw favicon in een echte tab eruitziet.
- Genereer favicons: Klik op de knop „Favicons genereren” om alle zes standaardformaten van uw ontwerp te maken.
- Download uw favicons: Download losse PNG-bestanden voor elk formaat, haal een favicon.ico-bestand op of kopieer de HTML-linktags voor het head-gedeelte van uw website.
- Voeg ze toe aan uw website: Plaats de gedownloade bestanden in de hoofdmap van uw site en plak de HTML-linktags in de head van uw HTML-document.
Toepassingen
- Lancering van een nieuwe website: Maak snel een professionele favicon voor een nieuwe website of webapplicatie, zonder grafisch ontwerper.
- Personal branding: Genereer een favicon met een letter, zoals uw initialen, voor een persoonlijke blog, portfolio of professionele website.
- MVP's van startups: Maak een tijdelijke maar verzorgde favicon in de beginfase van de ontwikkeling, wanneer er nog geen volledige huisstijl is.
- Zijprojecten en experimenten: Geef hobbyprojecten, hackathoninzendingen of experimentele sites karakter met eigen emoji- of tekstfavicons.
- Testen bij webontwikkeling: Genereer tijdelijke favicons voor ontwikkelomgevingen, stagingservers of prototypes voor klanten.
- Beheer van meerdere sites: Maak aparte favicons voor verschillende sites, subdomeinen of webapplicaties, zodat u meerdere geopende tabs beter uit elkaar houdt.
- Documentatie en tutorials: Genereer faviconbestanden voor demowebsites, codevoorbeelden en lesmateriaal.
- Ontwikkeling van browserextensies: Maak pictogrambestanden voor browserextensies die kleine, herkenbare pictogrammen in verschillende formaten nodig hebben.
Veelgestelde vragen
Wat is een favicon?
Een favicon (afkorting van „favorites icon”) is een klein pictogram dat bij een website hoort. Het verschijnt in browsertabs, bladwijzerlijsten, de browsergeschiedenis en zoekresultaten. Favicons helpen gebruikers uw website snel te herkennen en terug te vinden tussen meerdere geopende tabs en bladwijzers.
Welke formaten moet ik voor mijn favicon gebruiken?
Deze tool levert PNG-bestanden van 16, 32, 48, 64, 128 en 256 px en een ICO van 32 px. Kies de formaten die de doelclient vereist; Google Zoeken beveelt momenteel vierkante pictogrammen groter dan 48 px aan en opname is niet gegarandeerd.
Wat is het verschil tussen PNG- en ICO-indelingen?
PNG is een rasterafbeeldingsindeling; ICO is een pictogramcontainer. Deze tool exporteert zes PNG-bestanden en sluit de gegenereerde PNG van 32 px in een ICO-item in. Controleer de eisen van de doelclient; geen van beide indelingen garandeert universele ondersteuning.
Kan ik een transparante favicon maken?
Ja, in zowel de tekst-/lettermodus als de emojimodus kunt u de optie voor een transparante achtergrond inschakelen. Zo maakt u een favicon met een transparante achtergrond, handig voor favicons die moeten opgaan in de achtergrondkleur van de browsertab.
Wordt mijn geüploade afbeelding naar een server gestuurd?
Deze tool verwerkt uw gekozen afbeelding in de browser, zonder die te uploaden. Bestanden zijn beperkt tot 10 MiB en de ondersteunde indelingen hangen af van het decoderen in de browser. Deze verklaring geldt niet voor opslag, tracking of verzoeken van andere scripts op de site.
Hoe voeg ik de favicon toe aan mijn website?
Plaats de gedownloade faviconbestanden in de hoofdmap van uw website (of een submap naar keuze) en voeg de HTML-linktags toe aan het head-gedeelte van uw HTML. U kunt de kant-en-klare linktags uit deze tool kopiëren. Bijvoorbeeld: <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
Tips & best practices
- Houd het eenvoudig: Favicons worden op zeer kleine formaten weergegeven. Gebruik gedurfde, eenvoudige vormen en kleuren met hoog contrast die herkenbaar blijven op 16x16 pixels.
- Gebruik maximaal 1-2 tekens: Bij favicons van tekst werkt één teken het best. Twee tekens kunnen werken, maar zijn op kleine formaten mogelijk minder leesbaar.
- Kies contrasterende kleuren: Zorg dat uw tekst of emoji duidelijk afsteekt tegen de achtergrond. Hoog contrast zorgt voor zichtbaarheid in browsertabs.
- Test op kleine formaten: Controleer altijd hoe uw favicon eruitziet op 16x16 en 32x32 voordat u klaar bent. Wat er op 256x256 geweldig uitziet, is op kleinere formaten misschien niet leesbaar.
- Denk aan de donkere modus: Veel gebruikers surfen met een donker browserthema. Een favicon met een transparante achtergrond en donkere inhoud kan onzichtbaar worden. Overweeg een gekleurde achtergrond of lichte inhoud.
- Gebruik de hoekafronding: Afgeronde hoeken (20-30%) geven favicons een moderne, verzorgde uitstraling. Een volledige cirkel (100%) werkt goed voor losse letters of emoji's.
- Voeg meerdere formaten toe: Lever bestanden die passen bij uw doelclients. Deze tool genereert de zes genoemde PNG-formaten en één ICO; Apple touch-pictogrammen en pictogrammen voor webapp-manifesten vereisen aparte bestanden en volledige dekking van alle apparaten is niet gegarandeerd.