Difference Between SCSS and SASS

Difference Between SCSS and SASS

SASS/SCSS is an extension of CSS that adds super-power to it making it more useful. They are also called as CSS preprocessors. SCSS syntax is similar to CSS but SASS syntax is similar to Rubby programming Language.

Difference Between SCSS and SASS

Sass: Sass is derived from another preprocessor known as Haml. It was designed and written by Ruby developers so;

• It syntax is similar to rubby.
• Here no uses of braces.
• No strict indentation
• No semi-colons
• Variable sign in sass is ! instead of $.
• Aassignment sign in sass is = instead of :

// Variable declare
!colorRed= red  

#header
margin: 0
border: 1px solid $colorRedp
color: $colorRed
font:
size: 12px
weight: bold

SCSS provides the CSS friendly syntax to closing the gap between Sass and CSS. So;

• It syntax is similar to CSS.
• Here we uses of braces.
• Use semi-colons
• Variable sign in scss is $.
• Aassignment sign in scss is :

// Variable declare
$colorRed= red;

#header {
margin: 0;
border: 1px solid $colorRed;p {
color: $colorRed;
font: {
size: 12px;
weight: bold;
}
}