Hey! Free yourself to discover the 'magic' trick that will propel your business on the Web

Favicon and Webclip with Figma for Webflow

Web Design,Freelance,Business
add favicon and webclip on webflow
Photo by Dids from Pexels

On which software do you create favicons and webclips for the websites you manage? Actually, there are many software and online platforms, but I personally use Figma. The real question is this: "how to add a favicon and webclip on Webflow?"

Why add a favicon and webclip on webflow?

You absolutely have to change the favicon and webclip of your site if you have based it on existing site templates (as we are used to do with Webflow; by the way, this is one of the things that makes Webflow great, not to mention the fact that thanks to it, you can create a site without code). Let's assume that you have been inspired by the pre-existing templates in the showcase. You probably copied the favicon and webclip from the template itself. However, these elements are not adapted to your site or your visual identity.

By the way, I remind you that by definition, the favicon is nothing else than the icon displayed in the favorites bar of a web browser. It is mainly used by Internet users, because it helps them to quickly identify your site. We can therefore say that it must be part of the graphic charter of a company.

The same goes for the webclip (which differs only in size).

There is a YouTube video in which I describe this at the bottom of the article. Support me by subscribing to the YouTube channel "Happy Desk Design".

add favicon and webclip on webflow
Photo by Chandrakanth Elancheran from Pexels

Prepare your favicon and webclip

To add a favicon and webclip on Webflow, you just have to go on the software you have chosen (me, on Figma), and you create your own favicon and webclip. You design them the way you want. In most cases, we use the company logos. But as far as the favicon in particular is concerned, I doubt it's a good idea (in case the logo is not visible enough as a favicon).

So there are those who opt for initials. For HappyDesk for example, if the logo was not visible enough, I might have used the initial H.

add favicon and webclip on webflow
Photo by Engin Akyurt from Pexels

Anyway, I let you see how I did it, in my video.

Before adding a favicon and webclip on Webflow, note these dimensions:

  • Favicon 32 x 32 px
  • Webclip 256 x 256 px

Once this is done, all that remains is to export these two images (preferably in PNG format).

Inserting favicon and webclip on Webflow

Then go to the parameter, and then add a favicon and webclip in the appropriate fields. To validate all these modifications, it only remains to publish the site. And presto, your favicon and webclip are up to date.

add favicon and webclip on webflow
Photo by Kaboompics .com from Pexels

Now that you know the importance of favicons and webclips, and that you know how to easily modify those of sites designed with Webflow, wouldn't you be tempted to register on Webflow (if you haven't already)? If you're already there, it's high time to update all your sites :)

YouTube: How to add Favicon and Webclip on Webflow

Come back to this page whenever you want. Did you find any ideas that I forgot? If so, what are they? Leave a comment below or send an email to hello@happydesk.be
Kevin Palombo, Manager of Happydesk
Make the counter explode to reach 1M subscribers together (Pssst...it's in real time)
Together it's more fun

1 Million with you.

It's really amazing how our YouTube community can be a true source of inspiration for all of us. So if you're looking for a community that will give you a boost to reach your personal and business goals, you've come to the right place!
Certified 100%
ULTRA enriching and hair-raising!
Receive a mountain of gifts


We all keep our childish soul, so we like to receive lots of gifts, a montaaaagne of gifts, a galaxiiiiiie of gifts, a.... YOUHOU, are you still with us? Since you also love gifts, receive in your mailbox energy, strategies and tools (each one more grandiose than the other) that will generate results in your business.


Clearsome time for Thursday because an intergalactic surprise awaits you.
Propel your life & your business in 30 days!


The only one, the only one, the real one where all ideas can germinate, develop and succeed. Each phase of business development is thought out down to the smallest detail (even the smallest) to accompany you in your project.

Foundations, development, support, mutual aid, coaching, website, web tools and even cookies. Joining the Happy.webacademy is to be part of this ecosystem without risk, just jump in and let yourself be guided.
AI enabled to accelerate your transformation 🤖
12 Up-to-date modules
We give you crazy training with action plans, regular updates, access for life, and 24/7 support, 365 days a year. Everything you need (and more) to make your life, your business and your skills shine.
Your thruster
We make sure that you are always on top of your questions and that you can grow with a community that has the same dreams as you, and that you can meet super inspiring people.
Never again alone
Your Website!
Who better than Web experts to create a turnkey Website and sell your offers quickly without having to break your head with the technique. No more sleepless nights tearing your hair out, we've got you covered to accelerate your online growth!
We will create you
an Asteroid
12 months Free
We answer all your business, mindset and nugget questions. It's also the best way to get your daily dose of motivation, anything is possible!
Don't forget to bring
Strategy 3.0
The Web and e-commerce are evolving at an incredible speed, and if you don't keep up, you'll lose money. That's why we're going to share with you all our latest tips, discoveries and innovations (automation, artificial intelligence,...) so that you and your business stay on top!
2 Business Coaches
Kevin & Sophie, 2 coaches in the field for 10 years who will be there to motivate you, boost your mindset, and much more! Throughout your entrepreneurial adventure on the Web & in e-commerce, we will support you to validate opportunities or help you optimize your performance. You will NEVER be alone again!
Continuous monitoring
It's sometimes hard to take a step back from your work when you're just starting out (even after), which is why we'll always be there to review your work privately BEFORE you spend any money on advertising or influencers.
Creating a profitable business requires financial optimization. That's why we'll give you the tips we use so you can learn how to invest the money you'll earn in the long run to create wealth.