CSS
JS
Glyphs
Collection of icons and typographic symbols.
Usage
All Garden glyphs are bundled together into a Web Open Font Format file, located at dist/fonts
.
The .glyph
class is responsible for setting the font-family
name, along with a couple of resetting properties.
The classes for specific glyphs should be prefixed with glyph
and then followed by the glyph identifier, as shown in the example below for the cart icon.
<div class="glyph glyph-cart"></div>
Below is a relation of glyphs currently available. You can click on any of them to automatically copy their identifiers.
Customized bundle
Garden gathers all the SVG icons under src/glyphs
and uses gulp-iconfont to create the font file. With that, a PostCSS function is used to generate the CSS file for that font. Due to this process flow, you can easily customize your bundle by adding or removing glyphs on that folder.