Figma Plugin
Browse, preview, and insert the complete Solar Icons collection in Figma.
The Solar Icons Figma plugin gives you the same standardized SVGs that ship in the Solar Icons packages. Search the collection, preview each style, and insert icons into your current page without leaving Figma.
Install Solar Icons from Figma Community
Browse the collection
Search by icon name, category, and related terms. Filter the 1,246 icons by any of the six styles:
- Linear
- Broken
- Line Duotone
- Outline
- Bold
- Bold Duotone
Insert icons
Choose Insert on click to add an icon as soon as you select it.
Choose Select first when you want to select several icons, then add them together. The plugin places the selected icons around the center of your viewport and groups the operation into one undo step.
Set geometry before insertion
Use the Geometry controls to set icon size from 8 to 256 px. Drag each value horizontally, use the arrow keys, or double-click to restore its default value.
Linear, Broken, and Line Duotone icons also support a stroke width from 0.5 to 4 px. The grid updates its preview while you adjust the value. Inserted icons retain editable Figma strokes.
Outline, Bold, and Bold Duotone use filled geometry, so the stroke width setting does not apply to them.
Preferences and local data
Choose the Figma system theme or force the plugin into light or dark mode. Reset settings restores the insertion mode, theme, icon size, and stroke width to their initial values.
The plugin embeds its icon library and makes no network requests. It stores only these preferences in Figma local storage. It does not collect, transmit, or analyze your document content.
Design and code use the same assets
The SVGs inserted by the plugin match the maintained Solar Icons distribution used by the React, Vue, Svelte, Solid, Angular, Nuxt, React Native, JavaScript, and Static packages.
How is this guide?
Last updated on