Favicons in Webflow

What is a Favicon?

No items found.
Overview
What is a Favicon?
100
Where Do Favicons Appear?
101
Favicons in Google Search Results
102
Webflow & Favicons
What Favicons Does Webflow Support?
200
Creating Favicons
Creating a Favicon
300
Resources
References
600
Troubleshooting Favicons
601
What Favicons Does Google See?
601
Advanced
Technical Notes
Int
800
Favicon formats
801
Advanced Favicons use
Adv
810
Expert Favicons use
Expert
820
No items found.
A favicon ( /ˈfæv.ɪˌkɒn/; short for favorite icon ), also known as a shortcut icon, website icon, tab icon, URL icon, or bookmark icon, is a file containing one or more small icons,[1] associated with a particular website or web page.
- Wikipedia

How it works

Favicons are described in HTML tags in the HEAD area of your webpages as <link> tags that generally look like this;

Favicon variations

Webflow support

In Webflow, favicons are specified in your Site settings, on the General tab.

As of Nov-2022, Webflow supports two sizes;

  • 32x32
  • 256x256

And file formats of ICO, PNG, GIF, or JPG.

When you upload these, here's an example of what Webflow generates;

<link href="https://assets.website-files.com/59aa30d4b0f23d0001bac49f/59c1d70a11c98c000172ca8f_favicon-32.png" rel="shortcut icon" type="image/x-icon"/>
<link href="https://assets.website-files.com/59aa30d4b0f23d0001bac49f/59c1d70f7333f20001b08711_favidon-256.png" rel="apple-touch-icon"/>

Table of Contents
Did we just make your life better?
Passion drives our long hours and late nights supporting the Webflow community. Click the button to show your love.