PNG naar ICO (favicon) converteren

Een favicon is het kleine icoon dat browsers tonen in het tabblad, de bladwijzerbalk en de geschiedenis. Deze tool maakt van een PNG een echt .ico-bestand met meerdere formaten, met versies van 16, 32, 48 en 64 pixels, volledig gebouwd op je apparaat zonder uploads.

Zo converteer je PNG naar ICO

  1. Sleep je PNG-afbeelding naar de tool hieronder. Een vierkante afbeelding werkt het best.
  2. Het uitvoerformaat staat al op ICO (favicon).
  3. Klik op Start om een .ico met meerdere formaten te genereren.
  4. Download je favicon.ico en zet hem in de hoofdmap van je site.

Wat een favicon moet doen

Een favicon wordt op heel kleine formaten getoond, vaak 16 pixels vierkant. Op dat formaat verdwijnt fijn detail en vervagen dunne lijnen helemaal. Een goede favicon is een gedurfde, eenvoudige vorm met sterk contrast: één letter, een vereenvoudigde versie van een beeldmerk, of een egale vorm in de huisstijlkleur. Als je volledige logo een woordmerk heeft, gebruik dan alleen het symbool, of alleen de eerste letter.

De reden dat .ico-bestanden meerdere formaten bevatten, is dat één afbeelding op weergavemoment op- of afschalen wazig oogt. Door versies van 16, 32, 48 en 64 pixels aan te leveren, kan het besturingssysteem of de browser in elke context een pixelexacte afbeelding tonen: 16 px in een tabblad, 32 px in een bladwijzerlijst op een scherm met hoge DPI, 48 px in een snelkoppeling op de Windows-taakbalk, enzovoort.

De bron-PNG voorbereiden

  • Maak hem vierkant. Als je logo breed is, zet het dan eerst op een vierkant transparant canvas, of snij bij tot het symbool met de bijsnijtool.
  • Begin op 256 pixels of groter. Verkleinen vanuit een grote, schone bron geeft gladdere resultaten dan een kleine vergroten.
  • Houd een transparante achtergrond als de vorm egaal is, zodat hij goed staat op zowel lichte als donkere browserthema's. Als de vorm dun of lichtgekleurd is, zet hem dan op een egaal afgerond vierkant.
  • Vermijd tekst langer dan één of twee tekens; die is op 16 pixels onleesbaar.

De favicon installeren

Sla het gedownloade bestand op als favicon.ico en zet het in de hoofdmap van je site. Voeg dan dit toe in de <head> van elke pagina:

<link rel="icon" href="/nl/favicon.ico" sizes="any">

De meeste platforms hebben in plaats daarvan een speciale instelling: WordPress noemt het het Site-icoon onder Weergave, Shopify en Squarespace hebben een Favicon-veld in de thema-instellingen, en Webflow heeft er een in de Projectinstellingen. Upload de .ico daar.

Verder gaan

Voor de volledige set iconen waar moderne apparaten om vragen, wil je ook een PNG van 180 pixels voor snelkoppelingen op het iOS-beginscherm (apple-touch-icon) en PNG's van 192 en 512 pixels voor Android en het web-app-manifest. Dat zijn gewone PNG-bestanden, dus gebruik de verkleintool om ze van dezelfde master te maken. De .ico van deze pagina dekt browsertabbladen, bladwijzers en Windows, en dat is waar de meeste mensen een ontbrekende favicon opmerken.

Veelgestelde vragen

Hoe groot moet mijn bron-PNG zijn?

Vierkant, en minstens 64 bij 64 pixels. Een vierkante PNG van 256 pixels geeft de schoonste verkleinde resultaten. Niet-vierkante afbeeldingen worden gecentreerd en opgevuld met transparantie.

Wat zit er in het .ico-bestand?

Vier PNG-gecodeerde afbeeldingen van 16, 32, 48 en 64 pixels. Browsers en Windows kiezen het formaat dat het best bij de context past, zodat het icoon scherp is in een tabblad, een bladwijzer en een snelkoppeling op het bureaublad.

Hoe voeg ik de favicon toe aan mijn website?

Upload favicon.ico naar de hoofdmap van je site (zodat hij bereikbaar is op jouwsite.nl/favicon.ico) en voeg <link rel="icon" href="/favicon.ico"> toe in de <head> van je pagina's. Browsers cachen favicons agressief, dus een harde vernieuwing kan nodig zijn om de wijziging te zien.

Heb ik in 2026 nog een .ico-bestand nodig?

Moderne browsers accepteren PNG- en SVG-favicons, maar .ico is het enige formaat dat overal werkt, inclusief oudere browsers, Windows-snelkoppelingen en sommige feedreaders. De meeste sites leveren beide.

Je bestanden verlaten je apparaat nooit

Elke tool op Squishly Tools is 100% gratis en draait volledig in je browser. Je afbeeldingen en documenten worden op je eigen computer verwerkt en nooit naar een server geüpload. Geen accounts, geen watermerken en geen addertje onder het gras.