Files
Folder, open folder, file types, new file, search in files.
Use case
These are the icons a code editor or build dashboard needs.
Icon jobs
Each card is one group of icons to search for in the browser.
Folder, open folder, file types, new file, search in files.
Branch, merge, commit, pull request, conflict.
Run, stop, breakpoint, step over, terminal.
Build, test passed, test failed, skipped, coverage.
Database, table, API, request, webhook.
Package, version, deploy, rollback, environment.
The screen
This is the screen we planned these icons for.
A file tree with folders and file types runs down the left. Run, debug, branch and sync sit along the top. A terminal and a status bar with build, test and deploy states sit at the bottom.
Every icon here is tiny, and you see it hundreds of times a day. A branch and a merge must never be confused. Neither should a passed test and a skipped one.
FAQ
Not yet. An npm package and React, Vue and Svelte components are coming soon. Today you can copy or download any approved icon as SVG from the browser and add it to your project. The docs page marks each channel as coming soon until it ships.
No. Brand and language logos are not in the library because of trademark rules. File types are plain document shapes with a clear mark, so they stay easy to tell apart in a file tree. Add a text label where the exact language matters.
Cover files, folders, git actions, branches, terminals, search, settings, run and debug controls, and CI status. Add database and API icons if your tool shows them. Search the browser for each word, then keep one style and size across the interface.
A file, a folder, search, source control, run and debug, extensions and settings are the usual set. Use Regular for idle items and Solid for the active one. Draw at 24 px with a label or tooltip, since many sidebar icons look alike.
Use a check for passed, a cross for failed, a clock for queued and a spinner or arrow for running. Add text beside each so status never depends on colour alone. Keep the shapes different enough to tell apart at 16 px.
Yes, with the free styles. MIT lets you include Regular Rounded, Regular Sharp and Solid in your project and share it. Keep the copyright notice and licence text with the icon files. Leave out Pro styles, since their terms are not out yet.
Next step
See every approved icon for code, git, terminals, APIs and databases.