명암비 검사기

명암비 검사기 사용 방법

글자 색과 배경 색이 WCAG 2 기준(일반 글자, 큰 글자, UI 구성 요소의 AA·AAA)을 충족하는지 확인하고 WCAG 3 초안의 APCA 명도 대비도 보여 줍니다. 기준에 못 미치면 가장 가까운 통과 색상을 제안합니다.

1. 1

   ‘글자 색’과 ‘배경 색’에 HEX, rgb(), hsl(), oklch(), 색상 이름을 입력하거나 견본을 눌러 색상 선택기를 엽니다.

2. 2

   ‘명암비’ 값과 AA·AAA 항목별 ‘통과’ 또는 ‘미통과’ 결과를 확인합니다.

3. 3

   ‘미리 보기’에서 실제 모습을 보고, ‘예시 글자’에 원하는 문장을 넣거나 ‘색상 바꾸기’로 반대 조합도 시험해 봅니다.

4. 4

   ‘가장 가까운 통과 색상’에서 AA(4.5:1) 또는 AAA(7:1)용 ‘글자 색 조정’이나 ‘배경 색 조정’ 제안의 ‘적용’을 누릅니다.

5. 5

   색을 바꾸면 페이지 URL에 두 색이 담기므로 URL을 복사해 결과를 공유할 수 있습니다.

자주 묻는 질문