Compass vs Stylus: What are the differences?
Compass: 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; Stylus: Expressive, robust, feature-rich CSS language built for nodejs. Stylus is a revolutionary new language, providing an efficient, dynamic, and expressive way to generate CSS. Supporting both an indented syntax and regular CSS style.
Compass and Stylus can be primarily classified as "CSS Pre-processors / Extensions" tools.
"No vendor prefix CSS pain" is the top reason why over 8 developers like Compass, while over 65 developers mention "Simple" as the leading cause for choosing Stylus.
Compass is an open source tool with 6.91K GitHub stars and 1.23K GitHub forks. Here's a link to Compass's open source repository on GitHub.
According to the StackShare community, Compass has a broader approval, being mentioned in 88 company stacks & 42 developers stacks; compared to Stylus, which is listed in 69 company stacks and 45 developer stacks.
What is Compass?
What is Stylus?
Need advice about which tool to choose?Ask the StackShare community!
Sign up to add, upvote and see more prosMake informed product decisions
What are the cons of using Compass?
What are the cons of using Stylus?
Sign up to get full access to all the companiesMake informed product decisions
One of the main reasons I use it is that it combines most of what I like but is spread across other preprocessors.
The option to make functions that take places of properties is amazing.
border-radius: "child" $parent-radius can actually be calling a function like
border-radius("child", $parent-radius) where using
border-radius: 4px would just implement the standard expected result.
Add in my favorite selector: `^[-1..-1] to get the last raw selector in a nested situation. (its like magic in combination with BEM naming syntax)
Sass library that was originally used on the current JourneyMaker app. We've been slowly removing it from the front end.