색상 대비 검사기란?

색상 대비 검사기는 텍스트 색상과 배경 색상 사이의 대비율을 측정하고, WCAG 접근성 기준 충족 여부를 알려주는 도구입니다. 1:1에서 21:1 사이의 비율을 반환하며, 일반 텍스트와 큰 텍스트 모두에서 AA 및 AAA 적합·부적합 결과를 표시합니다.

사용 방법

이 검사기는 공식 WCAG 상대 휘도 공식을 사용하므로, WebAIM 검사기 및 대부분의 접근성 감사 결과와 수치가 일치합니다. 모든 계산은 브라우저에서 실행되며, 색상 데이터는 외부로 전송되지 않고 횟수 제한도 없습니다.

색상 대비 검사기는 무료인가요?

네, 회원가입 없이 완전 무료로 사용할 수 있습니다. 횟수 제한도 없으며, 모든 기능이 브라우저에서 실행됩니다.

WCAG AA 기준 대비율은 얼마인가요?

WCAG 2.1 레벨 AA는 일반 텍스트에 최소 4.5:1, 큰 텍스트에 3:1의 대비율을 요구합니다. 레벨 AAA는 일반 텍스트 7:1, 큰 텍스트 4.5:1로 기준이 더 높습니다.

큰 텍스트의 기준은 무엇인가요?

큰 텍스트는 일반 굵기에서 18pt(약 24px) 이상이거나, 굵은 글씨(bold)에서 14pt(약 18.66px) 이상인 경우입니다. 글자가 크면 가독성이 높아지므로 낮은 대비율이 허용됩니다.

대비율은 어떻게 계산되나요?

(L1 + 0.05) / (L2 + 0.05) 공식으로 계산됩니다. L1과 L2는 밝은 색상과 어두운 색상의 상대 휘도입니다. 휘도는 WCAG 2.x 정의에 따라 sRGB의 red, green, blue 채널에서 산출됩니다.

hex, RGB, 색상명을 모두 지원하나요?

네. 3자리·4자리·6자리·8자리 hex, rgb()와 rgba() 값, 그리고 「teal」과 같은 CSS 색상명을 모두 입력할 수 있습니다. 기본 색상 선택기로 직접 고를 수도 있습니다.

같은 대비율인데 결과가 다른 이유는 무엇인가요?

적합 기준은 텍스트 크기와 목표 레벨에 따라 달라집니다. 예를 들어 3.5:1은 일반 텍스트 AA 기준에는 미달이지만, 큰 텍스트 AA 기준은 충족합니다. 실제 사용하는 크기와 레벨에 맞춰 확인하세요.