색상 도구

색상 변환기— 하나의 색, 일곱 형식

HEX, RGB, HSL, HSV, CMYK, Lab, OKLCH 중 하나를 입력하세요.

자동 변환

색상 입력

기본 색상 선택기

색상 값은 이 브라우저 탭에서만 처리하며 업로드하거나 저장하지 않습니다.

변환 결과

HEX#3B82F6

RGBrgb(59 130 246)

HSLhsl(217.2 91.2% 59.8%)

HSVhsv(217.2, 76%, 96.5%)

CMYKcmyk(76%, 47.2%, 0%, 3.5%)

Lablab(54.619% 8.771 -65.783)

OKLCHoklch(62.308% 0.188 259.81)

sRGB 색역 안에 있습니다.

sRGB와 OKLCH는 D65, CSS Lab은 D50을 사용합니다. CMYK는 ICC 프로필이 없는 공식 추정치입니다.

투명도 설정

알파100%

일곱 가지 결과가 최신 상태입니다.

디자인 시안의 HEX와 CSS의 OKLCH가 같은 색인지 확인하려면 숫자뿐 아니라 색역도 봐야 합니다. 색상 변환기는 한 색의 일곱 표현을 나란히 보여 줍니다.

HEX RGB 변환, RGB HSL 변환, OKLCH 변환과 CMYK 변환을 한 화면에서 살펴보세요. 색상 변환기의 미리보기는 알파까지 반영합니다.

색상 변환기로 원본과 화면색 구분하기

색역 밖의 값도 숨기지 않습니다

색역 경계를 알리기

Lab이나 OKLCH 입력이 sRGB 밖이면 색상 변환기는 원래 값을 남기고 OKLCH 채도만 낮춰 화면용 HEX를 만듭니다. 같은 색이라고 조용히 단정하지 않습니다.

투명도를 눈으로 확인하기

4자리 또는 8자리 HEX의 알파는 바둑판 배경 위에서 보입니다. CSS 출력에는 알파가 남고 CMYK 추정치에는 포함되지 않습니다.

사용 전에 확인할 세 가지

입력 형식 확인하기

짧은 HEX와 긴 HEX, rgb(), hsl(), hsv(), cmyk(), lab(), oklch()를 읽습니다. 잘못된 값은 이전 견본을 남기되 복사는 막습니다.

알파와 색역 따로 보기

알파는 별도 슬라이더입니다. 넓은 색역의 OKLCH를 넣었다면 원래 좌표와 화면용 HEX를 비교하세요.

한 색을 설명하는 일곱 값

웹과 디자인 도구

HEX, RGB, HSL은 sRGB 기반 CSS 값이며 HSV는 디자인 도구에서 익숙한 밝기 축을 사용합니다.

지각 색 공간

CSS Lab은 D50, OKLCH는 D65 백색점을 사용합니다. 색역 밖 원본은 화면용 근사색과 구분합니다.

인쇄용 참고치

CMYK는 sRGB 채널의 공식 추정치입니다. 실제 인쇄에는 종이, 잉크, ICC 프로필이 필요합니다.

변환의 실제 한계

색역 밖 색은 무손실이 아닙니다: Lab 또는 OKLCH에서 sRGB로 정확히 옮길 수 없는 색은 채도를 낮춰 미리보기를 만듭니다. 원본 값은 유지됩니다.
CMYK는 인쇄 교정 값이 아닙니다: 프린터 프로필과 검정 생성 설정이 없어 네 백분율은 대략적인 비교용입니다.
hsv()와 cmyk()는 도구 표기입니다: 두 함수는 일반 CSS 색상 선언으로 약속하지 않습니다. CSS에서는 HEX, rgb(), hsl(), lab(), oklch() 행을 사용하세요.
한 번에 한 색만 처리합니다: 이미지 색 추출, 팔레트 생성, 대비 점수, 저장 및 공유 URL은 제공하지 않습니다.

색상 변환기 자주 묻는 질문

HEX 코드를 RGB로 어떻게 변환하나요?

HEX 값을 입력하면 RGB 행에 0~255 범위의 세 채널이 표시됩니다. 짧은 HEX는 각 자리를 확장합니다.

HEX는 RGB와 같은 것인가요?

sRGB 안에서는 두 형식이 같은 채널을 다른 방식으로 적습니다. HEX는 16진수이고 RGB는 10진수입니다.

HEX 색상 코드는 어떻게 읽나요?

HEX에서 RR GG BB의 두 글자씩이 빨강, 초록, 파랑 채널입니다. 끝의 추가 두 자리는 알파입니다.

OKLCH는 무엇인가요?

OKLCH는 눈에 느껴지는 밝기와 채도를 다루기 쉽도록 설계된 색 공간입니다.

색상 값이 서버로 전송되나요?

아니요. 값의 해석과 변환은 브라우저에서만 실행됩니다.

다른 색상 질문이 있나요?

색상 변환기 사용하기

색역 경고를 확인한 뒤 필요한 CSS 값을 복사하세요.

도구로 돌아가기 모든 도구 보기

색상 변환기— 하나의 색, 일곱 형식