COLOR
색상 변환기
HEX, RGB, HSL, CMYK를 변환하고 빠르게 팔레트를 만듭니다.
색상 변환기
HEX, RGB, HSL, CMYK를 변환하고 빠르게 팔레트를 만듭니다.
3자리 또는 6자리 HEX 값을 지원합니다.
0-255 숫자 3개나 rgb() 문자열을 사용할 수 있습니다.
색상각 0-360, 채도/명도 0-100% 범위입니다.
시안, 마젠타, 옐로, 블랙을 %로 입력하세요.
미리보기
#3498DB
RGB: 52, 152, 219
휘도 0.283
밝은 배경에는 진한 글자, 어두운 배경에는 밝은 글자를 사용하세요.
현재 색상에서 밝기만 조정한 다섯 가지 톤을 제공합니다.
33%
#19608F
RGB 25, 96, 143
43%
#217DBA
RGB 33, 125, 186
53%
#3398DB
RGB 51, 152, 219
63%
#5FAEE3
RGB 95, 174, 227
73%
#8AC4EA
RGB 138, 196, 234
What
색상 변환기 정의
색상 변환기는 HEX, RGB, HSL 등 색상 포맷을 상호 변환합니다.
Cases
대표 활용 사례
1
디자인 값을 CSS로 변환
2
툴 간 색상 맞추기
3
포맷 간 빠른 비교
How To
색상 값을 변환하는 방법
HEX/RGB/HSL/CMYK를 서로 변환하는 단계별 가이드입니다.
1
형식 입력
HEX(#3498db) 또는 RGB/HSL/CMYK 값을 입력합니다.
2
자동 변환 확인
다른 형식의 값이 자동으로 계산되어 표시됩니다.
3
복사 및 활용
원하는 형식을 복사해 코드/디자인 툴에 붙여넣습니다.
Knowledge
색상 이론 알아보기
RGB란?
RGB는 빨강(Red), 초록(Green), 파랑(Blue) 세 가지 빛의 조합으로 색상을 표현하는 가산혼합 색상 모델입니다. 각 채널은 0~255 값을 가지며, 모니터, TV, 스마트폰 등 디지털 화면에서 사용됩니다. (0,0,0)은 검정, (255,255,255)는 흰색입니다.
HEX란?
HEX는 RGB 값을 16진수로 표기한 형식입니다. #RRGGBB 형태로 작성하며, 웹 개발에서 CSS 색상 지정에 가장 널리 사용됩니다. 예를 들어 #FF0000은 빨강, #00FF00은 초록, #0000FF는 파랑입니다. 3자리 축약형(#RGB)도 지원됩니다.
HSL이란?
HSL은 색상(Hue), 채도(Saturation), 명도(Lightness)로 색을 표현합니다. 색상은 0~360° 색상환 각도, 채도와 명도는 0~100% 범위입니다. 사람이 색을 인식하는 방식과 가까워 색상 조정이 직관적입니다.
CMYK란?
CMYK는 시안(Cyan), 마젠타(Magenta), 옐로(Yellow), 블랙(Key/Black)의 감산혼합 색상 모델입니다. 잉크를 겹쳐 색을 만드는 인쇄 분야에서 사용됩니다. 화면용 RGB와 달리 잉크 배합으로 색이 결정되므로 인쇄 전 반드시 CMYK로 변환해야 합니다.
RGB와 CMYK의 차이
RGB는 빛을 더해 밝아지는 가산혼합(화면용), CMYK는 잉크를 더해 어두워지는 감산혼합(인쇄용)입니다. RGB는 더 넓은 색역을 표현할 수 있어 일부 선명한 색상은 CMYK로 정확히 재현되지 않습니다. 디지털 작업 후 인쇄할 때는 색상 차이를 미리 확인하세요.
색상 대비와 접근성
웹 접근성(WCAG)에서는 텍스트와 배경 간 충분한 명암비를 권장합니다. AA 기준은 일반 텍스트 4.5:1, 큰 텍스트 3:1 이상입니다. 밝은 배경엔 어두운 글자, 어두운 배경엔 밝은 글자를 사용해 가독성을 높이세요.
FAQ
색상 변환기 FAQ
어떤 형식을 변환할 수 있나요?
3/6자리 HEX, RGB 숫자, HSL 색상각/채도/명도, CMYK % 값을 모두 처리합니다.
팔레트는 어떻게 만들어지나요?
기준 색상의 HSL 명도를 주변으로 이동해 다섯 개의 스와치를 생성합니다.
데이터가 서버로 전송되나요?
아니요. 모든 변환과 팔레트 계산은 브라우저 안에서만 실행됩니다.