Iconomus

03/09/2012

Prototyping is a huge part of our process throughout most of our projects. Using things like Bootstrap, jQuery Mobile, Placehold.it and other handy tools make it really easy to jump right into code and create something functional that we can start evaluating. However, creating icons was the one thing that kept driving us into image editors. So, we built Iconomus with Ben Johnson, a good friend of ours.

Iconomus is like a little robot that retrieves, resizes, colors and generates icons for your web projects. All you need is a URL that specifies the available attributes for an icon and drop it into your HTML or CSS, like so:

CSS

.glasses {
  background: url(http://iconom.us/glasses-300x300.png);
}

Output

HTML

 <img src="http://iconom.us/beer-62abcd-300x300.png" alt="" />
 

Output

Iconomus grabs icons from The Noun Project and does some work to get your icon looking the way you want, all without having to fire up an image editor. Right now, the things we’ve covered are fairly basic, so we can start getting feedback from people, but it’s already come in handy for our own prototyping process.

Give Iconomus a try and let us know what you think. You can also follow Iconomus on Twitter to receive “Icon of the Day” tweets.