Adding Font Awesome to a Rails Application

Without the Rails asset pipeline driving you crazy

Posted by Powers on December 6, 2014

Font Awesome is a great open-source icon library. There's a Ruby gem to include Font Awesome in Rails application, but I couldn't get it to work with the asset pipeline. This blog post describes how to add Font Awesome to a Rails application without the 'font-awesome-sass' gem.

Some Examples

Let's look at some Font Awesome examples before we dig into the code.

The spinner uses CSS3 animations and doesn't even require JavaScript!

Adding Font Awesome to Rails

Clone the Font Awesome repo and copy the /css/font-awesome.css file in the vendor directory of your application.

git clone git@github.com:FortAwesome/Font-Awesome.git
cp font-awesome.css app_path/vendor/assets/stylesheets/font_awesome.css

Copy all the fonts in thte Font Awesome repository in the public/fonts directory of your application.

cp fonts app_path/public

Don't forget to require the font_awesome.css file in your application.css.scss file.

*= require font_awesome

Restart your web server and you should have no problem adding icons to your application. You can inspect this page for some valid Font Awesome HTML snippets.