Favicon-generator

Browsers verwachten meerdere pictogramformaten: klassiek 16×16 favicon.ico, 32×32 tabbladpictogrammen, 180×180 Apple-touch-pictogram en 192×192 PWA-pictogrammen. Upload een vierkant logo en download een complete set — lokaal gegenereerd zonder je merkitems naar een server te sturen.

Zo genereer je favicons

1. Upload een vierkante PNG of JPG (512×512 of groter aanbevolen).
2. Bekijk een voorbeeld van gegenereerde formaten.
3. Download het pictogrampakket of afzonderlijke bestanden.
4. Voeg linktags toe aan je HTML-head en plaats bestanden in /public of de hoofdmap van de site.

Favicon-installatievoorbeelden

Nieuwe statische site

Genereer favicon.ico plus 32×32 PNG en voeg standaard link rel="icon"-tags toe aan layout.html.

PWA-manifest

Exporteer 192×192 en 512×512 PNG voor de array met manifest.json-pictogrammen.

Rebrand-wissel

Vervang één hoofdlogo en genereer alle formaten opnieuw, zodat tabbladen en snelkoppelingen op het startscherm overeenkomen.

Wanneer gebruik je deze tool

• Bij het lanceren van een site en alle standaard pictogramformaten tegelijk nodig hebben.
• Wanneer je een rasterlogo heeft, maar geen .ico-bestand met meerdere formaten.
• Wanneer je lokale generatie wilt zonder merkitems te uploaden.

HTML checklist voor linktags

Voeg rel="icon" toe voor PNG-formaten, rel="apple-touch-icon" voor iOS en optioneel manifest.json voor PWA's. Plaats bestanden op voorspelbare paden (/favicon.ico helpt nog steeds bij oude crawlers).

Veelgestelde vragen

Hoe groot moet de bronafbeelding zijn?

Minimaal 512×512 px vierkant. Grotere masters kunnen beter worden gedownscaled dan kleine logo's worden opgeschaald.

ICO versus PNG favicon?

Moderne browsers accepteren PNG; .ico bundelt meerdere formaten voor oudere Windows-tabbladen.

Grootte van Apple-Touch-pictogram?

180×180 px voor iOS-snelkoppelingen op het startscherm: gebruik PNG zonder transparantie voor de beste resultaten.

Transparante achtergrond?

Werkt voor PNG tabbladen; iOS-thuispictogrammen kunnen een witte matte kleur krijgen - test op apparaat.

SVG bron?

Converteer SVG eerst naar PNG met een hoge resolutie en genereer vervolgens favicons.