Need advice about which tool to choose?Ask the StackShare community!

Bourbon

127
114
+ 1
20
Compass

347
293
+ 1
12
Add tool

Bourbon vs Compass: What are the differences?

Developers describe Bourbon as "A lightweight mixin library for Sass". Bourbon is a library of pure sass mixins that are designed to be simple and easy to use. No configuration required. The mixins aim to be as vanilla as possible, meaning they should be as close to the original CSS syntax as possible. On the other hand, Compass is detailed as "A Stylesheet Authoring Environment that makes your website design simpler to implement and easier to maintain". The compass core framework is a design-agnostic framework that provides common code that would otherwise be duplicated across other frameworks and extensions.

Bourbon and Compass belong to "CSS Pre-processors / Extensions" category of the tech stack.

"Simple mixins" is the primary reason why developers consider Bourbon over the competitors, whereas "No vendor prefix CSS pain" was stated as the key factor in picking Compass.

Bourbon and Compass are both open source tools. Bourbon with 8.86K GitHub stars and 916 forks on GitHub appears to be more popular than Compass with 6.91K GitHub stars and 1.23K GitHub forks.

Weebly, Movielala, and Custora are some of the popular companies that use Compass, whereas Bourbon is used by DeveloperTown, Helpful, and devbase.io. Compass has a broader approval, being mentioned in 88 company stacks & 42 developers stacks; compared to Bourbon, which is listed in 25 company stacks and 12 developer stacks.

Get Advice from developers at your company using StackShare Enterprise. Sign up for StackShare Enterprise.
Learn More
Pros of Bourbon
Pros of Compass
  • 14
    Simple mixins
  • 3
    Lightweight
  • 3
    No javascript
  • 9
    No vendor prefix CSS pain
  • 1
    Mixins
  • 1
    Variables
  • 1
    Compass sprites

Sign up to add or upvote prosMake informed product decisions

What is Bourbon?

Bourbon is a library of pure sass mixins that are designed to be simple and easy to use. No configuration required. The mixins aim to be as vanilla as possible, meaning they should be as close to the original CSS syntax as possible.

What is Compass?

The compass core framework is a design-agnostic framework that provides common code that would otherwise be duplicated across other frameworks and extensions.

Need advice about which tool to choose?Ask the StackShare community!

What companies use Bourbon?
What companies use Compass?
See which teams inside your own company are using Bourbon or Compass.
Sign up for StackShare EnterpriseLearn More

Sign up to get full access to all the companiesMake informed product decisions

What tools integrate with Bourbon?
What tools integrate with Compass?
What are some alternatives to Bourbon and Compass?
Sass
Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It's translated to well-formatted, standard CSS using the command line tool or a web-framework plugin.
Animate.css
It is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
css-loader
The css-loader interprets @import and url() like import/require() and will resolve them.
Autoprefixer
It is a CSS post processor. It combs through compiled CSS files to add or remove vendor prefixes like -webkit and -moz after checking the code.
Less
Less is a CSS pre-processor, meaning that it extends the CSS language, adding features that allow variables, mixins, functions and many other techniques that allow you to make CSS that is more maintainable, themable and extendable.
See all alternatives