Css set variable

:root {
  --main-bg-color: coral;
}

#div1 {
  background-color: var(--main-bg-color);
}

#div2 {
  background-color: var(--main-bg-color);
}

Css variables

:root {
  --first-color: #16f;
  --second-color: #ff7;
}

#firstParagraph {
  background-color: var(--first-color);
  color: var(--second-color);
}

#secondParagraph {
  background-color: var(--second-color);
  color: var(--first-color);
}

#container {
  --first-color: #290;
}

#thirdParagraph {
  background-color: var(--first-color);
  color: var(--second-color);
}

Source: developer.mozilla.org

How to use variables in css

:root {
  --clr-primary-1: hsl(205, 86%, 17%);
}

.container{
  background-color: var(--clr-primary-3);
}

Similar codes

5 votes321 views1 answer
Cursor as image css
CSS
0 vote354 views1 answer
Css bootstrap carousel fade how to add fade in up text
CSS
3 votes331 views1 answer
Css transition visibility
CSS
0 vote327 views1 answer
Button transition
CSS
0 vote323 views1 answer
Quitar flecha summary html css
CSS
0 vote342 views2 answers
Hoq to give paragraph color css
CSS
3 votes334 views2 answers
How to change only bullet color in css
CSS
0 vote338 views1 answer
Css media queries if else
CSS
9 votes368 views3 answers
Bootstrap blue outline button
CSS Bootstrap
0 vote361 views1 answer
Css custom cursor form image
CSS