아래에 색상 조합을 입력하여 색상 대비 검사기로 테스트하고 접근성 표준을 충족하는지 즉시 확인하세요.
Preview
Normal Text (16px)
Large Text (24px)
Contrast Ratio
21.00:1
WCAG Compliance
Normal Text
✓ AA Pass
✓ AAA Pass
Large Text (18pt+ or 14pt+ bold)
✓ AA Pass
✓ AAA Pass
UI Components & Graphics
✓ AA Pass
WCAG Standards
Normal Text
- AA: 4.5:1 minimum
- AAA: 7:1 minimum
Large Text
- AA: 3:1 minimum
- AAA: 4.5:1 minimum
UI Components
- AA: 3:1 minimum
Common Combinations
Black on White
White on Blue
White on Dark Gray
색상 대비 검사기 작동 방식
RGB 16진수 값을 사용하여 전경 및 배경 색상을 입력하거나 색상 선택 도구를 사용하여 직접 선택하세요.
- 전경색의 투명도를 변경하려면 알파를 조정하세요.
- 밝기 슬라이더를 사용하여 색상을 더 밝거나 어둡게 만듭니다.
그런 다음 우리 도구는 명암비를 계산하고 이를 WCAG 지침과 비교하여 확인합니다.
- WCAG 2.0 레벨 AA
- 일반 본문 텍스트의 경우 최소 4.5:1
- 큰 텍스트의 경우 최소 3:1
- WCAG 2.1(UI 및 그래픽)
- 아이콘, 테두리 및 기타 인터페이스 구성요소는 최소 3:1
- WCAG 레벨 AAA
- 일반 텍스트의 경우 최소 7:1
- 큰 텍스트의 경우 최소 4.5:1
큰 텍스트는 다음 중 하나를 의미합니다.
- 14pt(약 18.66px) 굵게 또는
- 18pt(약 px) 이상 더 큰
색상 선택기의 스포이드를 사용하면 화면의 모든 항목에서 정확한 색상을 얻을 수 있습니다.
눈에 띄기 위해 색상에만 의존하는 링크의 경우 색상 대비 검사기를 사용하여 접근성 표준을 충족하고 모든 사람이 쉽게 읽을 수 있는지 확인하세요.