How to make a new project based on yours?

[victorwestmann]

Hi there. I want to design another set of icons themed differently. But I have some doubts on what should I do in order to make all icons become a font and even a CSS file that could be used inside Bootstrap. Could you guys give me a hint/light? thanks! (Thanks for the amazing project BTW!) :smile:

[erikflowers]

There's a number of depths you can take this. It's not hard to make new art and put it in a font file. I use Glyphs Mini, it's $50.

Then, you just assign the CSS classes to the hex values in the font file, like \F000 is where mine start. That would be easy.

If you want a whole project like mine, you'd need to then sort of get the Less/Sass and build it similarly, and maintain the source files so you can export to CSS from a set of variables and names.

All you need is a font file linked to the unicode address hex, and then css like this: For the main class it's like

.wi {
  display: inline-block;
  font-family: 'weathericons';
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

Then the specific icons look like this

.wi-day-cloudy-gusts:before {
  content: "\f000";
}

Just change the class names here, and that's the simplest way. To make a whole project would take a huge amount of detail I'd have to go in to, you're talking about a major code project.

But if you wanted the very simplest approach - make art, get Glyphs Mini to construct your font file, and use the CSS similar to above. Beyond that it's a major project.

[victorwestmann]

@erikflowers thank you very much for all the instructions. Will do all my best to try to follow (and succeed) them! Cheers.