색상 대비 검사기

텍스트와 배경 색상 간의 WCAG 색상 대비율을 확인합니다.

큰 텍스트 미리보기

일반 텍스트 미리보기는 이렇게 보입니다.

대비율14.63:1
AA - 일반 텍스트통과
AAA - 일반 텍스트통과
AA - 큰 텍스트통과
AAA - 큰 텍스트통과

색상 대비 검사기 정보

텍스트와 배경 색상 조합이 WCAG 2.1 접근성 대비 요구사항을 충족하는지 확인합니다. AA는 권장 최소 표준이며, AAA는 더 나은 가독성을 위한 강화 표준입니다.

이 도구란?

전경(텍스트)과 배경 색상 조합이 WCAG 2.1 접근성 대비 표준을 충족하는지 확인합니다. 대비율을 즉시 확인하고 AA 및 AAA 준수 수준에 대한 통과/실패 결과를 확인하세요.

사용 방법

  1. 전경(텍스트) 색상의 16진수 값을 선택하거나 입력하세요.
  2. 배경 색상의 16진수 값을 선택하거나 입력하세요.
  3. 실시간 미리보기와 각 WCAG 수준에 대한 통과/실패 결과를 확인하세요.

주요 활용 사례

활용 팁

자주 묻는 질문

WCAG AA와 AAA 준수의 차이는 무엇인가요?

AA는 대부분의 웹사이트가 충족해야 하는 최소 표준이며 일반 텍스트에 대해 4.5:1 대비 비율이 필요합니다. AAA는 최대 가독성이 중요한 콘텐츠에 사용되는 7:1을 요구하는 더 엄격한 표준입니다.

큰 텍스트에 낮은 필수 대비 비율이 있는 이유는 무엇인가요?

더 큰 텍스트(18pt+ 정규, 14pt+ 굵음)는 낮은 대비에서도 읽기가 더 쉬우므로 WCAG는 일반 텍스트와 비교하여 AA 준수를 위해 감소된 3:1 최소 비율을 설정합니다.

대비 비율이 실제로 계산되나요?

WCAG 공식을 기반으로 두 색상의 상대 휘도를 계산한 다음 1:1(동일한 색상, 대비 없음)에서 21:1(최대 대비, 검은색 흰색)까지의 비율로 표현됩니다.

내 색상 조합이 대비 검사에 실패한다면?

텍스트 색상을 어둡게, 배경을 밝게, 또는 큰 텍스트 임계값 아래로 떨어지는 텍스트 크기를 늘려 더 낮은 필수 비율을 맞도록 시도합니다.

내가 테스트한 색상이 어디에도 전송되나요?

아니요. 대비 비율이 표준 WCAG 공식을 사용하여 브라우저에서 로컬로 계산됩니다——색상 데이터가 전송되거나 저장되지 않습니다.

텍스트와 배경 색상 간 WCAG 색상 대비율을 확인하세요. AA/AAA 접근성 준수 여부를 무료로 즉시 확인할 수 있습니다.