Favicon-generator

Een favicon is het kleine icoon dat in browsertabbladen, bladwijzers en op de startschermen van telefoons wordt getoond. Het is een klein detail dat een site af en herkenbaar laat lijken, en moderne browsers verwachten er meerdere versies van.

Dat is het addertje: een afbeelding is niet meer genoeg. Je hebt een .ico met meerdere formaten nodig voor klassieke browsers, aparte PNG-formaten, een Apple touch-icoon voor iOS-startschermen, grotere PNG's voor Android, en een web-manifest als de site installeerbaar moet zijn.

Deze generator bouwt de hele set uit een enkele afbeelding, inclusief een echte .ico met meerdere formaten, en geeft je precies het HTML-fragment om in de head van je pagina te plakken, zodat je niets hoeft samen te stellen of met de hand te schrijven.

Voor het beste resultaat upload je een vierkante afbeelding van minstens 512 px, bij voorkeur een eenvoudig logo of merkteken in plaats van een gedetailleerde foto, aangezien het icoon vaak heel klein wordt getoond. Een niet-vierkante afbeelding wordt gecentreerd en tot een vierkant opgevuld, dus detail bij de randen kan in de marges belanden.

Je kunt optioneel een achtergrondkleur en je sitenaam instellen. De sitenaam komt in het web-manifest dat wordt gebruikt wanneer iemand de site aan het startscherm toevoegt.

Alles draait lokaal in je browser met de Canvas API, dus je afbeelding wordt nooit geüpload. Je downloadt een ZIP met alle bestanden en het fragment om in te plakken.