What file format do I get?

Each icon downloads as a standalone .svg file, and the detail panel can also export a PNG.

Can I change the color before downloading?

Yes. Open the icon, choose a color, size and stroke weight, and the download uses those settings.

Where should I save downloaded icons?

Keep them in your project in folders by category, with the original lowercase file names.

Home / Guides / How to Download SVG Icons

How to Download SVG Icons

Downloading an icon gives you a file you can version-control and reuse. Save single icons as files and keep a tidy project folder.

From the grid

Use the download button on a card for an instant .svg file.

From the detail panel

Open an icon to adjust size and colors first, then download SVG or PNG.

Organizing files

Keep icons in folders named by category and use the file name as the icon name.

assets/icons/
  arrows/
  interface/

File naming

Keep the downloaded name, which already describes the icon (for example camera-plus.svg). Consistent lowercase names with hyphens work on every operating system and make icons easy to search in a code editor.

When to export a PNG

Use PNG for email templates, slide decks and social posts where SVG support is unreliable. Export at twice the display size so the image stays sharp on high-density screens.

Keeping icons under version control

Commit the SVG files to your repository. Because SVG is plain text, changes show up clearly in diffs and teammates can review them like any other source file.

Quick checklist

Files are saved in category folders
Names are lowercase with hyphens
PNG exports are at 2x display size
The license page was reviewed before publishing
Unused icons are removed from the project

Common mistakes to avoid

Renaming files inconsistently, saving every icon into one flat folder that becomes impossible to search, and exporting small PNGs that look blurry on high-density screens. Also avoid downloading icons without noting where they came from.

Conclusion

Downloading an icon is simple, but the habits around it matter: clear file names, tidy category folders, PNGs only where needed and a record of where each file came from. Do that and your icon folder stays easy to maintain as the project grows.

Frequently asked questions

Next steps

Try these ideas with real icons in the icon browser, or review the categories. See the license page for usage terms.