SCSS CSS Variables
#css #scss #frontend #web-development
SCSS CSS Variables
- Create a separate file for the variables
- partial in scss
:root {
--background-color: hsl(0, 0%, 11%);
--text-color: hsl(0, 0%, 100%);
}
body {
background-color: var(--background-color);
color: var(--text-color);
}
Why you should use CSS Variables over SCSS Variables
- CSS variables can be modified using javascript
- CSS variables are supported natively in the browsers so better support
- Integrated well with developer tools of the browser