색상 코드 변환기

코드 하나 넣으면 HEX·RGB·HSL 로 바꿔 주고, 글자색으로 써도 되는지 대비율까지 알려 줍니다.

대비율 읽는 법

WCAG 2 는 본문 글자에 배경 대비 4.5:1 이상을 AA 적합 기준으로, 7:1 이상을 AAA 기준으로 정합니다. 18pt 이상 큰 글자나 굵은 14pt 는 3:1 이면 AA 입니다. (WCAG 는 W3C 의 웹 접근성 지침 명칭입니다.) 파란 #2457E6 은 흰 배경에서 약 5.9:1 로 본문에도 쓸 수 있고, 검정 배경에선 3.6:1 이라 큰 글자에만 맞습니다.

HSL 이 편한 이유

HSL 은 색상(H)·채도(S)·밝기(L)라서 같은 색을 밝게·어둡게 만들 때 L 만 바꾸면 됩니다. 아래 밝기 단계가 그 결과입니다. 버튼을 누르면 그 색이 입력칸으로 들어갑니다.

받아들이는 형식

#RGB, #RRGGBB, #RRGGBBAA, rgb()/rgba(), hsl()/hsla(), '36, 87, 230' 같은 숫자 셋, 그리고 흔한 CSS 색 이름(navy, coral 등 50여 개).

자주 묻는 질문

입력이 서버로 가나요?

아니요. 변환과 대비 계산은 브라우저 안에서만 일어납니다.

투명도는

#RRGGBBAA 나 rgba() 로 넣으면 HEX·RGB 출력에 반영됩니다. 대비율은 투명도를 무시하고 불투명한 색으로 계산합니다.

CMYK 는

인쇄용 CMYK 는 색 프로파일에 따라 값이 달라 이 도구에서는 다루지 않습니다.