Favicon Forge troubleshooting

The problems people hit with favicons are almost always about the icon, not the file format. Here is what to check.

The 16 px preview looks blurry

Every icon does at 16 px; that is 256 pixels in total. The plugin renders your layer at up to 1024 px and halves it step by step, which is the sharpest downsampling a browser can do, but it cannot invent detail. Simplify the mark: bold shapes, no thin strokes, no text, strong contrast. The preview row shows exactly what users will get, so iterate until it reads.

The icon has a background I did not want

Figma exports what the layer contains. A frame with a white fill produces a white square. Select the icon's own layers, or remove the frame fill, for a transparent background. The browser-tab mockup shows the icon over light and dark tab chrome so you can see whether transparency works.

Android crops my icon in a circle

That is the maskable icon. Android masks it into circles, squircles or rounded squares and expects the mark to sit inside the central 80 percent. The Maskable padding setting adds that safe zone; 15 percent suits most marks, 20 percent if yours reaches the edges. The maskable background color fills the padding.

The dark variant used the wrong layer

With two layers selected, the first selected is the light icon and the second is the dark one. The plugin names the dark layer under the selection line, so check it before generating. If they are swapped, click away, then select the light icon first and shift-click the dark one.

favicon.svg looks different from the PNGs

The SVG is Figma's own SVG export of the layer. Effects such as shadows and blurs, image fills and some blend modes do not translate to SVG and may be rasterised or dropped. Keep the SVG icon to flat vector shapes, or rely on the PNG and ICO files and remove the SVG link from the snippet.

The theme color is wrong

The plugin picks the first visible solid fill it finds on the layer or its children. For a multi-color mark that may not be the brand color. Edit the Theme color field before generating; your edit sticks until you select a different layer.

Nothing downloads

The ZIP goes to your browser's or the Figma desktop app's downloads folder. If a download is blocked, check the status bar at the bottom of the plugin for an error, and try again with a smaller selection: a very large source layer can exceed the canvas size limit.

Browsers still show the old favicon

Favicons are cached hard. Hard-reload the page, or open the favicon URL directly and reload it, or change the file name in the snippet once. Some browsers only refresh favicons when the tab is reopened.

Can I use it on a FigJam board?

Yes. Favicon Forge works in Figma and FigJam.

Was this page helpful?