ws7 Buy now

UI icons (Icon font)

ws7 includes the collection of vector based font icons to use across the website. See the code example below:

<i class="ai-anchor"></i>
i.ai-anchor
You can find the list of all available icons as well as their respective css classes here.

Add new icons to the set

In order to add new icons to the set follow these easy steps:

  1. Locate selection.json file inside ws7/dist/fonts
  2. Upload this file to Icomoon App. See the screnshot below.
  3. Add new icons by dragging them to the end of the list (this is important to add icons to the end). Make sure you upload icons in .svg format. Each SVG icon should be 24x24px and all paths should be outlined (converted to shapes) for better rendering.
  4. Make sure to select new icons with selection tool at the top and click Generate Font.
  5. Download generated font, extact .zip archive. Copy new font files as well as selection.json to ws7/dist/fonts.
  6. Open styles.css inside downloaded .zip, copy your new icons styles and add them to ws7/src/scss/components/_icons.scss to the end of the file.
Icomoon App
Top