HEX RGB HSL OKLCH CMYK 색상 변환기

색상 형식마다 잘하는 일

HEX와 최신 rgb() 표기는 모두 sRGB 공간의 빨강·초록·파랑 채널을 기록합니다. HEX는 짧고 디자인 전달에서 익숙하며, rgb()는 CSS를 쓰거나 투명도를 더할 때 편리합니다. 둘 사이의 변환은 색 자체를 바꾸지 않습니다.

HSL은 sRGB 색을 색상, 채도, 명도로 다시 표현합니다. 색상을 회전하거나 대략적인 변형을 만들기에는 직관적이지만 HSL 명도가 같다고 눈에 같은 밝기로 보이지는 않습니다. 같은 명도 숫자여도 노랑은 파랑보다 훨씬 밝게 느껴질 수 있습니다.

OKLCH는 지각적 밝기, 채도, 색상을 다루도록 설계됐습니다. UI 단계색과 예측 가능한 밝기 변화를 만들 때 유용합니다. 다만 브라우저와 색역을 확인해야 하며, 채도가 매우 높은 OKLCH 색은 화면이 표시할 수 있는 범위 밖일 수 있습니다.

HEX에서 CMYK로 가는 하나의 절대 변환은 없습니다. 결과는 기본 수학식이지 인쇄용 색분해가 아닙니다. 실제 인쇄는 ICC 프로필, 잉크 총량, 종이, 인쇄기, 렌더링 방식에 따라 달라지므로 인쇄소의 프로필과 교정쇄를 사용하세요.

색상 코드 변환 사용 순서

1. 디자인 도구나 스타일시트의 HEX 값을 붙여넣습니다.
2. 호환성 높은 CSS에는 RGB 또는 HSL, 지각적으로 고른 색상 단계에는 OKLCH를 복사합니다.
3. 협업자가 안정된 기준을 확인할 수 있도록 디자인 문서에는 원래 HEX도 남깁니다.
4. 인쇄 작업에서는 CMYK 행을 방향 확인용으로만 보고 인쇄소 ICC 프로필이 적용된 프로그램에서 다시 변환합니다.

같은 색의 서로 다른 표기

더 나은 결과를 위한 실무 팁

• 가능하면 스크린샷에서 찍지 말고 원래 디자인 파일의 값을 쓰세요.
• OKLCH 계산 중에는 소수 정밀도를 유지하고 표시와 전달 단계에서만 적당히 반올림하세요.
• 채도가 높은 OKLCH 값은 대상 브라우저와 화면에서 색역 잘림이 없는지 확인하세요.
• 필요한 경우 투명도는 별도로 더하세요. 이 도구는 불투명한 색끼리 비교합니다.

도구가 알 수 없는 것

계산 결과를 정확하게 사용하려면 한계도 함께 알아야 합니다.

• 입력은 HEX이며 sRGB로 간주합니다.
• CMYK 결과는 프로필 없는 근삿값으로 인쇄용 원고가 아닙니다.
• 읽기 편하게 반올림한 값은 여러 번 왕복 변환할 때 아주 작은 차이가 날 수 있습니다.

자주 묻는 질문