JS로 css 변수 다루기

흔히 다크모드를 구현할 때 css의 root 팔레트를 바꿈으로써 구현하는 경우가 있다

아래의 예시처럼 css에서 변수를 선언하고, document.documentElement.style로 접근할 수 있다

script.js

document.documentElement.style.setProperty("--kong", "blue");

style.css

:root{
  --kong:red;
}

p {
  color: var(--kong);
}