coolicons v5 is here

Every icon for your next project. Free, wherever you build.

1,220 icons for React, Vue, shadcn/ui and Figma, copied from the picker or added by your AI agent.

Five styles. Drawn from the same shapes.

Line for calm interfaces, Fill for active states, Bulk for more weight. Switch any time.

Line. 2 px strokes. The quiet default for most interfaces.

Three corners. Sharp, regular or round.

Match the icons to your interface. A rounded app gets round icons, a sharp dashboard gets sharp ones.

Make it yours. Then copy what you see.

Set style and corners, then size and stroke. The preview is the file you get.

32 px, 2 px stroke

Pixel perfect. Four rules behind every icon.

Edges stay crisp at 24 px, and each icon looks like part of the same set.

24 by 24 grid24 × 24
Each icon is drawn on the same canvas, with 2 px of padding around it.
One stroke2 px
2 px with round caps and joins. Scales cleanly from 16 to 48 px.
Whole pixelsx.0 y.0
Lines and corners start on whole pixels, so edges stay crisp at 24 px.
Clear spacing≥ 2 px
Separate strokes stay at least 2 px apart, so small details never blur together.

Ready for your code. Packages for your stack.

Add the package for your framework and import only the icons you use. Your bundle stays small.

React docs

$ pnpm add @coolicons/react

App.tsx

import { House } from "@coolicons/react";
import { Bell } from "@coolicons/react/fill/round";

<House size={20} />
<Bell size={20} title="Notifications" />