Show HN: Font Awesome to PNG

#1

Post by commanderj » Tue, May 27, 2014, 5:21 PM UTC

Show HN: Font Awesome to PNG
fa2png.io

Re: Show HN: Font Awesome to PNG

#2

Post by SlAZ3 » Tue, May 27, 2014, 5:25 PM UTC

very cool!

Re: Show HN: Font Awesome to PNG

#3

Post by huangc10 » Tue, May 27, 2014, 5:33 PM UTC

this is pretty awesome. been needing something like this every now and then. however, keep in mind there are free packages that provide similar artwork as font awesome in .png and .eps.

Re: Show HN: Font Awesome to PNG

#4

Post by arebours » Tue, May 27, 2014, 5:37 PM UTC

I'd suggest putting example values inside input forms, not only as a hint in placeholder so sample preview could be generated instantly with only one mouse click. People are lazy now.

Re: Show HN: Font Awesome to PNG

#5

Post by iekadou » Tue, May 27, 2014, 5:42 PM UTC

I think using this will increase my mockup page speed a bit. Cool!

Re: Show HN: Font Awesome to PNG

#6

Post by sinak » Tue, May 27, 2014, 5:46 PM UTC

Somewhat relatedly: http://fontello.com. Helps you generate your own icon fonts using a smaller selection of icons instead of using the entire Font Awesome library, which can be up to 253kB depending on your browser.

There's a great gem for using it with rails [1], a cli [2] and grunt task [2].

[1] https://github.com/railslove/fontello_rails_converter

[2] https://github.com/paulyoung/fontello-cli

[3] https://github.com/jubalm/grunt-fontello

Re: Show HN: Font Awesome to PNG

#7

Post by ansimionescu » Tue, May 27, 2014, 5:53 PM UTC

I'm not much into frontend development, but AFAIU Font Awesome is a bunch of assets packed as a font [0]. Why is this is a good idea? Is it faster, smaller, more convenient, something else?

0: http://stackoverflow.com/a/15503304

Re: Show HN: Font Awesome to PNG

#8

Post by geuis » Tue, May 27, 2014, 5:55 PM UTC

sinak wrote: post #6

Somewhat relatedly: http://fontello.com . Helps you generate your own icon fonts using a smaller selection of icons instead of using the entire Font Awesome library, which can be up to 253kB depending on your browser. There's a great gem for using it with rails [1], a cli [2] and grunt task [2]. [1] https://github.com/railslove/fontello_rails_converter [2] https://github.com/paulyoung/fontello-cli [3] https://github.…

We've started using fontello recently. We use some custom svg assets in addition to the icon font sets. I wrote a ~100 line python script that manages interactions with fontello. It'll open a browser with our config file, let you make changes, then download and store the updated fontello assets mostly from the command line. I highly recommend doing something like this if you get on board the fontello train.

Re: Show HN: Font Awesome to PNG

#9

Post by 23andwalnut » Tue, May 27, 2014, 5:57 PM UTC

ansimionescu wrote: post #7

I'm not much into frontend development, but AFAIU Font Awesome is a bunch of assets packed as a font [0]. Why is this is a good idea? Is it faster, smaller, more convenient, something else? 0: http://stackoverflow.com/a/15503304

A lot of font-icons allow you to set the the icon using class names. So rather than linking to a specific image file or using some obscure ascii code like in the stackoverflow example you linked to, I can just add a class name like 'icon-user' and the user icon will show up. It's definitely easier in some situations.

Font icons are scalable too, which makes it really easy to change the icon size on the fly. Since I do all of my development directly in the browser, I never know how big I need my icons until I've done some experimenting with different sizes. Font icons make this experimentation process a lot easier because I don't need to update an image file. I can just change the font-size property in css.

Re: Show HN: Font Awesome to PNG

#10

Post by iekadou » Tue, May 27, 2014, 5:57 PM UTC

ansimionescu wrote: post #7

I'm not much into frontend development, but AFAIU Font Awesome is a bunch of assets packed as a font [0]. Why is this is a good idea? Is it faster, smaller, more convenient, something else? 0: http://stackoverflow.com/a/15503304

There are some cases where you don't want the whole bunch of font-awesome in your project, illustration or what ever. E.g. for mockups it's very easy to use, you just use it to drag and drop the icons you want.