웹 개발
Color Converter
HEX, RGB, HSL, HSV/HSB, CMYK 간에 색상을 변환합니다 — 아무 필드에나 값을 입력하면 나머지가 즉시 업데이트됩니다.
The same color can be written differently depending on context: HEX and RGB are convenient for code, HSL is intuitive for picking a hue and lightness, and CMYK is for print. This tool converts between all of them at once.
How to use it
- Enter a value in any field (HEX, RGB, HSL, HSV/HSB, or CMYK) — every other format updates instantly.
- The "random color" button generates a random hue for quickly browsing a palette.
- Copy the format you need with one click to paste into CSS or a graphics editor.
Which format to use when
- HEX — a compact notation for CSS and design systems (#4453b8).
- RGB — when you need transparency via rgba() or programmatic access to individual color channels.
- HSL — the easiest for manual tuning: lighten or darken a color by changing just one value.
- CMYK — for materials headed to print, where colors mix subtractively, unlike the additive RGB used on screens.
Things to keep in mind
CMYK on screen is only an approximation — the exact printed color depends on the printer, paper, and color profile used.
Conversion between color spaces isn't always exact for extreme, highly saturated colors, due to differences in gamut coverage between models.
자주 묻는 질문
변환기는 알파(투명도) 채널을 어떻게 처리하나요?
알파는 HEX(#RRGGBBAA), RGBA, HSLA에서 지원됩니다 — 입력한 값은 투명도를 지원하는 다른 형식으로 전달되며, 일반 CMYK처럼 알파 채널이 없는 형식은 이를 그냥 무시합니다.
CMYK로 변환했다가 다시 HEX로 돌아오면 값이 약간 바뀌는 이유는 무엇인가요?
CMYK는 RGB와의 변환에 단일 고정 공식이 없는 인쇄 지향적 모델이므로, 왕복 변환 시 값이 1~2 단위의 반올림 오차로 이동할 수 있습니다. 시각적으로는 색상이 실질적으로 동일하게 유지됩니다.
제 색상 데이터가 어딘가로 전송되나요?
아니요, 모든 변환은 JavaScript를 사용해 브라우저 내에서 로컬로 이루어집니다 — 서버에 업로드되는 것은 없습니다.
OKLCH는 HSL과 어떻게 다른가요?
OKLCH는 명도(L), 채도(C), 색상(H)으로 색을 표현하지만, HSL과 달리 인간의 눈이 실제로 명도를 어떻게 인식하는지 고려합니다 — OKLCH에서 L을 바꿔도 지각되는 채도가 왜곡되지 않으므로 색조 간 전환이 더 균일하게 보입니다.
색이 "색 영역 밖(out of gamut)"이라는 것은 무슨 뜻인가요?
OKLCH나 Display P3 같은 넓은 색 공간의 일부 색은 sRGB만 지원하는 디스플레이에서는 물리적으로 재현할 수 없습니다 — 이 경우 브라우저는 지원되는 색 영역 안에서 가장 가까운 색으로 대체합니다.