Genericons Neue
Genericons Neue are generic looking icons, suitable for a blog or simple website.
Genericons Neue is a new version of Genericons, with a refreshed look. Logos have been removed, however, so if you're upgrading from Genericons you can't use Genericons Neue as a drop-in replacement. If you used only icons, you probably can, but be sure to test thoroughly. For a great set logos, please consider Social Logos.
Usage
The icon set comes in three versions:
- Minimized SVG files in the
svg-mindirectory - An SVG sprite (not compatible with IE) in the
svg-spritedirectory - An icon font (shows up blurry in Chrome) in the
icon-fontdirectory - For Node projects, there's an npm module
Genericons Neue can be used in WordPress themes or other web related projects. CSSTricks has great instructions on how to use SVG files, and how to use icon fonts. You can pick the one that works best for your project.
Icon Set Style Guidelines
- 16pt base grid
- mostly straight angles, with occasional rounded edges for style
- flat, bidimensional look
- 2pt lines generally
- 1.5pt lines when necessary for clarity, be sure to have one edge on the pixelgrid
- 2pt corner radius
- no logos
- mostly solid icons
These are not rules, they are guidelines that can be broken with the proper reason.
Building Your Own
Genericons Neue is built semi-automatically. SVG source files in the svg directory are processed and converted into minimized SVGs, a sprite, and an icon font using grunt. To build your own version of Genericons Neue, follow these instructions:
brew install ttfautohint fontforge --with-python
npm install
npm run build
Pixel Grid
Genericons Neue has been designed for a 16px grid. That means icons will look their best at that size, or 2x multiples thereof, such as 32px or 64px. Icons will also look reasonably crisp at in-between 1.5x multiples such as 24px or 48px, but edges will look blurry at arbitrary multiples. Please don't size them at 17px, for example.