생활 계산기

색상 코드 변환기

명도 대비 (WCAG 2.x)

큰 글자 Aa본문 글자 예시입니다. Aa 123
배경대비AAAA 큰 글자AAAAAA 큰 글자

기준: 일반 글자 AA 4.5:1·AAA 7:1, 큰 글자(18pt 이상 또는 굵은 14pt 이상) AA 3:1·AAA 4.5:1. 위 색상을 글자색으로 보고 계산하며, 결과는 참고용입니다.

자주 묻는 질문

어떻게 쓰나요?
색 선택기로 고르거나 HEX·RGB·HSL·CMYK 칸 중 아무 곳에나 값을 입력하면 나머지 칸이 바로 바뀝니다. #F53, F53, rgb(255, 87, 51), 255 87 51, hsl(11, 100%, 60%)처럼 CSS 표기와 숫자만 쓴 표기를 모두 받습니다.
CMYK 값이 인쇄소에서 쓰는 값과 다른 이유는?
여기서는 화면용 RGB를 공식 하나로 바꾼 근사값을 보여줍니다. 실제 인쇄 색은 용지·잉크·색상 프로파일(ICC)에 따라 달라지므로, 인쇄물은 인쇄소가 안내하는 프로파일로 변환해 확인하는 것이 좋습니다.
명도 대비는 어떻게 계산하나요?
W3C 웹 콘텐츠 접근성 지침(WCAG 2.x)의 공식을 씁니다. 두 색의 상대 휘도 중 밝은 쪽을 L1, 어두운 쪽을 L2라 할 때 (L1 + 0.05) ÷ (L2 + 0.05)이며, 1:1(같은 색)부터 21:1(검정과 흰색)까지 나옵니다. 표시값은 소수 둘째 자리에서 버림합니다.
AA, AAA 기준은 무엇인가요?
WCAG 2.x에서 일반 글자는 AA 4.5:1 이상, AAA 7:1 이상이 필요합니다. 큰 글자(18pt, 약 24px 이상 또는 굵은 14pt, 약 18.5px 이상)는 AA 3:1, AAA 4.5:1이면 됩니다. 실제 접근성 준수 여부는 글꼴·용도 등을 함께 따져야 하므로 결과는 참고용입니다.
HSL 값을 바꿨는데 HEX가 조금 다르게 돌아오는 이유는?
HEX와 RGB는 채널마다 0~255의 정수만 쓰기 때문에, HSL을 정수로 반올림해 표시하거나 입력하면 가장 가까운 RGB 값으로 맞춰집니다. 그래서 1 정도 차이가 날 수 있습니다.