Webflow favicon toevoegen: favicon en webclip instellen

Favicon en webclip toevoegen in Webflow: waar de Icons-instelling staat, welke formaten Webflow maakt, hoe je publiceert en wat te doen als hij niet verandert.

Veelgestelde vragen

Welk formaat moet een Webflow-favicon hebben?

In het helpcentrum van Webflow staat een favicon van 32x32 en een webclip van 256x256. In de huidige werkwijze upload je één vierkante afbeelding en maakt Webflow de andere formaten voor je. Begin dus met een vierkant bestand van minimaal 256x256 pixels dat ook verkleind nog goed leesbaar blijft.

Waar upload ik een favicon in Webflow?

Open Site settings, ga naar General en zoek het onderdeel Icons. Upload je vierkante afbeelding, kies welke iconen je wilt bijwerken, pas de wijziging toe en publiceer daarna de site. Oudere handleidingen noemen dit Project settings, maar het is dezelfde plek.

Wat is een webclip in Webflow?

Een webclip is het grotere icoon dat wordt gebruikt wanneer iemand je site opslaat op het startscherm van een telefoon of als vergelijkbare snelkoppeling. Webflow noemt hiervoor 256x256 pixels. Het staat los van het kleine icoon in het browsertabblad.

Waarom zie ik mijn Webflow-favicon niet nadat ik hem heb geüpload?

De meest voorkomende oorzaak is dat de site na het uploaden niet is gepubliceerd, want iconen veranderen alleen op de gepubliceerde site. Op de tweede plaats komt browsercaching. Publiceer en controleer het daarna in een privévenster of een andere browser voordat je denkt dat de upload is mislukt.

Ondersteunt Webflow SVG- of dark mode-favicons?

Volgens de updatenotities van Webflow kun je PNG, JPG, GIF, ICO of SVG uploaden, en het helpartikel noemt een optioneel tabbladicoon voor dark mode. Webflow zet SVG-uploads bovendien om naar PNG voor compatibiliteit tussen browsers, dus test het resultaat in de browsers die voor jou belangrijk zijn.

Hoe lang duurt het voordat Google mijn nieuwe Webflow-favicon toont?

Er is geen vaste termijn. Google bepaalt zelf wanneer het opnieuw crawlt en het icoon in de zoekresultaten vernieuwt, en volgens meldingen uit de community duurt dat dagen tot weken of langer. Wat jij in de hand hebt, is dat het icoon live staat op je gepubliceerde site.

Kort antwoord: Open in Webflow Site settings > General > Icons, upload één vierkante afbeelding, kies welke iconen je wilt bijwerken (favicon voor lichte modus, optionele favicon voor dark mode, webclip), pas de wijziging toe en publiceer de site. Webflow noemt een favicon van 32x32 en een webclip van 256x256, en maakt de overige formaten zelf op basis van je upload. Op de live site verandert niets totdat je publiceert. (Gecontroleerd in november 2026 aan de hand van het helpcentrum en de updatenotities van Webflow.)

Wat Webflow vraagt

Oudere tutorials beschrijven twee aparte uploadvelden: één voor een favicon van 32x32 en één voor een webclip van 256x256. In het huidige helpartikel van Webflow is het eenvoudiger: je uploadt één vierkante afbeelding en Webflow regelt de formaten. Dit is waar elk icoon voor dient.

Icoon	Formaat volgens Webflow	Waar je het ziet
Favicon (licht)	32x32	Browsertabbladen en bladwijzers
Favicon (dark mode, optioneel)	32x32	Browsertabbladen wanneer de browser in dark mode staat
Webclip	256x256	Snelkoppelingen op het startscherm en vergelijkbare opgeslagen links
Automatisch gegenereerde extra's	48x48 favicon, 180x180 en 192x192 touch-iconen	Door Webflow gemaakt op basis van je upload

Toegestane uploadformaten volgens de updatenotities van Webflow: PNG, JPG, GIF, ICO en SVG. SVG-uploads worden omgezet naar PNG voor compatibiliteit tussen browsers.

Wil je meer weten over formaten per platform? Lees dan onze favicon sizes guide.

Bereid je afbeelding eerst voor

Een favicon wordt in een tabblad op ongeveer 16 tot 32 pixels breed weergegeven, dus het bronbestand is belangrijker dan de instellingen.

Begin vierkant. Exporteer een vierkant canvas van 256x256 of groter, zodat de webclip niet hoeft te worden opgeschaald.
Houd het simpel. Gebruik een beeldmerk of één letter, geen volledig woordmerk. Fijne details veranderen op tabbladformaat in een vlek.
Let op de achtergrond. Een transparante PNG ziet er goed uit op lichte tabbladen, maar kan op donkere verdwijnen. Gebruik je een dark mode-favicon, maak dan een versie met een licht merk.
Gebruik een neutrale bestandsnaam. Namen van geüploade bestanden kunnen in je gepubliceerde HTML terechtkomen, dus vermijd "definitief_v3_ECHT.png".

Zo voeg je een favicon en webclip toe in Webflow

Open je project in de Webflow Designer of het dashboard en ga naar Site settings.
Kies het tabblad General en scrol naar Icons.
Klik op Upload icon en kies je vierkante afbeelding.
Kies welke iconen de afbeelding moet bijwerken: de favicon, de optionele favicon voor dark mode en de webclip.
Wil je een ander icoon voor dark mode, voeg dat dan toe in het dark mode-vak. Dit is optioneel.
Klik op Apply. De bewoording in de interface kan licht veranderen als Webflow iets aanpast, dus volg de labels die je ziet.
Publiceer de site naar je domeinen. Alleen opslaan zet de iconen niet live.
Open de live site in een privévenster en controleer het tabblad.

Kopieerbare checklist

`` [ ] Vierkante bronafbeelding, 256x256 of groter [ ] Merk is simpel genoeg om op tabbladformaat leesbaar te zijn [ ] Getest op een lichte en een donkere browserweergave [ ] Geüpload onder Site settings > General > Icons [ ] Wijziging toegepast (Apply) [ ] Gepubliceerd naar het live domein (niet alleen het webflow.io-stagingdomein) [ ] Gecontroleerd in een privévenster [ ] Hard refresh gedaan of cache gewist als het oude icoon blijft staan ``

Problemen oplossen

De favicon toont nog het oude icoon of het Webflow-logo

Doorloop deze stappen op volgorde:

Publiceer opnieuw. Iconen gaan alleen live met een publicatie. Publiceer je naar meerdere domeinen, neem ze dan allemaal mee.
Test in een privévenster. Browsers cachen favicons hardnekkig, en in een gewoon tabblad kan het oude icoon lang blijven staan.
Ververs hard de pagina, of sluit de browser en open hem opnieuw.
Open het bestand rechtstreeks. Controleer of de icoon-URL in de paginabron in een eigen tabblad laadt.

De upload wordt geweigerd of ziet er vervormd uit

In sommige communitythreads wordt melding gemaakt van foutmeldingen over het formaat bij oudere werkwijzen die exacte afmetingen vereisten. Loop je hier tegenaan, gebruik dan een vierkante afbeelding en probeer het opnieuw. Houdt het probleem aan, probeer dan een andere browser of een privévenster. Dit advies komt uit forummeldingen en niet uit de documentatie van Webflow, dus beschouw het als noodoplossing.

Google toont het verkeerde icoon in de zoekresultaten

Het icoon in de zoekresultaten wordt bepaald door Google, niet door Webflow. In communitythreads wordt beschreven dat updates dagen, weken of langer duren. Controleer of het icoon op je live site laadt en wacht dan af. Een stabiel, vierkant icoon op een vaste URL helpt.

Het icoon ziet er wazig uit in tabbladen

Dit komt meestal doordat het bronbestand te veel details heeft of van meet af aan een lage resolutie had. Teken een eenvoudiger merk op een groter formaat en upload het opnieuw.

Welk bestandsformaat moet je uploaden?

Formaat	Goed voor	Let op
PNG	De meeste sites; betrouwbaar en ondersteunt transparantie	Heeft voldoende resolutie nodig voor de webclip
SVG	Strak bronmateriaal	Webflow zet het om naar PNG, dus bekijk het resultaat vooraf
ICO	Verouderde werkwijzen	Vaak overbodig als Webflow de formaten zelf maakt
JPG	Zelden een goede keuze	Geen transparantie; laat een achtergrondvlak achter

Als je het niet zeker weet, is een vierkante PNG van 256x256 of groter de veiligste keuze.

Waar dit past in de voorbereiding van je lancering

Een favicon is een klein onderdeel van een lanceringschecklist, naast titels, beschrijvingen en afbeeldingen voor social media. Als je platforms vergelijkt voordat je kiest, bespreken onze pagina's Webflow comparison en Webflow alternatives de afwegingen, en de algemene gids voor het wijzigen van een favicon is handig als je sites op meer dan één platform beheert.

Wil je liever starten met een kant-en-klare indeling? Met het gratis abonnement van We.Inc publiceer je tot drie sites vanuit kant-en-klare templates; de AI-builder die op basis van een prompt een site opzet, begint bij het Starter-abonnement voor $20 per maand. Je kunt je hier aanmelden.

Gratis beginnen · Geen creditcard nodig

Umair Ali Sadaqat

Oprichter van We.Inc

Umair is de oprichter van We.Inc. Hij schrijft over websites bouwen met AI, bureaus en de bedrijfsvoering van een webstudio.

Klaar om iets moois te bouwen?

Sluit je aan bij 15,000+ bedrijven die We.Inc gebruiken om te lanceren, te groeien en te automatiseren, allemaal vanuit één platform.