After clicking the Export Favicons button, you'll see a confirmation screen letting you know that your favicons are ready to download. To download the .zip
file from Figma to your computer, you can click the Download favicons .zip file button in the Favvy plugin.
What's in the exported Favvy .zip file?
Depending on the export formats you select, the full list of possible files included in the exported .zip
file from Favvy are listed below:
android-chrome-192x192.png
android-chrome-512x512.png
apple-touch-icon.png
favicon.ico
favicon.svg
head.html
site.webmanifest
Other Favvy export options
Before exporting your favicons, you can optionally specify your website name and a theme colour.
Website Name
Populating the Website Name input field with your website name will automatically add it to the name
and short_name
fields in the exported site.webmanifest
file.
The site.webmanifest
file is used in progressive web apps (PWA), and if you're interested, you can read more about the web app manifest on the MDN web docs.
Theme Colour
Populating the Theme Colour input field with a HEX colour code (or using the color picker) will automatically add it to the browserconfig.xml file exported by Favvy, the theme-color
fields, and also use it for any iOS splash screen backgrounds, in the generated code for your <head></head>
tag.
Sizes & Platforms
By default, Favvy exports a favicon package that covers all browser and devices, however, you can optionally turn off support for iOS (icons and/or splash screen support) and/or Android if you don't need them by toggling the switches in the Favvy plugin.