색상 변환기 (HEX · RGB · HSL)
HEX·RGB·HSL·OKLCH·CMYK(알파 포함) 색상을 변환하고 가장 가까운 CSS 색 이름까지 — 붙여넣기·슬라이더·실시간 미리보기. 무료, 브라우저 처리.
CSS 색 이름도 입력할 수 있어요 (예: rebeccapurple).
#5b8cffrgb(91, 140, 255)hsl(222, 100%, 68%)hsv(222, 64%, 100%)oklch(66.2% 0.179 264.6)cmyk(64%, 45%, 0%, 0%)🔒 브라우저에서 모두 변환되며 업로드되지 않습니다.
색상 형식 변환
색을 고르거나 HEX·rgb()·hsl()·oklch()·cmyk() 값을 붙여넣으면 나머지 형식을
즉시 보여주고, 색상 견본과 R/G/B·H/S/L 슬라이더로 미세 조정할 수 있습니다. 출력에는 Tailwind v4·shadcn
같은 최신 디자인 시스템이 쓰는 지각 기반 형식 OKLCH(CSS Color 4)가 포함됩니다. 알파 값을
더하면 rgba()·hsla()·oklch(… / a)·8자리 HEX를 출력합니다. 각 형식은
클릭 한 번으로 복사됩니다. CSS·디자인 작업에 유용하며 모든 처리는 브라우저에서 이뤄집니다.
자주 묻는 질문
어떤 형식을 지원하나요?
HEX(3·6·8자리)·rgb()/rgba()·hsl()/hsla()·oklch()·cmyk()를 지원합니다. 입력·붙여넣기하거나 슬라이더를 움직이면 나머지가 즉시 갱신됩니다.
CMYK를 HEX로 변환할 수 있나요?
네 — cmyk() 값(예: cmyk(0%,100%,100%,0%))을 붙여넣으면 HEX·RGB·HSL로 변환됩니다. ICC 프로파일 없는 표준 공식을 쓰므로 인쇄 교정용이 아니라 화면 근사값으로 보세요.
OKLCH도 지원하나요?
네. oklch() 행에 현재 색을 CSS Color 4 OKLCH로 보여주며, oklch() 값을 붙여넣어 HEX/RGB로 되돌릴 수도 있습니다. 이 도구는 sRGB에서 동작하므로 넓은 색영역(wide-gamut) OKLCH 값은 가장 가까운 sRGB 색으로 조정됩니다.
투명도(알파)도 되나요?
네. 알파 슬라이더를 조절하면 rgba()·hsla()·oklch(… / a)·8자리 HEX를 출력하고, 미리보기는 체커보드 위에 투명도를 보여줍니다.
CSS용으로 복사할 수 있나요?
네. 각 값에 복사 버튼이 있어 스타일시트에 바로 붙여넣을 수 있습니다.