시각적 계층
다람쥐 헌 쳇바퀴에 타고파. 가독성은 접근성에 필수적입니다.
대비 검사기는 전경색과 배경색 간의 휘도 차이를 측정하는 접근성 도구입니다. 대비 비율을 계산하고 색상 조합이 WCAG 2.1 표준을 충족하는지 평가합니다. Color Taste의 대비 검사기는 AA 및 AAA 수준에 대한 즉각적인 통과/실패 결과와 함께 요구 사항을 충족하지 못할 경우 자동 수정 제안을 제공합니다.
색상이 WCAG AA 표준을 충족하는지 확인하세요: 일반 텍스트의 경우 4.5:1, 큰 텍스트 및 UI 구성 요소의 경우 3:1.
더 엄격한 AAA 표준을 확인하세요: 일반 텍스트의 경우 7:1, 큰 텍스트의 경우 4.5:1.
일반 텍스트, 큰 텍스트(18pt 이상), 버튼, 입력 테두리, 아이콘 및 기타 UI 요소의 대비를 테스트하세요.
첫 번째 입력 필드에 텍스트/전경색을 HEX, RGB 또는 HSL 형식으로 입력하거나 붙여넣으세요.
두 번째 필드에 배경색을 입력하세요. 실시간 미리보기가 업데이트되는 것을 확인할 수 있습니다.
대비 비율이 자동으로 계산됩니다. 녹색 체크 표시는 통과, 빨간색 X 표시는 WCAG 수준 실패를 나타냅니다.
조합이 실패하면 자동 수정 제안을 클릭하여 디자인 의도를 유지하면서 색상을 조정하세요.
AA 및 AAA 표준 모두에 대한 통과/실패 결과와 함께 실시간 대비 비율 계산을 제공합니다.
대비가 실패하면 접근성 요구 사항을 충족하기 위해 색상을 최소한으로 조정하는 스마트 제안을 받으세요.
다양한 텍스트 크기에 대한 실시간 미리보기로 배경색 위에 텍스트가 어떻게 보이는지 정확히 확인하세요.
선호하는 색상 형식으로 작업하세요. 검사기가 모든 변환을 자동으로 처리합니다.
디자인 과정에서 접근성을 확인하세요.
코드 배포 전에 대비를 검증하세요.
토큰 팔레트가 WCAG 표준을 충족하는지 확인하세요.
대규모로 대비 문제를 감사하고 수정하세요.
WCAG 2.1은 콘텐츠 유형 및 준수 수준에 따라 최소 대비 비율을 정의합니다:
일반 텍스트의 경우 4.5:1, 큰 텍스트(18pt 또는 14pt 굵게)의 경우 3:1. 이것이 가장 일반적인 준수 목표입니다.
일반 텍스트의 경우 7:1, 큰 텍스트의 경우 4.5:1. 최대 접근성을 위한 최고 표준입니다.
버튼, 입력 테두리, 아이콘 및 의미를 전달하는 모든 그래픽 요소에 대해 최소 3:1.
WCAG AA의 경우: 일반 텍스트는 최소 4.5:1, 큰 텍스트(18pt 또는 14pt 굵게)는 최소 3:1, 비텍스트 UI 구성 요소는 최소 3:1이 필요합니다.
AAA는 더 엄격한 표준입니다: 일반 텍스트의 경우 7:1, 큰 텍스트의 경우 4.5:1. 대부분의 디자인 시스템은 최소 기준으로 AA를 목표로 하며, 중요한 콘텐츠에 대해 AAA를 이상적인 목표로 삼습니다.
네. Color Taste의 대비 검사기는 HEX, RGB 및 HSL 색상 형식을 허용합니다. 어떤 형식으로든 색상을 입력하면 도구가 자동으로 변환을 처리합니다.
색상 조합이 실패하면 Color Taste는 원래 디자인 의도에 최대한 가깝게 유지하면서 WCAG 요구 사항을 충족하는 조정된 색상을 제안합니다. 제안을 클릭하여 즉시 적용하세요.
네, Color Taste의 대비 검사기는 완전히 무료입니다. 가입, 워터마크, 사용 제한이 없습니다. 필요한 만큼 많은 색상 조합을 확인하세요.