Een goede faviconset is meer dan één bestand: browsers willen een .ico met meerdere formaten, iOS wil een apple-touch-icon van 180px, Android wil PNG's van 192 en 512px plus een webmanifest. Deze tool rendert ze allemaal uit één afbeelding en verpakt ze in één ZIP, samen met de exacte HTML-tags om in je <head> te plakken.
De voorvertoning toont je icoon op echt 16, 32 en 48px, zodat je kunt controleren of het herkenbaar blijft op kleine formaten voordat je het uitbrengt.
Hoe te gebruiken
- Voeg je logo toeVierkante afbeeldingen werken het best; andere worden centraal bijgesneden.
- Controleer de kleine formatenDe voorvertoning van 16px is wat de meeste gebruikers daadwerkelijk in een tabblad zien.
- Download de ZIPfavicon.ico, zes PNG's, site.webmanifest en een kant-en-klaar html-snippet.txt om te plakken.
Eén afbeelding erin, een volledige faviconset eruit
Voeg één logo of icoon toe en deze generator bouwt de complete set die een moderne site nodig heeft: een favicon.ico met meerdere formaten die versies van 16, 32 en 48 pixels bundelt, losstaande PNG's op 16, 32, 48, 180 voor het Apple touch-icoon, en 192 en 512 voor Android- en PWA-installaties, plus een site.webmanifest. Alles komt als één ZIP naar beneden zodat je het direct in je projectroot kunt zetten.
Je krijgt ook een kant-en-klaar HTML-head-fragment met de juiste link- en meta-tags al aangesloten. Kopieer het in je sjabloon, upload de bestanden, en de favicon verschijnt in browsertabbladen, bladwijzers en snelkoppelingen op het startscherm zonder dat je zelf markup schrijft.
Scherpe iconen op elk formaat
Favicons zijn genadeloos klein, dus de generator rendert previews op ware grootte op 16, 32 en 48 pixels, precies zoals een browsertabblad ze toont. Zo vang je een logo dat op 16px tot pap verandert vóór je het uitlevert. Is je bronafbeelding niet vierkant, dan snijdt de tool hem vanuit het midden bij zodat het icoon in balans blijft in plaats van geplet.
Het hele proces draait in de browser vanaf je oorspronkelijke afbeelding, wat betekent dat je favicon-PNG's en een ICO uit een logo in hoge resolutie kunt genereren zonder enige upload of account.
Waar mensen het voor gebruiken
Een nieuwe site lanceren — Genereer favicon.ico en elk PNG-formaat in één keer zodat tabbladen en bladwijzers er vanaf dag één afgerond uitzien.
Een PWA-installatie-icoon toevoegen — Exporteer de PNG's van 192 en 512 plus een site.webmanifest zodat je app installeert met een net startscherm-icoon.
Apple touch-icoon — Maak het 180x180 apple-touch-icon zodat iOS-bladwijzers en startschermen een scherpe tegel tonen.
Een bestaande site herbranden — Wissel één nieuw logo door de generator en vervang de hele iconenset in één keer.
Overdracht aan klant — Overhandig één ZIP met ico, PNG's, manifest en het head-fragment zodat de ontwikkelaar het gewoon plaatst.
Leesbaarheid op klein formaat controleren — Gebruik de 16px-preview op ware grootte om te bevestigen dat een gedetailleerd logo nog als icoon leest.
Niet-vierkant logo — Voer een breed woordmerk in en laat de bijsnede vanuit het midden er een gebalanceerde vierkante favicon van maken.
Statische site of framework-project — Kopieer de gegenereerde head-tags in je Next-, Astro- of gewone HTML-sjabloon en lever uit.
Genereer een volledige faviconset uit één afbeelding — in de browser, in één keer
Een favicon klinkt als een enkele bijzaak van 16×16 pixels, en jarenlang was het dat ook. Moderne browsers en platforms hebben het stilletjes in een kleine productie veranderd. Om het vandaag de dag goed te doen heb je een favicon.ico nodig, een reeks PNG's van 16px tot 512px, een Apple touch-icoon voor iOS-startschermen, een site.webmanifest zodat de site als app geïnstalleerd kan worden, en het juiste blok <link>- en <meta>-tags in je HTML-<head>. Mis je een formaat, dan ziet je tabbladicoon er wazig uit op een retinascherm; mis je het manifest, dan valt het "toevoegen aan startscherm"-icoon terug op een screenshot; doe je het tagblok verkeerd, dan negeren sommige platforms het hele ding.
Dat is een hoop priegelige uitvoer voor een taak die je één keer per project doet om vervolgens de details te vergeten. IMG.DIY neemt één bronafbeelding en produceert de volledige set — de .ico, elk PNG-formaat, het webmanifest en een kopieer-en-plak HTML-fragment — en verkleint volledig in je browser met Canvas. Je logo wordt lokaal gelezen en op het apparaat naar elk doelformaat gerenderd; er wordt niets geüpload. Voor een merkteken of het logo van een nog niet uitgebracht product dat je liever niet vóór lancering naar de server van een derde plaatst, is die lokale garantie het waard, en het kost niets.
Omdat de hele verwerking aan de clientkant draait, werkt het ook offline zodra de PWA in de cache staat, zodat je iconen kunt regenereren op een afgeschermde werkmachine of zonder verbinding. Gratis, geen account, geen watermerk in je iconen gebakken.
Wat het anders maakt
- De hele set, niet alleen een .ico. ICO, PNG's van 16 tot 512, Apple touch-icoon en
site.webmanifestin één download. - Kopieer-en-plak HTML inbegrepen. Het exacte
<link>/<meta>-blok om in je<head>te zetten, zodat de iconen zich daadwerkelijk registreren over browsers heen. - Er wordt niets geüpload. Je logo wordt lokaal verkleind — handig wanneer het teken vertrouwelijk of vóór lancering is.
- Eén keer, geen wizard. Voer één afbeelding in, krijg alles; geen meerstapsstroom die vraagt om platformkeuzes die je dan moet uitzoeken.
- Offline en schoon. In de cache opgeslagen PWA, geen registratie, geen watermerk op enig gegenereerd icoon.
IMG.DIY vs. andere favicongeneratoren
| Aspect | favicon.io | realfavicongenerator.net | Handmatig (ontwerpapp + code) | IMG.DIY |
|---|---|---|---|---|
| Bestanden geüpload | Ja, naar hun server | Ja, naar hun server | Nee, lokaal | Nee, blijft in de browser |
| Volledige set (.ico + PNG's + manifest) | Ja | Ja, zeer grondig | Je stelt het zelf samen | Ja |
| HTML-fragment geleverd | Ja | Ja, gedetailleerd | Je schrijft het | Ja |
| Stappen tot resultaat | Weinig | Meer (veel opties) | Veel | Eén keer |
| Werkt offline | Nee | Nee | Ja | Ja, na eerste bezoek |
| Prijs | Gratis | Gratis niveau; betaalde opties | Appkosten + je tijd | Gratis |
| Account vereist | Nee | Nee | Nee | Nee |
Eerlijk over de concurrentie: realfavicongenerator is uitstekend en oprecht grondiger — het toont een voorvertoning van je icoon op echte platforms, handelt randgevallen af zoals Safari's pinned-tab-maskers en theming, en laat je het uiterlijk per platform afstellen. Wil je dat controleniveau en vind je uploaden geen probleem, dan is het een prima keuze. favicon.io is snel en simpel en produceert ook een degelijke set. Het verschil van IMG.DIY is de combinatie van volledige uitvoer met geen upload en één keer: je krijgt dezelfde praktische opleveringen — ico, PNG's, manifest en de HTML om ze aan te sluiten — zonder dat je logo de browser verlaat en zonder door een configuratiewizard te stappen. Voor "ik heb een logo, geef me alles wat ik moet plakken, en stuur mijn bestand nergens heen" is dat de match.
Waarom IMG.DIY
Complete set
ICO + 16/32/48/180/192/512 PNG's + manifest.
Kopieer-en-plak HTML
De exacte link-tags meegeleverd als tekstbestand.
Voorvertoning op ware grootte
Zie het icoon eerst op echt 16/32/48px.
Privé
Je logo verlaat nooit de browser.