Free solid icons

152 solid, filled icons that match their outline versions exactly. Free, MIT licensed, as SVG or as components for React, Vue and Svelte.

About solid icons

Solid icons are filled shapes with details cut out, ideal for selected states, tab bars and small sizes where outlines get thin.

They’re generated from the same drawing as the outline icons, so switching an icon from outline to solid on selection keeps the exact same silhouette.

Click any icon for its SVG code and downloads, or change styles live in the icon explorer.

Use them in code

npm i @uv-foundry/icons-react

import { HomeIcon } from '@uv-foundry/icons-react';

<HomeIcon variant="solid" />

The same props work in Vue and Svelte. AI coding tools can add these icons for you through the MCP server.

Questions

Do solid icons match the outline icons?
Yes. Both are generated from one drawing, so the solid version of an icon has the same outer shape as its outline version. That makes them ideal for active and inactive states.
Are they free for commercial use?
Yes. Every icon in every style is MIT licensed: free for personal and commercial projects, with no attribution needed in your product.
Are solid icons available with sharp corners?
Yes. Set corner="sharp" for crisp corners, or keep the default rounded.