Born out of a need for an icon set that would align well in vertical and horizontal lists. Great for navigation, buttons, headings or lists. If you are obsessed with things lining up, then this icon set is perfect for you!
v2
Version 2 drops the icon font and PNG/JPG output in favour of SVG only: an SVG sprite, individual SVG files, and a CSS file for background-image classes. v1 (icon font, PNG, JPG) is still published on npm as 16pxls@1 if you need it.
Documentation
Icon names are listed in dist/docs/assets/json/iconList.json.
Installation
npm install 16pxls or yarn add 16pxls
Usage
CSS background classes
<link rel="stylesheet" href="node_modules/16pxls/dist/css/16pxls.css"> or @import '16pxls/css';
<span class="icon icon-Skull"></span>SVG sprite
<svg class="icon"><use href="node_modules/16pxls/dist/sprite.svg#icon-Skull"></use></svg>Individual SVGs
Import a single icon directly, e.g. with a bundler: import skull from '16pxls/svg/Skull.svg'.
Building from source
npm install, then npm run build. Reads raw SVGs from src/svg, writes optimised SVGs, the sprite, the CSS and the icon list to dist/.
Included File Types
- .SVG
- .CSS
- .FIG (for Figma)