Favvy
ファビー
Online favicon generators are fine for quick experiments, but real projects need control over padding, naming, and metadata. Favvy gives you all of that inside Figma. Select your icon, open the plugin, and it will render every required size along with the supporting HTML tags.
Consistency matters
Favvy applies the same rounding, background color, and safe-area settings across the entire set. That keeps your favicon looking sharp on browser tabs, iOS home screens, Android launchers, and Windows tiles.
Outputs you actually need
Beyond the .ico file, Favvy exports PNGs for each platform, maskable icons, and optional SVGs for pinned tabs. It even writes the <link> tags so developers can paste them into the site head.
Generator steps
- Design the icon as a square frame in Figma.
- Run Favvy, review the previews, and adjust padding or background options.
- Download the zip and drop the provided code snippet into your site repo.
It’s everything you need from a favicon generator—without leaving the file you’re already designing.
Keep stakeholders aligned
Share Favvy’s preview grid with brand or product managers so they can sign off on how the icon appears on different devices. Once approved, export the package and log the decision for future refreshes.
Maintenance tip
When your brand updates colors or logos, rerun Favvy and commit the new package to your repo with a clear message. Engineers know exactly what changed, and your sites stay consistent across releases.