색상 대비 검사기

WCAG 상대 휘도 공식에 따라 로컬에서 전경색과 배경색의 대비를 확인하고, 일반 본문과 큰 글자의 AA/AAA 기준을 각각 판단하며 보고서 내보내기를 지원합니다.

브라우저에서 로컬 처리
이 페이지는 공개 디렉터리 검사를 통과했습니다. JavaScript을 활성화하면 전체 기능을 사용할 수 있습니다.
사용 안내

색상 대비 검사기 사용 방법

색상 값은 현재 브라우저에서만 상대 휘도와 대비를 계산하며 업로드하거나 저장하지 않습니다.

  1. 두 가지 색상 입력

    색상 선택기를 사용하거나 #RRGGBB 값을 붙여 넣어 전경색과 배경색을 설정하면 미리보기가 동기화되어 업데이트됩니다.

  2. 검사 기준

    검사를 클릭하여 일반 본문 AA, 일반 본문 AAA 및 큰 글꼴 AA의 통과 상태를 각각 확인합니다.

  3. 복사 검사 기록

    통과하면 보고서를 복사하거나 TXT을(를) 다운로드하여 색상 값, 비율 및 각 단계의 기준 결과를 기록할 수 있습니다.

제한 및 주의사항

  • 첫 출시 버전은 투명도가 없는 #RGB 또는 #RRGGBB만 허용합니다. 반투명 색상은 먼저 실제 합성 배경을 정해야 합니다.
  • 4.5:1은 일반 본문 AA에 적용되고, 3:1은 큰 글자 AA에 적용되며, 7:1은 일반 본문 AAA의 참고 기준입니다. 글자 크기, 글자 굵기 및 텍스트가 아닌 요소의 대비도 확인해야 합니다.
  • 이 도구는 단색 한 쌍만 계산하며, 그라데이션, 이미지, 그림자, 글꼴 렌더링 또는 복잡한 배경은 시뮬레이션하지 않습니다.

자주 묻는 질문

4.5:1은(는) 무슨 뜻인가요?

일반 본문 텍스트에 대한 WCAG의 AA 최소 대비 기준이며, 큰 글자 본문에 대한 AA 기준은 3:1입니다.

투명한 색상은 왜 직접 판단할 수 없나요?

투명한 전경 또는 배경의 최종 색상은 합성 순서와 배경 이미지에 따라 달라지므로, 실제로 표시되는 단색을 먼저 확인하는 것이 더 확실합니다.

대비 기준을 통과하면 반드시 접근성이 보장되나요?

반드시 그렇지는 않습니다. 글꼴 크기, 글꼴 굵기, 상태, 포커스, 비텍스트 구성 요소, 이미지 배경 및 실제 기기에서의 표시 결과도 확인해야 합니다.

페이지 피드백문제를 발견했거나 개선 제안이 있으신가요?
피드백 기능은 온라인 버전에서 사용해야 합니다

온라인 버전에서 JavaScript를 활성화한 후 제출해 주세요. 현재 도구나 사례의 로컬 기능에는 영향이 없습니다.

온라인 버전으로 피드백 보내기