bal.pe.kr WCAG 대비 체커English

소개 · 계산 방식 · 표준 근거

마지막 업데이트 2026-07-11 · 본 페이지는 도구의 신뢰성(E-E-A-T) 정보를 담습니다.

작성 김지광 (운영자)감수 WCAG 2.1/2.2 사양 대조 검토마지막 업데이트 bal.pe.kr 마이크로 SaaS

이 도구는 무엇인가요

WCAG 색상 대비 체커는 전경색(텍스트·그래픽)과 배경색을 받아 WCAG 2.1/2.2 대비비율, 일반 텍스트·대형 텍스트·UI 요소에 대한 AA/AAA 통과 여부, 실사용 미리보기, 그리고 근접 통과 색을 제공합니다. 무료이고 가입이 필요 없으며 모든 계산은 브라우저 안에서만 수행됩니다 — 아무것도 업로드되지 않습니다.

계산 방식

  • 색 파싱: HEX(#RGB, #RRGGBB, # 유무 무관, 알파 무시), rgb()/rgba(), hsl()/hsla().
  • 상대 휘도: 각 sRGB 채널을 선형화(c ≤ 0.03928이면 c/12.92, 아니면 ((c+0.055)/1.055)^2.4)한 뒤 L = 0.2126R + 0.7152G + 0.0722B로 합산.
  • 대비비율: (밝은쪽 L + 0.05) / (어두운쪽 L + 0.05).
  • 기준: AA 4.5:1 / AAA 7:1(일반), AA 3:1 / AAA 4.5:1(대형), 3:1(UI, SC 1.4.11). 비율이 기준값 이상일 때 통과.
  • 제안: 전경의 색상·채도를 고정하고 HSL 명도를 스캔해 목표 비율을 만족하는 가장 가까운 색을 찾습니다.

표준 근거

  • WCAG 2.1 상대 휘도: w3.org/TR/WCAG21
  • WCAG 2.1 대비비율: w3.org/TR/WCAG21
  • SC 1.4.3 Contrast (Minimum, AA), 1.4.6 Contrast (Enhanced, AAA), 1.4.11 Non-text Contrast (AA)

한계

  • WCAG 2.x 알고리즘 기준이며 WCAG 3 초안(APCA)은 사용하지 않습니다.
  • 투명도(알파)는 무시합니다 — 반투명 색은 실제 배경 위에서 합성한 뒤 검사하세요.
  • 제안은 명도만 바꿉니다. 일부 목표는 색상 자체나 배경 변경이 필요합니다.
  • 자동 비율은 필요조건일 뿐 충분조건이 아닙니다 — 실제 인터페이스를 보조기술로 검증하세요.

프라이버시

색은 서버로 전송되지 않습니다. 입력값은 브라우저(localStorage)와 선택적 공유 링크(?s= 토큰)에만 저장됩니다. 계정이 없고, 사이트 광고·집계 통계 외에는 추적하지 않습니다.

운영 주체

체커 열기 →가이드 보기