RGB → HEX 변환기
RGB 값을 입력하면 HEX 값이 바로 나옵니다. 계산은 브라우저 안에서 끝나며 입력값을 서버로 보내지 않습니다.
계산 방법
RGB의 각 채널(0~255)을 16진수 두 자리로 바꿔 이어 붙입니다. 한 자리가 나오면 앞에 0을 채워 두 자리로 맞춥니다. 255는 FF, 9는 09입니다.
RGB
RGB 는 화면이 색을 만드는 방식 그대로입니다. 빛 세 개를 더하며, 각각 0~255 입니다. 셋 다 0 이면 검정, 셋 다 255 면 흰색입니다. 하드웨어와 같은 구조라 정확하고 손실이 없지만, 사람이 다루기는 불편합니다. "조금만 더 따뜻하게" 하려면 두세 숫자를 동시에 바꿔야 하는데 어느 쪽으로 가야 할지가 눈에 보이지 않습니다.
HEX
HEX 는 RGB 와 똑같은 빨강·초록·파랑 세 값을 16진수로 적은 것뿐입니다. 채널 하나가 두 글자로 떨어져서 짧고 헷갈리지 않기 때문에 CSS·디자인 도구·설정 파일 어디서나 쓰입니다. 대소문자는 상관없고, #abc 는 #aabbcc 의 줄임입니다. 여덟 자리로 쓰면 마지막 두 자리가 투명도라서 #FF000080 은 반투명 빨강이 됩니다.
RGB → HEX 계산 과정
#FF6347 을 예로 실제 계산을 따라가 봅니다. 값은 이 페이지의 변환기와 같은 엔진으로 구합니다.
-
10진수를 16진수로
R 255 = 15×16 + 15 → FF G 99 = 6×16 + 3 → 63 B 71 = 4×16 + 7 → 47 -
이어 붙이기
# + FF + 63 + 47 = #FF6347
RGB → HEX 변환 예시
| Color | RGB | HEX |
|---|---|---|
| Red | rgb(255, 0, 0) |
#FF0000 |
| Tomato | rgb(255, 99, 71) |
#FF6347 |
| Orange | rgb(255, 165, 0) |
#FFA500 |
| Gold | rgb(255, 215, 0) |
#FFD700 |
| Limegreen | rgb(50, 205, 50) |
#32CD32 |
| Teal | rgb(0, 128, 128) |
#008080 |
| Dodgerblue | rgb(30, 144, 255) |
#1E90FF |
| Royalblue | rgb(65, 105, 225) |
#4169E1 |
| Blueviolet | rgb(138, 43, 226) |
#8A2BE2 |
| Hotpink | rgb(255, 105, 180) |
#FF69B4 |
자주 묻는 것
한 자리 값 앞에 0 을 붙이는 이유는?
채널 하나가 반드시 두 글자를 차지해야 문자열이 헷갈리지 않기 때문입니다. 빨강 9 는 09 입니다. 9 로 적으면 뒤의 모든 자리가 밀려 전혀 다른 색이 됩니다.
RGB 에 소수점이 있으면 어떻게 되나요?
먼저 가장 가까운 정수로 반올림합니다. HEX 는 소수를 담을 방법이 없기 때문입니다. rgb(127.6 0 0) 은 #800000 이 되고, 되돌리면 127.6 이 아니라 128 이 나옵니다.
알파벳은 대문자로 써야 하나요, 소문자로 써야 하나요?
아무거나 괜찮습니다. 브라우저와 도구 모두 같은 색으로 읽습니다. 다만 하나로 통일해 두면 버전 관리에서 변경 내역이 깔끔해집니다.