CSS 커스텀 속성은 CSS 파일 가장 위에 :root{}와--를 이용해서 폰트 색상이나 사이즈 등 전역으로 사용할 CSS 속성을 먼저 정의해주는 것이다. 기업의 색상, 폰트 등 가이드라인이 있는 경우 이렇게 먼저 설정해 주면 협업과 유지보수에 용이하다. 다음 두 예시를 살펴보자. 1. CSS 커스텀 속성을 사용하지 않은 코드 위의 코드는 길이가 짧음에도 불구하고 border-color나 color에서 동일한 컬러 속성이 겹치는 것을 알 수 있다. 그렇지만 만약 만 줄의 코드라면? 클라이언트 측에서 전체 컬러를 바꿔달라는 요청이 들어온다면? 스타벅스의 초록색이나 맥도날드의 빨간색과 노란색처럼 기업의 브랜드 컬러는 웹에서 다양한 곳에서 쓰이는데, 쓰이는 곳에서마다 새로 컬러값을 써 줘야 한다면 작성도 리팩토링도 어려워질 것이다. 2. CSS 커스텀 속성을 사용한 코드 2-1. 커스텀 속성 정의하기 :root{}에서 커스텀 속성을 정해준다. 커