Favicon.kz

Export a clean SVG from Figma

A good favicon pipeline starts with a clean SVG. Some exports contain odd transforms or a wrong viewBox, causing empty/shifted results.

Export checklist

  • Convert text to outlines (or ensure fonts are not external).
  • Avoid placed raster images inside SVG (or embed them).
  • Keep artwork centered in a square frame.
  • Minimize unnecessary groups and masks when possible.

In Figma (quick approach)

  1. Place your logo in a square frame (e.g., 512×512).
  2. Center the logo and add comfortable padding.
  3. Export → SVG (prefer “plain” style, if available).
  4. Upload the SVG and use Crop → Fit to verify bounds.
Note
If the uploaded SVG looks empty, it’s usually a viewBox/bounds problem. Crop → Fit fixes many cases automatically.
Try your SVG now
Upload and fix bounds with one click (Fit).

FAQ

Should I export with “Include outline stroke”?
If strokes are important, yes — otherwise they may scale oddly. Test in the preview.
What about Adobe Express exports?
Some exports have transformed geometry and wrong bounds. The Crop/Fit step helps.