SASS

Variables

Sass Variables allows you to define a value once and use it in multiple places. Variables begin with dollar signs and are set like CSS properties. You can change the value of the variable in one place, and all instances where it is used will be changed.

Nesting

Nesting is a shortcut to creating CSS rules. So instead of writing so many lines of CSS just to be specific on the style we want to apply to an element, we simply nest it.

Partials

Partials in Sass helps us to break our files into small files without affecting performance.

Partials greatly helps us to organize our CSS files. Having an architecture for your project makes it much easier to break your CSS file into partial files.

This leads to better maintenance and management of your CSS files.

Import

Sass extends the CSS @import rule so that it works with .scss and .sass files. It imports the file referenced and any variables or mixins that are defined in the imported file can be used in the main file.

Mixins

When you find yourself writing the same code over and over again, it feels like Sass mixins might help you out.

Sass mixins are CSS functions that you can include whenever you want.

Extend/Inheritance

Extend is a feature of Sass that allows classes to share a set of properties with one another.

Operators

Sass supports various operators which allows you to perform various operations within sass files.