---
title: Compass Home
crumb: Home
body_id: home
layout: homepage
---
%h1#logo Compass
%h2 <strong>Compass</strong> is an open-source <em>CSS Authoring Framework</em>.
.overview
  .info-box.compass
    %h4 Why designers love Compass.
    %ol
      %li Experience cleaner markup without presentational classes.
      %li It’s chock full of the web’s best <a href="/reference/compass/">reusable patterns</a>.
      %li It makes creating <a href="/help/tutorials/spriting/">sprites</a> a breeze.
      %li Compass mixins make <a href="/reference/compass/css3/">CSS3</a> easy.
      %li Create beautiful <a href="/reference/compass/typography/vertical_rhythm/">typographic rhythms</a>.
      %li Download and create extensions with ease.
  .info-box.sass
    %h4 Compass uses Sass.
    %p
      <a href="http://sass-lang.com/">Sass</a> is an extension of CSS3 which
      adds nested rules, variables, mixins, selector inheritance, and more.
      Sass generates well formatted CSS and makes your stylesheets
      easier to organize and maintain.
  = render 'partials/ad'
%h3 Brilliant people use Compass, including these <em>wildly talented</em> folks:
%ul#featured_sites
  %li
    %a(href="http://status.heroku.com/")
      %img(src="/images/sites/status.heroku.jpg")
      %span.title Heroku Addons
      %span.url http://status.heroku.com
  %li
    %a(href="http://sencha.com/products/touch/")
      %img(src="/images/sites/sencha.jpg")
      %span.title Sencha Touch
      %span.url http://sencha.com/products/touch
  %li
    %a(href="http://caring.com/")
      %img(src="/images/sites/caring.jpg")
      %span.title Caring.com
      %span.url http://caring.com
  %li
    %a(href="http://hubblesite.org/")
      %img(src="/images/sites/hubblesite.jpg")
      %span.title HubbleSite
      %span.url http://hubblesite.org
  %li
    %a(href="http://dailymile.com/")
      %img(src="/images/sites/dailymile.jpg")
      %span.title DailyMile
      %span.url http://dailymile.com
  %li
    %a(href="http://cofamilies.com/")
      %img(src="/images/sites/cofamilies.jpg")
      %span.title Cofamilies
      %span.url http://cofamilies.com
  %li
    %a(href="http://jumpstartlab.com")
      %img(src="/images/sites/jumpstartlab.jpg")
      %span.title Jumpstart Lab
      %span.url http://jumpstartlab.com
  %li
    %a(href="http://green.cals.cornell.edu/")
      %img(src="/images/sites/cornell.jpg")
      %span.title Cornell University - CALS
      %span.url http://green.cals.cornell.edu
  %li
    %a(href="http://busyconf.com/")
      %img(src="/images/sites/busyconf.jpg")
      %span.title BusyConf
      %span.url http://busyconf.com

%section.book
  %h3 Save <em>37%</em> on the Book: (Currently In Beta)

  %p
    %a(href="http://www.manning.com/netherland/")
      %img(src="http://www.manning.com/netherland/netherland_cover150.jpg" alt="Sass & Compass in Action")
    Compliments of Manning.com is a standing 37% discount on
    <a href="http://www.manning.com/netherland/">Sass and Compass in Action</a>.
    Use promo code <code>sasscomp37</code> at manning.com on the MEAP, eBook and pBook of Sass and
    Compass in Action.  All pBook purchases include free eFormats (PDF, ePub, and Kindle)
    as soon as available.

%section.gui
  %h3 <em>Hate</em> the Command Line?

  %a(href="http://compass.handlino.com/")
    %img(src="/images/compass.app.png")
  %p
    Buy <a href="http://compass.handlino.com/">Compass.app</a>
    for Windows and Mac for just $10.
  %p.note
    Note: Compass.app is a product of Handlino, Inc but
    30% of all proceeds go to Compass's charity of choice: <a href="http://umdf.org/compass">UMDF.org</a>.
