10

I am new to web development. And in my sample project to get icons I have included the font-awesome plugin (http://fontawesome.io/icons/). And I can select all sort of icons available. But I have two three project specific images like the project logo.

Question 1: How can I convert project specific images (png) to icons like "font-awesome"

Question 2: I searched a little and then found that the are nothing but files with svg extension. So, if I convert the images that I already have in SVG format will that be sufficient.

Question 3: So, once I create SVG icons will I be able to apply the CSS styling as I apply on "font-awesome" icons.

I am new to all this. Please guide me.

Unbreakable
  • 7,776
  • 24
  • 90
  • 171
  • 1
    I highly doubt that I asked for any book or any plug in recommendation. I did my homework before asking and then posted my question. I have got a satisfactory answer which DOES NOT have any book recommendation per se. Thanks – Unbreakable Aug 15 '16 at 17:46

1 Answers1

12

Question 1: How can I convert project specific images (png) to icons like "font-awesome"

link

A png is a bitmap image style and an SVG is a vector-based graphics design which supports bitmaps so it's not as if it would convert the image to vectors, just an image embedded in a vector-based format. You could do this using http://www.inkscape.org/ which is free. It would embed it, however it also has a Live Trace like engine which will try to convert it to paths if you wish (using potrace).

Question 2: I searched a little and then found that the are nothing but files with svg extension. So, if I convert the images that I already have in SVG format will that be sufficient.

Yes

Question 3: So, once I create SVG icons will I be able to apply the CSS styling as I apply on "font-awesome" icons.

You could add it to the font-awesome library manually. On the other hand, instead of pulling out your hair doing it, you should use an online tool that helps you create a custom library for your icons. I've used Icomoon, and flaticon with success in the past.

Community
  • 1
  • 1
Der
  • 727
  • 7
  • 20