Favvy
ファビー
Favicon requests always show up at the last minute. Favvy keeps them from derailing a launch by automating the entire workflow: export every required size, generate the HTML/JSON boilerplate, and bundle the files into a download you can hand to engineering.
Start with a single design
Design your icon once on the canvas. Favvy reads that frame and renders all of the variants—classic desktop favicons, touch icons, pinned tabs, mask icons, and more. You can preview each output before exporting.
Automation beats manual labor
Favvy remembers your color settings, backgrounds, and naming conventions. When another project needs favicons, run the preset again and you’ll get the same polished results without hunting down old Photoshop actions.
Workflow checklist
- Create the base icon in Figma (usually 1024×1024 or larger).
- Run Favvy, choose the package that matches your needs (web, PWA, Windows tiles, etc.), and review the previews.
- Download the zip with icons,
manifest.json, and HTML tags ready to paste into your site.
That’s it. Favicon automation finally feels like part of the design system instead of an afterthought.
Keep specs centralized
Document which Favvy preset each product surface uses and store it next to your brand guidelines. When teammates spin up a new microsite, they know exactly which preset to run. You get consistent results without answering the same questions repeatedly.
Pro tip
Pair Favvy with automation tools (Git hooks, CI) to drop updated favicon packages into your repo whenever the source icon changes. Engineering gets notified automatically, and you never miss a release window.