Build custom icon fonts with Builder for jQuery Mobile Icon Pack

Filed under: jQuery Mobile

comments (14) Views: 8,671

Back in February of last year I launched what would be one of my most popular open source projects, jQuery Mobile Icon Pack. The Icon Pack added dozens of new icons to the somewhat lacklustre offering included in the default jQuery Mobile download. Since then I've added to the project: first a few at a time, then bumping the count to over 200 with the inclusion of Font Awesome, an icon font library used by Twitter Bootstrap. Just last night I released jQuery Mobile Icon Pack 3.0 which adds another 40 icons.

Today I'm happy to announce that I'm releasing a companion application called Builder for jQuery Mobile Icon Pack. While there are many positives about icon fonts such as scalability and crisp lines, one of the drawbacks is the file size. Few projects require every icon, but users pay the download price whether your app uses just 1 icon or 100. Builder for jQuery Mobile Icon Pack allows you to tailor the icon font to include just the icons you need. Not only does this decrease file size, it makes the resulting CSS easier to manage.

Using Builder is a simple 3 step process.

  • Select from 249 beautiful high res icons representing many of the most commonly used icons today.
  • Review the icons you've selected, removing any of them by simply clicking that icon in the review window.
  • Download TTF, EOT, AFM and WOFF versions of your custom font, along with CSS, SCSS and LESS files and a handy HTML preview of the icons you've selected.

Try Builder for jQuery Mobile Icon Pack and start streamlining your icon fonts today!

Amazon logo

If this article was interesting, or helpful, or even wrong, please consider leaving a comment, or buying something from my wishlist. It's appreciated!

Very cool Andy! Looks awesome! I love that is exports the CSS and the LESS. Badass!

Ben Nadel - January 16, 2013 09:33 am

Awesome, nice work Andy!

Pete Freitag - January 16, 2013 01:36 pm

Great work Andy! This rocks!!!!!!

Eric Gonzalez - January 16, 2013 02:56 pm

This is great. Thank you Andy.

Jorge - January 16, 2013 04:10 pm

Looks great! Thanks for your work!!!

Joseph Baker - January 16, 2013 05:32 pm

Woohoo that's great !
Thx !!!

alienlebarge - January 17, 2013 06:24 am

This is so massively awesome. Really appreciate this tool!

Matt - January 17, 2013 08:20 am

Awesome post. very useful and important post. Thanks for share this post.

Rahi - January 19, 2013 09:15 am

Looks great! But I get a HTTP response code 502 when I click the download button.

Joacim Boive - February 03, 2013 08:35 am

Ill take a look at it to find out what might be wrong.

Andy Matthews - February 03, 2013 09:10 am

Joacim...

It should be good now. Not sure what the problem was but I restarted the app and it's working now. I'll check the logs.

andy matthews - February 03, 2013 01:25 pm

Yep, works great now. Thanks! =)

Joacim Boive - February 04, 2013 12:55 am

This is a great tool. Thanks!

Jose A. Carrillo - April 04, 2013 11:00 am

works great. But one question, how do you uae the large icons 36x36?

victor - May 22, 2013 04:37 pm