169
votes

I would like to start using compass and sass to speed up development. At the moment, I have installed Sass on a mac and instructed it to watch scss file for input, and a css file for generated output.

From many articles, Sass is used with Compass, I'm wondering why that is the case and just what does Compass add that Sass comes without? If you can give an example, the better.

Thanks

2
so it's been a while since you posted. Did Compass change your life?gdbj

2 Answers

142
votes

From Sass and Compass in Action, by Wynn Netherland, Nathan Weizenbaum, Chris Eppstein, and Brandon Mathis:

1.3 What is Compass?

Compass helps Sass authors write smarter stylesheets and empowers a community of designers and developers to create and share powerful frameworks. Put simply, Compass is a Sass framework, designed to make the work of styling the web smooth and efficient. Much like Rails as a web application framework for Ruby, Compass is a collection of helpful tools and battle-tested best practices for Sass.

(emphasis added)

71
votes

Compass is an extension of Sass (as in Compass requires Sass). It has its own compiler (instead of sass --watch, you use compass watch). It has a large collection of mixins and functions that you'll find incredibly useful (while commonly pointed to for generating vendor prefixed CSS3 properties, it can do things like automatically generate spritemaps and the CSS to go with them).

Compass is also built in such a way that you can bundle your own bootstrap type library for easily deploying in multiple projects without the need to copy/paste the source for it in each one.