SASS Variables
SASS variables are used to store values against an identifier. This identifier can further be use as property values. This is fundamental advantage of using SASS. These variables can store any kind of information including.
- Numerical Values
- String Data
- Hexadecimal Value
- Boolean
- Color Values
Syntax of Variable in SASS
In SASS variable declaration start with $ sign. We can create any number of variables according to our requirement.
$variable-name : value ;
Example:
$back-color : #4CB050;
.header {
border : 1px solid $back-color;
}
.alert-success {
background-color : $back-color;
}
The above SASS code will be compiled into CSS code as:
.header {
border : 1px solid $#4CB050;
}
.alert-success {
background-color : #4CB050;
}