Due to Font Awesome's awesomeness and open licensing we opted to distribute it with Ink, instead of re-inventing the wheel. You'll find this webfont covers all your pictogram needs and then some.
To add any of the icons to your project (icon list below), simply create an <i>
element with the appropriate class. For example, to add a mail icon next to your contact information like so: me@me.com, simply use:
<i class="icon-envelope"></i> <a href="mailto:me@me.com">me@me.com</a>
Because Font Awesome is a webfont, the icon size follows the font size ofr your parent element, but if you need a larger icon, add the icon-large
class to your <i>
element, along with the specific icon class. This will give you and icon that's 33% larger than the assigned font size. For example:
<h4><i class="icon-heart icon-large"></i> We love Ink</h4>
If you want to see some more examples, you can hop over to Font Awesome's example page.
We'd like to leave a special thanks to the guys who made Font Awesome and decided to make it available under CC BY 3.0, allowing projects like Ink to share its awesomeness. Check out their web site at http://fortawesome.github.com/Font-Awesome