운영 중

색상 대비 검사기

광고

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 헥스 값을 사용해 전경 배경 색상을 입력하거나, 컬러 피커로 직접 선택하세요.

 당신은 할 수 있어요:

  • 알파를 조정해 전경 색상의 투명도를 조절하세요.
  • 밝기 슬라이더를 사용해 색상을 더 밝거나 어둡게 보이게 하세요.

그 후 저희 도구는 대비비를 계산하고 WCAG 지침과 대조합니다:

  • WCAG 2.0 AA 레벨
  • 일반 본문 텍스트는 최소 4.5:1
  • 큰 글씨는 최소 3:1
  • WCAG 2.1 (UI 및 그래픽)
  • 아이콘, 테두리, 기타 인터페이스 구성 요소는 최소 3:1이어야 합니다
  • WCAG AAA 레벨
  • 일반 텍스트는 최소 7:1
  • 큰 텍스트는 최소 4.5:1

큰 글씨는 다음을 의미합니다:

  • 14포인트(약 18.66 픽셀)이고 굵게 표시하거나
  • 18포인트(약 Px) 이상입니다

컬러 픽커의 스포이트를 사용해 화면의 어떤 것에서든 정확한 색상을 뽑을 수 있습니다. 실제 디자인, 버튼, 배경을 쉽게 테스트할 수 있습니다.

색상만으로 돋보이는 링크는 색상 대비 체크기를 사용해 접근성 기준을 충족하고 모두가 쉽게 읽을 수 있도록 하세요.

 
 

API 문서가 곧 제공될 예정입니다.

Documentation for this tool is being prepared. Please check back later or visit our full API documentation.