Skip to content


Subversion checkout URL

You can clone with
Download ZIP
Centurion is a web-based framework for rapid prototyping and building larger web projects.
CSS HTML JavaScript Ruby
Failed to load latest commit information.
_partials html - main page content updated based on documentation
build Grid fix for tablet and mobile being overriden by desktop values
lib Grid fix for tablet and mobile being overriden by desktop values
licenses Added license agreements for GNU and MIT
.gitignore removing "build" folder from gitignore Updated docs for Grid portion
Gruntfile.js grunt - cleaned up build and watch, added banner for CSS, and new min… now can use Centurion with Gulp and removed version callout in README
centurion-framework-3.5.2.gem adding 3.5.2 gem spec file
centurion-framework-3.5.3.gem adding 3.5.3 gemspec for release
centurion-framework-3.5.4.gem version bump to 3.5.4 to fix minor bugs
centurion-framework.gemspec rubygem - changing filename
index.html html - removing resources from main page
package.json Package dependencies fixed, npm not installing properly
resources.html html - updated index and resources pages to match docs


NPM version Gem Version


Centurion is a responsive framework built for speed, simplicity, and flexibility. Originally based loosely on the 960 grid built by Nathan Smith, Centurion boasted a responsive grid system that would help alleviate the headache of building responsive designs. Like all web projects it grew and started to capitalize on several different areas like: typography, buttons, tables, and more in order to create a seamless framework that could allow web developers to start up a new project easily without the need to override every little piece.

If you're concerned about browser support then we recommend either html5shiv or Modernizr to your web site or project to help support CSS3 and HTML5.


Centurion no longer supports Internet Explorer 7 as of version 3.5.3.

Note: Please read the CHANGELOG for updates to the framework. The latest version of Centurion differs in quite a few ways to previous versions and would require an upgrade to benefit some of the new features.

Install NPM

Getting Started

This plugin requires Grunt ^0.4.5

If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

npm install centurion-framework --save-dev

Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:


Grunt Usage

When using Centurion with Grunt you can use one of two modules: grunt-contrib-sass or grunt-sass. We recommend the later since it's built on libsass and compiles much faster, but it is missing some features so the decision is yours.

For grunt-sass you can add Centurion to your project using includePaths (as in the example below) or with grunt-contrib-sass you can change it to loadPath for the same result. Here is an example:

'sass': {
  target: {
    options: {
      precision: 4, // makes all decimals round to 4 places
      sourcemap: 'auto', // adds a sourcemap to compiled CSS for inspecting
      includePaths: ['node_modules/centurion-framework/lib/sass/']
    files: {
      'path/to.css': 'path/to.scss'

Gulp Usage

You can also use Centurion with Gulp. By using the module gulp-sass add the library module to your includePaths found in the example Gulp task below.

gulp.task('sass', function() {
  return gulp.src( 'source/sass/*.scss')
        includePaths: './node_modules/centurion-framework/lib/sass', 
        errLogToConsole: true
    .pipe(gulp.dest( 'build/css' ));

If you're interested in using Gulp check out a simple starter project on Github that shows you how to start using Centurion in your next web project.

Install RubyGem

Getting Started

Install the gem: gem install centurion-framework

If you have an existing project: require 'centurion-framework'


You also have the option of importing Centurion components as needed into your project. Start by including the entire library at the top of your Sass file:

@import "centurion-framework";

Then you can include any of the modules from Centurion that you need. For example if you wanted to only include normalize, the Centurion grid, and typography then you would add the following:

@include normalize;
@include column-grid;
@include typography;

Bugs and feature requests

If you find a bug or have a feature request you would like added to Centurion. Please search for existing and closed issues to see any similar issues. If you problem or idea is not addressed, please open a new issue.


If you're interested in contributing to Centurion simply open an issue labeled contribute and tell us what you would like to contribute. Alternatively, you can fork Centurion and submit a pull request explaining what you are contributing.


We might have a small community in comparison to other open-source projects, but we're only getting started.

Special Thanks to Our Community

I would also want to thank a few people for their contributions to Centurion.

  • Josh Northcott - for his tireless effort in spreading the word about responsive design and Centurion.
  • Corey Hadden - for his assistance in making jQuery play nice and for sheer inspiration.


Licensed under GPL and MIT.

Something went wrong with that request. Please try again.