Font AWESOME! in Tips and Tricks
- May 29, 2014, 2:47 a.m.
- |
- Public
I haven't written anything in this book for ages, so I thought it would be worth a quick entry on the phenomenon known as Font Awesome. Font Awesome is the icon set I use for Prosebox. It's becoming rather popular and they seem to be updating it regularly. I've just updated Prosebox to point to the newest set, version 4.1.0:
To use these in Prosebox, just reference the list linked above, and pop the following into your entry:
<i class="fa <your-code-here>"></i>
So for example, if I want the Star Wars Imperial Crest:
<i class="fa fa-empire"></i>
And you get:
It will scale to match your text size, so if you put it in a header row:
# HEADER 1 <i class="fa fa-empire"></i>
(the single hashtag with a space at the beginning of the row gives you the largest header, equivalent to an <h1>
HTML tag)
And you get:
HEADER 1
Or if you want to make it larger than your text:
This paw is 5 times larger than the text <i class="fa fa-5x fa-paw"></i>
Result:
This paw is 5 times larger than the text
Since these icons are all vector graphics, you will impress your friends with Retina displays - no matter how big you make 'em, they won't get jagged and pixelated.
Enjoy!
Loading comments...