사용 방법
자주 쓰는 형식으로 색상을 입력하거나 색상 선택기를 쓰세요. 같은 색을 HEX, RGB, HSL, CMYK로 보여 주고, 흰 글자·검은 글자와의 명도 대비와 해당 WCAG 등급, 눌러서 살펴볼 수 있는 더 밝고 어두운 색조 줄도 함께 보여 줘요.
명도 대비 = (L1 + 0.05) ÷ (L2 + 0.05), L은 상대 휘도
대비 등급 읽는 법
- AAA (7:1 이상): 본문 글자도 아주 잘 읽혀요.
- AA (4.5:1 이상): 웹사이트 일반 글자의 최소 기준이에요.
- AA Large (3:1 이상): 크거나 굵은 제목과 아이콘에만 써요.
- 3:1 미만: 많은 사람이 읽기 어려워요.
활용 팁
- CMYK 값은 단순 변환이에요. 인쇄소는 색상 프로파일을 쓰니 정확한 인쇄 색은 교정쇄로 확인하세요.
- 8자리 HEX와 rgba()는 투명도를 포함해요.
- 값을 클릭하면 복사돼요.
계산 기준과 출처
- 색상 값은 CSS Color Module Level 4(sRGB)를 따름
- 명도 대비와 등급은 WCAG 2.2(W3C)를 따름
최종 검토 2026년 10월 7일
자주 묻는 질문
HEX를 RGB로 바꾸려면?
#ff6600 같은 HEX 코드를 입력하면 RGB 값이 바로 나와요. 이 경우 rgb(255, 102, 0)이에요.
명도 대비는 얼마나 필요한가요?
WCAG는 일반 글자에 최소 4.5:1(AA), 더 엄격한 AAA 등급에 7:1을 요구해요. 큰 제목은 3:1이 필요해요.
CMYK 값은 인쇄할 때 정확한가요?
수학적으로 바로 변환한 값이에요. 실제 인쇄는 종이와 잉크 프로파일에 따라 달라지니 교정쇄로 확인하세요.
투명도도 지원하나요?
네. 8자리 HEX, rgba(), hsla() 값은 알파 채널을 그대로 유지해요.
값은 어떻게 복사하나요?
HEX, RGB, HSL, CMYK 값을 클릭하면 복사되고, 복사 버튼으로 전부 한 번에 복사할 수도 있어요.