Make icon fonts: Part 1

Make font icons in the vector-based illustrator of your choice and upload your SVG files to a service like Ico Moon to turn them into a font-family you can use on your website.

[@mtgoss40]

This was great. I have been dabbling in custom icon fonts and trying to figure out the correct steps using icomoon and this was exactly what I needed. Clear speaking, no nonsense, well explained. Thumbs up.

[@nathanferguson8969]

+Michael Goss Yo, man - you just mad my day! :)

[@marcussunde4737]

I've been looking for a tutorial on this matter for a while. Thanks for the upload. i'm not sure this topic is labeled well for youtube. The reason I say that is because finding information on the ion-iconic framework was simple, finding this information was not as simple,a and this process is much more simple.

[@justinoneill2837]

good job on the video! was looking for a simple explanation on how icomoon worked and this video nailed it

[@isaacbermudez9372]

Thanks for all, this tutorial was me great helpful!! :D

[@carlottacraig3674]

Thank you Nathan.

[@irrepressiblyindomitable568]

Thanks dude for the amazing tutorial. Finally, I have been able to create font from an image. you rock man, keep up the good works.

[@Adiiiill]

Thank you for the explanations.
I have a question please : What is the perfect size (height and width) of the SVG file ?

[@justinoneill2837]

i'd say the smaller the better. 32x32 is my preference

[@fargolargo4300]

Thank u Nathan. Good explain.

[@monkeysgone2heaven1]

Excellent tutorial Nathan!

[@aboadialhemiary348]

You are super

[@NotApplicable1123]

when i downloaded my converted svg, there was a regular font (didnt include my svg) and is a huge PITA for me rn, any help would be great.

thanks man. it was very helpful.

[@fadeonsky5797]

Hi, for some reason my logo wont appear. my class in my case is and because im working on my pc, I linked my css page at the beginning with Do you have an idea as to why this won't work? thx

[@jigneshmachhi9129]

Same problem here

[@neilaryaofficial]

What is that flow diagram image on your desktop? BTW thanx for the great tutorial ❤️

[@Salye]

OMG you are amazing, thanks so so much I wanna cry lol

[@ahadulislam8891]

I think now you memorize the whole template hierarchy

[@aa465zz]

I would be happy if you provied those website links in this video description

[@Fullstackdev18]

Thanks man!

[@DrewNorman]

What compiler are you using for your sass. Great video bro

[@topendweb]

What did you do with the .json file?

[@Johnyyy88]

Good job man, thanks

[@DrewNorman]

What size do you recommend for icons great question that was asked before.

[@justinoneill2837]

32x32

[@curiousprogrammer90]

Nice, thank you! :)

[@turok3637]

You could have explain this in 5min max.. :D But thanks.. !

[@keivkeiv]

What system was your desktop background of?

[@Dogfoods21]

It's a diagram of templates and partials for WordPress. The graphic is a number of years old, so I'm not sure if it's up-to-date.

[@ultrasenses]

Thanks!

[@thaihoangha5722]

thank you!!!

[@mfachryofficial]

Thanks bro!

[@abirhasanzoha1291]

thanks

[@lisjanhasaj1741]

[@marceloborges5502]

i like fontello.com more