색상 변환기

HEX, RGB, HSL 값을 기준으로 빠르게 점검합니다.

HEX, RGB, HSL 형식으로 입력하면 다른 색상값과 대비를 계산합니다.
4.70vs Black
4.46vs White
대비
4.5:1 대비는 일반 본문 텍스트에서 자주 쓰는 WCAG 기준입니다. 큰 텍스트는 기준이 낮지만 약한 대비는 실제 사용자에게 여전히 부담이 됩니다.
HEX
RGB
HSL
CMYK

팔레트 제안

보색
#6366f1
#f1ef63
유사색
#63acf1
#6365f1
#a863f1
명도 단계
#6467f2
#2529ec
#1013bd
#0b0d7e
#05063f

색상 형식 이해

HEX

웹 디자인에서 널리 쓰이는 간결한 형식이며 보통 6자리 16진수 값으로 작성합니다.

RGB

빨강, 초록, 파랑 빛 값을 기준으로 하는 화면 중심 색상 모델입니다.

HSL

색상, 채도, 밝기를 기준으로 한 더 읽기 쉬운 모델입니다. 더 밝거나 어두운 UI 상태를 만들 때 유용합니다.

CMYK

시안, 마젠타, 노랑, 검정을 기준으로 한 인쇄 중심 모델입니다. 밝은 화면 색상을 인쇄로 옮길 때 약간의 차이를 예상해야 합니다.

대비

대비는 폼, 대시보드, 가격표, 오류 상태처럼 사용자가 빠르게 읽어야 하는 모든 화면에 영향을 줍니다.

자주 묻는 질문

RGB와 CMYK 변환값이 조금씩 다른 이유는 무엇인가요?

화면 색상과 인쇄 색상은 서로 다른 색상 공간에서 동작합니다. 일부 RGB 색상은 CMYK에서 정확히 재현할 수 없습니다.

WCAG 대비 점수는 무엇을 의미하나요?

전경색과 배경색을 함께 놓았을 때 얼마나 읽기 쉬운지를 측정합니다. 값이 높을수록 일반적으로 텍스트 가독성이 좋습니다.

브랜드 색상을 본문 텍스트에 그대로 써도 되나요?

권장하지 않습니다. 로고나 강조 요소에 잘 맞는 브랜드 색상도 본문에서는 대비가 부족할 수 있습니다. 가독성이 중요하면 더 강한 무채색 또는 조정한 명도 단계를 사용하세요.

도구마다 색상이 다르게 보이는 이유는 무엇인가요?

디스플레이, 색상 프로필, 브라우저, 인쇄 흐름에 따라 같은 숫자값도 다르게 렌더링될 수 있습니다. 변환값은 실무 가이드로 보고 최종 매체에서 테스트하세요.