How to Change the Favicon in Webflow
Learn how to change your Webflow site’s favicon: recommended formats, Project Settings, and publishing.
In this tutorial, Sandro, cofounder of Gemeos Webflow agency, shows you how to change your Webflow site’s favicon.
1. Prepare your favicon
Create your favicon as a PNG at least 32x32px. Recommended tools: favicon.io to generate a favicon from text, an image, or an emoji. Export it as PNG or ICO.
2. Add the favicon in Project Settings
In the Designer, go to Project Settings > General > Favicon. Click the favicon field and upload your image. Webflow shows a preview. Save your settings.
3. Publish to see the change
The favicon doesn’t show in Webflow preview: you need to publish the site to see it in the browser tab. Remember to clear your browser cache (Ctrl+Shift+R) if the old favicon sticks around.
Conclusion
You can set up a favicon in one minute in Project Settings. Also think about the Open Graph image for social sharing: add an OG image in Webflow.
Good to know
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
Lorem ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
