대비 그리드

개요 대비 그리드

색 목록의 N×N WCAG 매트릭스

모든 색 쌍을 한 그리드에 대비 비율과 함께 표시해 팔레트 전체를 한 번에 감사하세요.

셀을 클릭하면 전경 / 배경 쌍이 복사됩니다.

행은 전경색, 열은 배경색입니다. 각 셀에 그 쌍의 WCAG 비율과 본문 AA/AAA 판정이 표시됩니다.

대각선은 같은 색끼리 비교라 항상 1:1이므로 참고로 표시합니다.

출시 전 토큰 전체를 감사할 때 사용합니다. 단독으로는 괜찮아 보이지만 조합하면 실패하는 쌍, 특히 텍스트와 표면에 모두 쓰는 중간 톤 브랜드 색을 드러냅니다.

판정 라벨의 의미는?

본문 AA는 4.5:1, AAA는 7:1입니다. 큰 텍스트는 3:1과 4.5:1입니다.

대각선에 표시가 있는 이유는?

같은 색의 비율은 항상 1:1이므로 실패가 아니라 참고로 다룹니다.

다섯 색 이상 붙여넣을 수 있나요?

네. 한 줄에 한 색을 추가하면 매트릭스도 커집니다.