🟪 차트 범주형 색 가이드

차트 배경 색 (HEX)

범주 색 목록 (한 줄에 하나, 최대 10개)

밝기 차 경고 기준 ΔL* (공인값 없음 — 직접 입력)

계열	HEX	L*	배경 대비 명암비	비텍스트 3:1 (배경 대비)

쌍	HEX	ΔL* (밝기 차)	상태

3:1 판정은 "색 대 배경"에만 씁니다. 범주 색 둘을 서로 구분하는 기준이 아닙니다 — Okabe-Ito 8색도 28쌍 중 20쌍이 서로의 명암비가 3:1 미만입니다. 쌍의 구분은 색상 차이와 밝기 차(ΔL*)로 봅니다.

범주 색은 두 가지를 따로 봐야 한다

막대나 선 여러 개를 색으로 구분할 때 확인할 것은 두 가지입니다. 하나는 각 색이 차트 배경에서 보이는지, 다른 하나는 색끼리 서로 구분되는지입니다. 이 둘은 다른 기준으로 봐야 하는데 흔히 한 가지로 묶어 버립니다. 이 도구는 색마다 배경 대비 명암비를 내고, 쌍마다 밝기 차를 따로 계산해 나란히 보여 줍니다.

계산 방식

명암비는 W3C WCAG 의 상대휘도 식으로 구합니다. 비텍스트 요소 3:1 판정은 색과 배경 사이에만 적용하며, 범주 색 둘을 서로 구분하는 기준으로는 쓰지 않습니다. 쌍의 구분은 CIELAB 명도 L* 의 차이로 보고, 경고 기준은 공인값이 없어 직접 입력한 값으로 판정합니다. 근거 팔레트로는 Okabe 와 Ito 가 제안한 8색을 버튼 한 번으로 불러올 수 있습니다. 2026년 10월 기준입니다.

한계

색각 이상 시뮬레이션과 안전 점수·등급은 지원하지 않습니다. 밝기 차가 작은 쌍은 색상만으로 구분되므로 테두리·패턴·직접 라벨을 함께 쓰세요. 색 조합을 자동으로 추천하지도 않습니다.

자주 묻는 질문

범주 색끼리 명암비가 3:1 이상이어야 하나요?

아닙니다. 비텍스트 3:1 은 그래픽 요소와 배경·인접 색 사이의 기준입니다. 검증된 색각 이상 안전 팔레트인 Okabe-Ito 8색도 28쌍 중 20쌍이 서로 3:1 미만입니다. 쌍의 구분은 색상 차이와 밝기 차로 봅니다.

Okabe-Ito 8색을 그대로 써도 되나요?

Okabe & Ito 가 제안한 이 8색은 흔한 색각 이상에서도 서로 구분되도록 고른 조합이라 출발점으로 쓰기 좋습니다. 다만 배경이 밝으면 주황·하늘·노랑처럼 배경 대비가 낮은 색이 생기므로 표의 명암비를 확인하세요.

ΔL* 기준값은 얼마가 맞나요?

공인된 기준은 없습니다. 그래서 이 도구는 기준값을 직접 입력받고, 입력한 값으로만 판정합니다. 점수나 등급은 내지 않습니다.

🟪차트 범주형 색상 구분 가이드

관련된 도구

UI 시맨틱 상태 색상(성공·경고·오류) 가이드

색상 접근성 체크기

범주 색은 두 가지를 따로 봐야 한다

계산 방식

한계

자주 묻는 질문

관련된 도구

UI 시맨틱 상태 색상(성공·경고·오류) 가이드

색상 접근성 체크기

범주 색은 두 가지를 따로 봐야 한다

계산 방식

한계

자주 묻는 질문

같은 카테고리 도구