Presslabs Particles Font 3.0 - A Friendly, Open-Source & Customizable Web Font

Our main aim was to build SVG icons that could be easily integrated into our projects. We made use of the best technologies available today. We were inspired by Feather Icons in designing Particles. The icons were drawn in Adobe Illustrator, each icon on a 64x64px artboard. A pixel grid was used, and whenever possible, the points had fixed coordinates for optimization. Next, the icons were exported as SVGs. When generating a webfont, the SVGs need to contain only paths, and not lines or shapes. Consequently, we converted the SVGs from shapes (lines) into paths with custom offset, by using Paper.js, SVGO, and adapted a script written by Jürg Leni, one of the creators of Paper.js; all of these orchestrated by Gulp task runner. We used different implementations for converting brands and icons, each having different attributes to convert. After the conversion, the result was a set of “clean” SVGs with a singular path and no shapes. Next, the webfonts (ttf, eot, woff, woff2, svg) were generated by using Grunt alongside grunt-webfont, which we modified it in order to support ligatures. How to use it To begin using the icons, you have to download the project and install the dependencies and packages from the Particles GitHub page: https://github.com/PressLabs/par... Contribution is highly welcomed, too! <3