What Is a Favicon?
A favicon is the small icon that shows next to your site’s name in a browser tab or in bookmark lists. Setting a favicon helps people quickly recognize your site, both in search results and when they have multiple tabs open.
With Studio.Design, you can set a favicon for your entire site, or customize it for individual pages.
Note : Favicons may not update immediately on social media or in search results. Their caches refresh over time, so changes could take a while to appear.
Recommended Image Size
For best results, use a square image (1:1 aspect ratio) with a recommended size of 32x32px in PNG format. Google, however, recommends using 48x48px or larger images so favicons look crisp on all browsers and devices. SVG files are supported, but be sure to follow the same dimensions.
Important Note About Updates
If you change your favicon after your site has already been published, it may take some time for those changes to show up on social media and in search engines. Social networks and search engines cache your old favicon, and only update their cache occasionally.
If you need more details about it, see:
Steps to Set Your Favicon
Open the [Design Editor].
Open the [Pages Panel].
At the lower left of your screen, click the [Pages] icon to open the panel.
3. Open the [Site Settings] Panel.
To set a favicon for your entire site, open [Site Settings].
To set a favicon for a specific page, open that page’s [Page Settings] panel.
Note:
If you set a favicon for a specific page using [Page Settings], that page will not display the site-wide favicon.
Favicons cannot be set for [Modals].
Click the favicon box, and upload your image.
To remove a favicon, hover over the uploaded image and click the “X” button in the top-right corner.
Update your site.
If you set or change a favicon after publishing the site, make sure to use [Update Site] so your changes go live.