The Basic Shortcode

[icon icon="" size="" spin="" pull="" border="" color=""]

You can either enter the shortcode manually or through the icon shortcode dropdown in the WYSIWYG editor (see image on right).

• icon = icon name from list below
• size = large, 2x, 3x or 4x
• spin = yes or no
• pull = left or right. The same as alignleft and alignright.
• color = hex color code (#333333) or name color (red, blue, green etc)

Examples

[icon icon="repeat" size="3x" spin="yes" pull="" border="" color="darkgrey"]

With "pull" undefined and "spin" set to yes. Nulla lobortis gravida nulla, a interdum est adipiscing non. Donec ut mollis turpis. In hac habitasse platea dictumst. Quisque eget eros nunc, nec consequat sem.

---

[icon icon="repeat" size="3x" spin="" pull="left" border="" color="darkgrey"]

With "pull" defined to the left. Nulla lobortis gravida nulla, a interdum est adipiscing non. Donec ut mollis turpis. In hac habitasse platea dictumst. Quisque eget eros nunc, nec consequat sem.

---

[icon icon="repeat" size="3x" spin="" pull="right" border="" color="darkgrey"]

With "pull" defined to the right. Nulla lobortis gravida nulla, a interdum est adipiscing non. Donec ut mollis turpis. In hac habitasse platea dictumst. Quisque eget eros nunc, nec consequat sem.

---

Pixel Perfection at 14px

Every single icon re-created from the ground up to be optimized for Bootstrap's default 14px.

New Styles

New styles for animated spinning icons, icons with 2x-4x size multipliers, icon borders, & more.

Screen reader compatible

Font Awesome won't trip up screen readers, unlike other icon fonts.

CSS control

Easily style icon color, size, shadow, and anything that's possible with CSS.

One font, 249 icons

In a single collection, Font Awesome is a pictographic language of web-related actions.