색상 코드 변환기

웹 접근성 기준 WCAG 2.x 에서 본문 글자가 배경과 이만큼은 달라야 시력이 약한 사람도 읽을 수 있다는 최소 기준(AA)입니다. 큰 글씨(18pt 이상, 굵게는 14pt 이상)는 3:1, 더 엄격한 AAA 는 본문 7:1·큰 글씨 4.5:1 입니다. 아이콘·입력 칸 테두리처럼 글자가 아닌 것은 3:1 입니다.

W3C 는 반올림하지 않은 값으로 판정합니다. 4.499:1 도 4.5:1 에 못 미쳐 AA 를 통과하지 못합니다. 그래서 이 도구는 소수 둘째 자리에서 버린 값을 보여 주고, 판정도 버리기 전 값으로 합니다.

둘 다 색상(H)은 같고, 밝기를 재는 방법이 다릅니다. HSL 의 L 100% 는 늘 흰색이고 50% 가 가장 선명한 색입니다. HSV 의 V 100% 는 가장 밝은 그 색이고, 포토샵·피그마 색 고르기가 HSV(HSB)를 씁니다. CSS 에는 hsl() 이 있고 hsv() 는 없습니다.

고른 색의 색상과 채도는 두고 HSL 밝기만 95% 부터 10% 까지 바꿉니다. 디자인 시스템의 50~900 단계처럼 쓰기 좋은 출발점이지만, 사람 눈이 느끼는 밝기와는 조금 다르니 최종 색은 명암비로 다시 확인하세요.

됩니다. #abc 는 #aabbcc 와 같습니다. # 없이 넣어도, rgb(…)·hsl(…)·"31, 95, 139" 처럼 넣어도 읽습니다.