CSS를 작성하다 보면 같은 값들이 반복되는 경우가 있다. 이런 경우 변수를 만들어서 사용하면 관리가 쉬워진다. CSS 변수 사용법 root클래스 안에 변수를 선언하면 사용할 수 있다. :root { --main-bg-color: pink; } body{ background-color: var(--main-bg-color); } 동일한 값을 사용하는 곳에 변수를 사용해서 적용하면 된다. 대체 변수 사용하기 변수가 정의되지 않았을 때, 대체 변수를 사용할 수 있다. body{ background-color: var(--main-bg-color, red); /*--main-bg-color가 정의되지 않은 경우 red가 적용된다.*/ } 참고자료 사용자 지정 CSS 속성 사용하기