예를 들어 텍스트 강조 색을 다크모드 염두해서 작성할 때

"text-red-500 dark:text-red-400"으로 작성했는데, 이게 자꾸 반복되니까 짜증나더라고

특히 라이트모드는 500 다크 모드는 400이 맞았는지 자꾸 확인하는게 짜증났음 ㅡㅡ

@apply 써도 되긴 하는데


css에

:root {

 --text-highlight : var(--color-red-500)

}


.dark {

 --text-highlight : var(--color-red-400)

}


이렇게 작성하고


"text-red-500 dark:text-red-400" 대신에 "text-(--text-highlight)"이라고 쓰면 훨씬 편하더라고

님들은 어케 함?