DEV Community

kalokli8
kalokli8

Posted on

SASS vs SCSS

Sass (Syntactically Awesome StyleSheets) have two syntaxes:

a newer: SCSS (Sassy CSS)
and an older, original: indent syntax, which is the original Sass and is also called Sass.
So they are both part of Sass preprocessor with two different possible syntaxes.

The most important difference between SCSS and original Sass:

SCSS:

Syntax is similar to CSS (so much that every regular valid CSS3 is also valid SCSS, but the relationship in the other direction obviously does not happen)

Uses braces {}
Uses semi-colons ;
Assignment sign is :
To create a mixin it uses the @mixin directive
To use mixin it precedes it with the @include directive
Files have the .scss extension.

Original Sass:

Syntax is similar to Ruby
No braces
No strict indentation
No semi-colons
Assignment sign is = instead of :
To create a mixin it uses the = sign
To use mixin it precedes it with the + sign
Files have the .sass extension.

source: https://stackoverflow.com/questions/5654447/whats-the-difference-between-scss-and-sass

Top comments (0)