개발자🔒 브라우저에서 실행

색상 대비 검사기

WCAG AA/AAA 색상 대비 준수 여부 확인

텍스트 색상

배경 색상

미리보기 제목 텍스트

이 색상으로 본문 텍스트가 어떻게 보일지입니다.

참고용 작은 텍스트입니다.

대비율

21.00:1

WCAG AA

일반 텍스트✓ 통과

큰 텍스트 (18px+)✓ 통과

UI 컴포넌트✓ 통과

WCAG AAA

일반 텍스트✓ 통과

큰 텍스트 (18px+)✓ 통과

색상 대비 검사기 정보

색상 대비 검사기는 WCAG 2.1 가이드라인에 따라 두 색상 간의 대비율을 평가합니다. 색상 조합이 일반 텍스트, 큰 텍스트, UI 컴포넌트에 대한 AA 또는 AAA 접근성 기준을 충족하는지 확인합니다. 모든 것이 브라우저에서 실행됩니다.

적절한 대비율은 얼마인가요?

WCAG AA는 일반 텍스트에 최소 4.5:1, 큰 텍스트(18px+ 또는 14px+ 굵게)에 3:1의 비율을 요구합니다. WCAG AAA는 일반 텍스트에 7:1, 큰 텍스트에 4.5:1을 요구합니다. 비율이 높을수록 가독성이 향상됩니다.

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

AA는 대부분의 웹 콘텐츠에 권장되는 최소 기준입니다. AAA는 시각 장애가 있는 사용자에게 더 나은 가독성을 제공하는 더 엄격한 기준입니다. AAA를 충족하는 것이 이상적이지만 항상 필수는 아닙니다.

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

대비율은 WCAG 2.1에서 정의한 각 색상의 상대 휘도를 사용하여 계산됩니다. 이 공식은 밝은 색상과 어두운 색상을 1:1(대비 없음)에서 21:1(검정 위 흰색의 최대 대비)까지의 척도로 비교합니다.

색상 대비 검사기 정보

자주 묻는 질문

적절한 대비율은 얼마인가요?

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

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