RGB to HEX 변환기란?
이 도구는 RGB 색상 — 빨강(R), 초록(G), 파랑(B) 세 채널이 각각 0부터 255까지의 값을 갖는 색상 — 을 #RRGGBB 형태의 16진수 색상 코드로 바꿔 줍니다. HEX 코드는 HTML, CSS, SVG는 물론 대부분의 디자인 소프트웨어에서 색을 지정하는 표준 방식이라, RGB를 HEX로 변환하는 일은 웹 개발자와 디자이너에게 거의 매일 마주치는 작업입니다.
사용 방법
0에서 255 사이의 R, G, B 값을 각각 입력하면, 변환된 HEX 코드와 함께 미리보기 색상 견본을 바로 확인할 수 있습니다. 범위를 벗어난 값은 자동으로 0~255 사이로 보정됩니다.
변환 공식 살펴보기
각 채널 값(0~255)은 두 자리의 16진수로 표현됩니다. 첫 번째 자리는 값을 16으로 나눈 몫(상위 4비트), 두 번째 자리는 16으로 나눈 나머지(하위 4비트)이며, 0~9와 A~F의 기호를 사용합니다. 이렇게 만든 세 개의 두 자리 값을 앞에 #를 붙여 이어 줍니다:
$$\text{Hex} = \text{\#} \, \overline{\text{Red}}_{16} \, \overline{\text{Green}}_{16} \, \overline{\text{Blue}}_{16}$$
예제로 이해하기
"토마토" 색을 예로 들어 봅시다. R=255, G=99, B=71입니다. R의 경우 \(255 \div 16 = 15 \to \text{F}\), 나머지 \(15 \to \text{F}\)이므로 "FF"가 됩니다. G는 \(99 \div 16 = 6 \to 6\), 나머지 \(3 \to 3\)이므로 "63"입니다. B는 \(71 \div 16 = 4 \to 4\), 나머지 \(7 \to 7\)이므로 "47"입니다. 이를 모두 이어 붙이면 #FF6347이 됩니다.
자주 묻는 질문
HEX 코드는 왜 6자리인가요? 세 채널마다 두 자리의 16진수를 사용하기 때문에(\(2 \times 3 = 6\)) 총 16,777,216가지의 색상을 모두 표현할 수 있습니다.
대문자와 소문자 중 무엇을 써야 하나요? CSS에서는 둘 다 유효합니다. 이 도구는 대문자(A~F)로 출력하지만, #ff6347과 #FF6347은 완전히 동일한 색입니다.
투명도는 어떻게 표현하나요? 기본 HEX 코드에는 알파(투명도) 채널이 없습니다. 투명도를 더하려면 8자리 #RRGGBBAA 형식을 사용하지만, 이 변환기는 가장 널리 쓰이는 6자리 코드를 출력합니다.
