Foundation for Rails


License: MIT

Language: CSS


Gem Version

Foundation::Rails is a gem that makes it super easy to use Foundation in your upcoming Rails project.


Add these lines to your application's Gemfile:

gem 'foundation-rails'
gem 'autoprefixer-rails'

And then execute:


Or install it yourself as:

gem install foundation-rails

Configuring Foundation

You can run the following command to add Foundation:

rails g foundation:install

Generating Haml or Slim versions of the markup can be done by appending the --haml or --slim option to the above command.

Motion UI

Motion UI is a Sass library for creating flexible UI transitions and animations, and it comes packaged with the foundation-rails gem. To use Motion UI, uncomment the following lines from foundation_and_overrides.scss:

// @import 'motion-ui/motion-ui';
// @include motion-ui-transitions;
// @include motion-ui-animations;

Manual Installation

Add Foundation to your CSS

Append the following line to your app/assets/stylesheets/application.css file:

/*= require foundation

If you're planning on using Sass, then you'll want to rename application.css to application.scss. That file should then look like:

@import "foundation_and_overrides";
/* Add imports of custom sass/scss files here */

Add Foundation to your JS

Append the following lines to your app/assets/javascripts/application.js file:

//= require foundation
$(function(){ $(document).foundation(); });

Or if you use Turbolinks:

//= require foundation
$(document).on('turbolinks:load', function() {
    $(function(){ $(document).foundation(); });

Set Viewport Width

Add the following line to the head of your page layout:

<meta name="viewport" content="width=device-width, initial-scale=1.0" />


Run the generator to add foundation to the asset pipeline:

rails g foundation:install [layout_name] [options]

    [--haml]         # Generate HAML layout instead of erb
    [--slim]         # Generate Slim layout instead of erb
Runtime options:
    -f, [--force]    # Overwrite files that already exist
    -p, [--pretend]  # Run but do not make any changes
    -q, [--quiet]    # Suppress status output
    -s, [--skip]     # Skip files that already exist


  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request


Project Statistics

Sourcerank 16
Repository Size 4.66 MB
Stars 980
Forks 374
Watchers 68
Open issues 23
Dependencies 82
Contributors 40
Tags 73
Last updated
Last pushed

Top Contributors See all

Nicolas Coden Arthur Mark Hayes Mehdi Lahmam Kevin Ball Eric Morris Zoran Pesic Brent Odell Kristofer M White Steph Samson Arnaud Thomas D. Brandon Roehl richsinn Matt Yanchek Brian Bass Jobsen chrisfinne Sylvain RAGOT Rafi Fatih Kadir Akın

Packages Referencing this Repo

ZURB Foundation on Sass/Compass
Latest release - Updated - 980 stars

Recent Tags See all

v6.5.1.0 November 17, 2018
v6.4.3.0 March 13, 2018
v6.4.1.3 November 16, 2017
v6.4.1.2 July 14, 2017
v6.4.1.0 July 03, 2017
v6.3.1.0 March 22, 2017
v6.3.0.0 December 15, 2016
v6.2.4.0 October 21, 2016
v6.2.3.0 May 31, 2016
v6.2.1.0 April 12, 2016
v6.2.0.1 March 05, 2016
v6.2.0.0 March 01, 2016
v6.1.2.0 January 24, 2016
v6.1.1.3 January 19, 2016
v5.5.3.2 October 12, 2015

Interesting Forks See all

Foundation for Rails
Ruby - Last pushed - 1 stars - 1 forks
Foundation for Rails
Ruby - MIT - Last pushed - 1 stars - 1 forks
Foundation is awesome, now it's easy to use with Rails
Ruby - Last pushed - 1 stars
Foundation is awesome, now it's easy to use with Rails
JavaScript - Last pushed - 1 stars
Foundation for Rails
Ruby - Last pushed - 1 stars - 1 forks

Something wrong with this page? Make a suggestion

Last synced: 2019-01-29 16:34:34 UTC

Login to resync this repository