Icon Monks
An open source icon family, a product of Design Monks: 70,000+ icons in 6 weights (thin, light, regular, bold, fill,
duotone), drawn on a 256-unit grid and generated into native packages for every major platform.
Icons are grouped into 31 categories: animals, arrows, brands, business, charts, commerce, communication, design, development, devices, editor, education, emoji, files, food, health, home, interface, letters & numbers, maps, media, nature, objects, people, science, security, sports, symbols, time, transport, weather.
Browse, search and copy icons at https://www.iconmonks.co/ (built from docs/template.html into index.html).
import { House, Heart } from '@icon-monks/react';
<House size={24} /> <Heart weight="fill" color="crimson" />
How it works
Each icon is one source file in icons/ drawn with plain SVG shapes and a 16-unit stroke. Shapes are grouped by
role, which tells the build how each weight is made:
| Role | Outline weights | Fill weight | Duotone |
|---|
line | stroked | merged in | stroked |
detail | stroked | cut out | stroked |
area | | merged in | 20% tint |
hole | | cut out | |
dot / dotcut | solid dot | merged in / cut out | solid dot |
slash | stroked, with a gap cut around it | stroked, with a gap | stroked, with a gap |
badge | standard corner mark, with a round clearing cut around it | stroked; closed marks filled | stroked, with a clearing |
scripts/build.py outlines strokes at 8 / 12 / 16 / 24 units with Skia path ops, so every output is a single flat
path that renders identically in browsers, fonts, Android and Xcode. scripts/packages.py turns that into each package.
pip install skia-pathops fonttools brotli
npm install
npm run build # svg/, packages/*, index.html
npm test # package tests (React SSR, Vue SSR, core)
node tests/browser.mjs # renders the web component, fonts and sprites in Chromium
Contributing an icon
Read STYLE.md first. It has the drawing rules every new icon follows.
- Copy a similar file in
icons/ and draw inside the 32–224 live area on the 256 grid.
- Put strokes that should become knock-outs in the fill weight in the
detail group, and the shape to fill in area.
- Add
data-category and a few data-tags for search, then run npm run lint.
- Run
npm run build and check the result in index.html.
Font codepoints are append-only (codepoints.json), so existing glyphs never move.
Releasing
- Bump
version in package.json, add a changelog entry in scripts/packages.py, run npm run build, open a PR
and merge it. Merging to main also deploys the website.
- Tag that commit on
main: gh release create vX.Y.Z --target main --title "Icon Monks vX.Y.Z" (creates the tag and
the release page), or git tag vX.Y.Z && git push origin vX.Y.Z.
- The tag runs
.github/workflows/release.yml. It stops unless the tag is on main and matches package.json, then
publishes the npm packages (trusted publishing, no token) and the Flutter package (pub.dev automated publishing).
Swift Package Manager and JitPack build straight from the tag.
License
MIT © Design Monks. Icon Monks is a product of Design Monks. The icon designs are original; the project is inspired by the approach of
Phosphor Icons, but shares no artwork with it.
Icons in the Brands category show logos and products that are trademarks of their owners. The MIT license covers our
drawings, not the trademarks: using a brand's logo is still subject to that brand's own guidelines.
