Guide

Favicon for Webflow

Webflow stores your favicon in Project Settings and serves it from its CDN on every published page. Upload a square 32×32 PNG or ICO — or a 256×256+ source Webflow will downscale.

Open your project → Project Settings → General → Favicon. Webflow accepts PNG, ICO, or GIF and injects the correct <link rel="icon"> tags on publish.

For retina tabs and iOS home-screen installs, also add apple-touch-icon and PWA icons via custom code in site settings if your plan allows embeds in <head>.

How it works

  1. 1

    Generate a square favicon

    Use our favicon generator — export .ico plus 180×180 apple-touch-icon.

  2. 2

    Project Settings → Favicon

    Upload your PNG or ICO.

  3. 3

    Publish

    Webflow pushes the icon to every page on your custom domain.

Try it now

Generate a Webflow-ready favicon

Favicon Generator

FAQ

What favicon size does Webflow use?+

32×32 is the upload target, but start from 256×256 or 512×512 so downscaling stays sharp.

Why doesn't my Webflow favicon update?+

Publish the site after changing the asset. Browsers cache favicons — hard-refresh or add ?v=2 to the URL in custom code.

Can I use an SVG favicon on Webflow?+

The built-in uploader expects raster formats. Add SVG via custom code in Project Settings → Custom Code → Head if you need vector + dark mode.

Related tools

Related guides

Guides

Explore FetchFavicon

Categories

Converters

Utilities

Guides

Tutorials