Heritage collection
Free SVG icons.
Free icon packs were one of the most-linked corners of the original CSS Crème. Here's the
modern take: a clean, consistent set of inline SVG line icons. Click any icon to copy its markup — they
inherit color from currentColor and scale with width, so styling is pure CSS.
Tip: click an icon to copy its SVG.
How to use these icons
Inline SVG is the most flexible way to ship icons. Because the markup lives in your HTML, it loads with
the page (no extra request), and every stroke responds to CSS. Set stroke="currentColor" and
the icon takes the text color of its container — hover states and dark mode come free.
Size with width and height, adjust weight with stroke-width, and
animate with transition like any other element. Need a recolor on hover? Wrap the icon in a
link and let currentColor do the work:
a { color: #6c5d4e; }
a:hover { color: #4F46E5; } /* the icon follows */Building a UI around them? Start from a template and reach for the CSS tools when you need gradients or depth.