CSS 3 vs Sass: What are the differences?
Developers describe CSS 3 as "The latest evolution of the Cascading Style Sheets language". CSS3 is the latest evolution of the Cascading Style Sheets language and aims at extending CSS2.1. It brings a lot of long-awaited novelties, like rounded corners, shadows, gradients, transitions or animations, as well as new layouts like multi-columns, flexible box or grid layouts. Experimental parts are vendor-prefixed and should either be avoided in production environments, or used with extreme caution as both their syntax and semantics can change in the future. On the other hand, Sass is detailed as "Syntactically Awesome Style Sheets". 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.
CSS 3 can be classified as a tool in the "Languages" category, while Sass is grouped under "CSS Pre-processors / Extensions".
Sass is an open source tool with 12K GitHub stars and 1.93K GitHub forks. Here's a link to Sass's open source repository on GitHub.
Airbnb, StackShare, and Asana are some of the popular companies that use Sass, whereas CSS 3 is used by Simply Business, Ontuitive, and SupplyAI. Sass has a broader approval, being mentioned in 2101 company stacks & 1486 developers stacks; compared to CSS 3, which is listed in 100 company stacks and 283 developer stacks.
What is CSS 3?
What is Sass?
Want advice about which of these to choose?Ask the StackShare community!
Why do developers choose CSS 3?
What are the cons of using CSS 3?
What are the cons of using Sass?
What tools integrate with CSS 3?
What tools integrate with Sass?
It was a little awkward building BS3 with LESS, and the rest of the site with SCSS, but it works. SCSS made building the UI elements (ink/flip buttons, img navs, etc) a breeze. It also drives the mobile menu open/close transitions - that would have been much too much with vanilla css.
Sass helps us write better stylesheets. One major improvement over CSS that we use a lot is variables - it allows for much easier theming to quickly change brand colors for new instances of the xCoLab.
When you realise that countless lines of CSS codes could be made countable. And off course, a wonderful and cool way to use the logic behind variables and nesting. Simply love it.
Sass is used as a part of Woltlab Suite Core, which offers to submit/configure own styles via the injection of own Sass-CSS. So we exclusively rely on Sass for our CSS needs.