How can I use the icon from the .eps file and upload it to my website?

I have

The file.eps file that I downloaded from http://www.shutterstock.com/ looks like this:

enter image description here


I want

to export all of these icons to my part so that I can use them on my site.


I tried

doing it manually one by one, it’s very laborious, now I’m looking for the best way to export all of them.


I have questions

Is there a Mac app out there that helps me export / slice my file.eps to multiple icon.png files?

Should I even extract them?


My main goal:

  • upload them to my site.
  • keep minimum HTTP request
  • Look amazing on retina display devices.
+7
css icons sprite-sheet eps
source share
1 answer

I am sure that there are several ways to achieve this kind of task, but I do so. Here are my steps:


1. Convert .eps to .png

I did this by opening my file.eps in Illustrator and go to File> Save For Web> Choose PNG-8> Save. You should see that it is exported to the desired destination.


2. Create style styles

Go to http://www.spritecow.com/

I load the exported file.png and select any objects. The corresponding css code should be automatically generated for me as follows:

enter image description here


3. Result

I selected a few icons that I liked and displayed them correctly.

Finally, I gathered my result: HERE

Hope this answer helps someone like me.

+9
source share

All Articles