PIcons

This project has the source SVG for the icon fonts used in Panintelligence.

Usage

If you want to experiment, you can just use the url from githack.com which serves as an automatic CDN for github-hosted files:

<link href="https://raw.githack.com/Panintelligence/picons/master/dist/css/picons-charts.css" rel="stylesheet">

Please do not use the URL above in production as githack will throttle requests to that URL if there are too many.

In production, you should do the following:

Download the artifact from the releases page
Copy css/picons-charts.css into your css folder
Copy all the fonts inside fonts to your fonts folder

If you look inside picons-charts.css, it expects the fonts to be one level above and inside fonts:

@font-face {
    font-family: 'picons-charts';
    src:  url('../fonts/picons-charts.eot?u53g43');
    src:  url('../fonts/picons-charts.eot?u53g43#iefix') format('embedded-opentype'),
        url('../fonts/picons-charts.ttf?u53g43') format('truetype'),
        url('../fonts/picons-charts.woff?u53g43') format('woff'),
        url('../fonts/picons-charts.svg?u53g43#picons-charts') format('svg');
    font-weight: normal;
    font-style: normal;
}

Feel free to change these paths to whatever suits you.

Developing and contributing

Editing the fonts

Use any vector-based editor. I like to use inkscape, but you can edit the fonts using fontforge too.

Configuring Inkscape

You'll want the SVG Font Editor so you can bring it up via Text -> SVG Font Editor:

You can find out more here.

Generating fonts

Requirements

fontforge
Python 3

To build all the fonts run:

./build.sh