#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);
}

SASS or SCSS
CSS

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