RGB 값을 헥스 코드로 바꾸는 방법
R·G·B 세 값(0~255)을 각각 두 자리 16진수로 바꿔 # 뒤에 이어 붙입니다. 값을 16으로 나눠 몫이 첫째 자리, 나머지가 둘째 자리이고, 10~15는 A~F로 씁니다. 16보다 작은 값은 앞에 0을 붙입니다.
예시: rgb(46, 139, 87)
| 채널 | 값 | 계산 | HEX |
|---|---|---|---|
| 빨강(R) | 46 | 2 × 16 + 14 | 2E |
| 초록(G) | 139 | 8 × 16 + 11 | 8B |
| 파랑(B) | 87 | 5 × 16 + 7 | 57 |
따라서 rgb(46, 139, 87)는 #2E8B57이고, CSS 색 이름으로는 seagreen입니다.
RGB → HEX 변환 공식
첫째 자리 = 값 ÷ 16의 몫
둘째 자리 = 값 ÷ 16의 나머지
HEX = # + RR + GG + BB
RGBA를 HEX로 바꾸려면
투명도(0~1)에 255를 곱해 반올림한 값을 네 번째 두 자리로 붙입니다. rgba(46, 139, 87, 0.5)는 0.5 × 255 = 127.5를 반올림한 128, 16진수로 80이므로 #2E8B5780입니다. 위 입력칸에 rgba() 값을 붙여 넣으면 바로 확인할 수 있습니다.
자바스크립트·파이썬으로 RGB를 HEX로 바꾸기
// JavaScript
const toHex = (r, g, b) => "#" + [r, g, b].map(v => v.toString(16).padStart(2, "0")).join("").toUpperCase();
toHex(46, 139, 87); // "#2E8B57"
# Python
"#{:02X}{:02X}{:02X}".format(46, 139, 87) # '#2E8B57'HEX와 RGB는 같은 색인가요?
웹 색상에서는 같은 sRGB 값을 다르게 적은 것입니다. #2E8B57과 rgb(46, 139, 87)은 화면에 똑같이 보입니다. HEX는 짧고, rgb()는 읽고 고치기 쉽습니다. 두 표기 모두 W3C CSS Color Module Level 4에 정의되어 있습니다.
자주 쓰는 RGB 값과 HEX 코드표
| HEX | RGB | CMYK | 이름 | |
|---|---|---|---|---|
#FFFFFF | 255, 255, 255 | 0, 0, 0, 0 | 흰색 (white) | |
#000000 | 0, 0, 0 | 0, 0, 0, 100 | 검정 (black) | |
#FF0000 | 255, 0, 0 | 0, 100, 100, 0 | 빨강 (red) | |
#00FF00 | 0, 255, 0 | 100, 0, 100, 0 | 라임 (lime) | |
#0000FF | 0, 0, 255 | 100, 100, 0, 0 | 파랑 (blue) | |
#FFFF00 | 255, 255, 0 | 0, 0, 100, 0 | 노랑 (yellow) | |
#00FFFF | 0, 255, 255 | 100, 0, 0, 0 | 시안 (aqua) | |
#FF00FF | 255, 0, 255 | 0, 100, 0, 0 | 마젠타 (fuchsia) | |
#808080 | 128, 128, 128 | 0, 0, 0, 50 | 회색 (gray) | |
#FFA500 | 255, 165, 0 | 0, 35, 100, 0 | 주황 (orange) | |
#800080 | 128, 0, 128 | 0, 100, 0, 50 | 보라 (purple) | |
#008080 | 0, 128, 128 | 100, 0, 0, 50 | 청록 (teal) | |
#1E90FF | 30, 144, 255 | 88, 44, 0, 0 | 도저블루 (dodgerblue) | |
#2E8B57 | 46, 139, 87 | 67, 0, 37, 45 | 시그린 (seagreen) | |
#FF5733 | 255, 87, 51 | 0, 66, 80, 0 |
색상 코드 변환기 · HEX RGB 변환기 · CMYK RGB 변환기 · RGB CMYK 변환기
계산식은 W3C CSS Color Module Level 4 기준으로 2026년 10월에 확인했습니다.