색상 코드 변환 — HEX·RGB·HSL·CMYK, 명도 대비 검사
디자인 시안의 색을 CSS 코드로 옮기거나, 버튼 글자가 잘 읽히는지 접근성 기준으로 확인할 때 씁니다.
파일이 서버로 전송되지 않습니다 — 이 기기의 브라우저 안에서만 처리
명도 대비 검사 (WCAG)
이 색을 글자색으로 썼을 때 배경과의 대비율입니다. 본문 AA 4.5:1, AAA 7:1 / 큰 글자(24px 또는 굵은 18.7px 이상) AA 3:1, AAA 4.5:1.
가나다 Aa 123
흰 배경6.29:1
✓ AA 본문 ✗ AAA 본문 ✓ AA 큰 글자 ✓ AAA 큰 글자
가나다 Aa 123
검은 배경3.34:1
✗ AA 본문 ✗ AAA 본문 ✓ AA 큰 글자 ✗ AAA 큰 글자
가나다 Aa 123
직접 고른 색 #FFFFFF6.29:1
✓ AA 본문 ✗ AAA 본문 ✓ AA 큰 글자 ✓ AAA 큰 글자
밝게·어둡게 단계
칸을 누르면 HEX 코드가 복사됩니다.
광고
색상 변환 사용법
- 1색상 코드를 입력하거나 색 선택기로 고릅니다(#4f46e5, rgb(), hsl() 모두 가능).
- 2모든 형식의 코드가 나오고, 누르면 복사됩니다.
- 3흰색·검은색·직접 고른 색과의 대비율과 WCAG 통과 여부, 밝게·어둡게 단계를 확인합니다.
자주 묻는 질문
대비율은 얼마 이상이어야 하나요?
WCAG AA는 본문 글자 4.5:1, 큰 글자 3:1 이상, AAA는 각각 7:1, 4.5:1 이상입니다.
CMYK 값이 인쇄소와 달라요.
여기의 CMYK는 단순 수학 변환입니다. 실제 인쇄는 용지·잉크 프로파일에 따라 달라지므로 인쇄소 기준을 따르세요.
광고