이 도구로 할 수 있는 일
전경색과 배경색 조합을 객관적인 텍스트 대비 기준으로 검사하면서 자주 쓰는 색상 형식을 한곳에서 확인합니다.
사용 방법
- 전경색과 배경색의 HEX 값을 입력하거나 색상 선택기로 고릅니다.
- 대비 비율과 일반·큰 텍스트의 AA·AAA 네 가지 결과를 계산합니다.
- 계산 후 예시를 확인하고 비율·판정과 HEX·RGB·HSL 값을 복사합니다.
계산 공식과 처리 방법
sRGB 채널을 상대 휘도로 선형화합니다. 대비 비율 = (밝은 휘도 + 0.05) ÷ (어두운 휘도 + 0.05)이며 기준 판정 전에는 값을 반올림하지 않습니다.
사용 예시
검정과 흰색은 21:1로 네 가지 텍스트 기준을 모두 통과합니다. #008580과 #FFFFFF는 약 4.499954:1로, 4.5:1보다 낮아 일반 텍스트 AA를 통과하지 못합니다.
활용 사례
- 웹사이트 텍스트 색상 검사
- HEX를 RGB·HSL로 변환
- 배포 전 디자인 토큰 검토
한계와 주의사항
불투명한 두 단색만 검사합니다. 그라데이션, 이미지, 투명도, 실제 글꼴 렌더링과 포커스 표시를 측정하지 않습니다. 텍스트 색상 대비 결과이며 비텍스트 대비나 전체 접근성 검사를 대신하지 않습니다.
자주 묻는 질문
어떤 기준을 사용하나요?
WCAG 2.2 기준으로 일반 텍스트는 AA 4.5:1 이상·AAA 7:1 이상, 큰 텍스트는 각각 3:1 이상·4.5:1 이상입니다. 글자 크기는 사용자 확대 전 제공된 크기로 확인합니다.
통과하면 페이지가 접근 가능한가요?
아닙니다. 텍스트 색상 대비만 검사합니다. 구조, 키보드 조작, 레이블, 비텍스트 대비와 포커스는 별도로 확인해야 합니다.