무료 HEX RGB 변환기 - 색상 코드 변환기 및 색상 선택 도구

HEX를 RGB로 변환하기

이 도구는 HEX 색상 코드를 읽어 같은 색을 RGB, HSL, CMYK, 8자리 HEX/RGBA 값으로 함께 보여주며, 실시간 색상 미리보기와 대비 미리보기, 지각 밝기 값도 함께 표시합니다. 코드를 입력하거나 붙여넣거나 색상 선택기로 고르면 모든 형식이 한 번에 갱신됩니다.

변환 원리

6자리 HEX 코드는 빨강, 초록, 파랑을 나타내는 00부터 FF까지(10진수로 0부터 255까지)의 2자리 쌍 세 개로 나뉩니다. 3자리 축약형은 각 자릿수를 먼저 두 번 반복하므로 #E67은 #EE6677이 된 뒤 같은 방식으로 나뉩니다. 이 RGB 값에서 HSL은 가장 밝은 채널과 가장 어두운 채널의 평균으로 명도를, 둘의 차이로 채도를, 채널의 순서로 색상을 구합니다. CMYK는 참고용으로, 세 채널 중 가장 큰 값에서 K를 구하고 시안, 마젠타, 노랑을 그 기준으로 조정해 계산합니다. 지각 밝기는 ITU-R BT.601 가중치를 사용해 R×299 + G×587 + B×114를 1000으로 나눈 값이며, 128을 넘으면 밝음, 그 이하면 어두움으로 표시되고 이는 대비 미리보기의 글자 색도 결정합니다. 같은 입력란은 HEX 대신 rgb(r, g, b) 형식의 문자열을 직접 입력해도 인식하며, 색상 선택기에서 고를 때마다 HEX 입력란도 자동으로 갱신됩니다. 코드를 해석할 수 없으면 도구는 색을 추측하는 대신 입력란 아래에 오류 메시지를 표시합니다. 변환된 각 값에는 자체 복사 버튼이 있어 클릭하면 잠시 체크 표시로 바뀌며, 이를 통해 RGB, CMYK, CSS 줄 중 원하는 것만 나머지를 건드리지 않고 복사할 수 있습니다. 밝기 점수와 HSL의 각 수치는 모두 소수점 없이 정수로 반올림되어 화면에 표시됩니다.

계산 예시

#E85D75를 예로 들어보겠습니다. 자리쌍을 풀면 R=232, G=93, B=117이므로 RGB(232, 93, 117)입니다. 가장 밝은 채널과 가장 어두운 채널의 평균은 명도 64%, 둘의 차이는 채도 75%, 색상 각도는 350도로 HSL(350, 75%, 64%)가 됩니다. 같은 RGB 값을 CMYK 공식에 넣으면 cmyk(0%, 60%, 50%, 9%)가 나옵니다. 8자리 형식은 #E85D75FF이고, CSS 줄은 color: #E85D75;입니다. 밝기는 255 중 137로 128 기준선을 넘으므로 도구는 이 색을 밝음으로 표시하고 대비 미리보기에서 검은 글자로 전환합니다.

출력 예시

Input:  #E85D75

Output: {
  "rgb":  "rgb(232, 93, 117)",
  "hsl":  "hsl(350, 75%, 64%)",
  "cmyk": "cmyk(0%, 60%, 50%, 9%)",
  "hex8": "#E85D75FF",
  "css":  "color: #E85D75;"
}