Hoe maak je een favicon
Een modern favicon is meer dan een plaatje van 16×16. Hier vind je de volledige workflow voor een setup die er in elke browser, elk besturingssysteem en op elk apparaat scherp uitziet.
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
Wat is een favicon?
Een favicon is het kleine icoon dat een browser toont in het tabblad, de bladwijzerbalk en de geschiedenislijst. Op mobiel is het het homescreen-icoon. Op Windows het snelkoppelingsicoon.
Moderne sites leveren meerdere resoluties en formaten zodat elk oppervlak scherp wordt weergegeven.
Bereid je bronafbeelding voor
Begin met een vierkante afbeelding van minimaal 512×512 — het liefst een SVG met een vierkante viewBox. Kleinere bronnen worden wazig bij verkleining.
Vermijd dunne lijnen en kleine tekst. Die verdwijnen op 16×16.
Genereer een multi-size .ico
Bundel 16, 32, 48, 64, 128 en 256 px in één favicon.ico. Browsers kiezen automatisch de juiste maat.
Onze favicon-generator doet dit client-side in minder dan een seconde.
Voeg de HTML-tags toe
Plaats favicon.ico in de root van je site. Voeg vervolgens de SVG, apple-touch-icon en manifest-iconen toe in <head> voor een complete setup.
Controleer in elke browser
Doe een hard refresh (Ctrl+F5) in Chrome, Safari, Firefox en Edge. Check de bladwijzerbalk, het tabblad en een homescreen-installatie.
Veelgestelde vragen
What is a favicon?
A favicon is the small icon shown in browser tabs, bookmarks, and mobile home screens. Modern sites ship multiple sizes and formats for crisp rendering everywhere.
What size should my favicon source image be?
Start from a square image at least 512×512 pixels. SVG with a square viewBox works best for sharp downscaling.
Do I need both favicon.ico and PNG files?
Yes — ship a multi-size favicon.ico for universal fallback plus PNGs (180×180 and 192/512) for Apple, Android, and PWAs.
Where do I put favicon files on my website?
Place favicon.ico in your site root and add <link rel="icon"> tags in <head> for SVG and PNG variants.