RGB는 0과 255 사이의 세 개의 10진수 채널을 제공합니다. 이를 HEX로 변환하면 각 채널을 두 자리 16진수로 바꿔 전체 색을 한 개의 간결한 토큰에 담을 수 있으며 모든 브라우저, 디자인 도구, 스타일 가이드에서 이해합니다.
RGB에서 HEX로 어떻게 변환되는지
- 빨간 채널을 16으로 나눠보세요: 몫이 첫 자리 숫자이고 나머지가 두 번째 숫자입니다.
- 숫자 10부터 15는 문자 A에서 F로 씁니다 — 255는 FF가 됩니다.
- 녹색과 파랑도 같은 방식으로 반복하되, 한 자리인 경우 앞에 0을 채우세요: 5는 05가 됩니다.
- 세 쌍을 이어 붙이고 앞에 #를 붙입니다.
작동 예시
RGB rgb(79, 70, 229)=HEX #4F46E5
채널 값이 0에서 255 사이의 정수일 때 정확합니다. rgb(79.5, 70, 229)처럼 소수값이 있으면 HEX는 중간값을 저장할 수 없으니 먼저 가장 가까운 정수로 반올림됩니다.
RGB과(와) HEX 설명
RGB이(가) 무엇인가요?
RGB는 색을 빛의 세 채널—빨강, 초록, 파랑—로 표현하며 각 채널은 0에서 255 사이 값입니다. 화면 작동 방식을 그대로 반영해 세 채널이 모두 255이면 흰색, 모두 0이면 검은색이 됩니다. 색으로 계산할 필요가 있을 때는 RGB가 적합하며, rgba()는 투명도를 추가합니다.
- 구문:
- rgb(R, G, B)
- 범위:
- 채널별 0–255
- 적합한 용도:
- 코드, 캔버스, rgba()로 투명도 처리
HEX이(가) 무엇인가요?
HEX 코드는 앞의 # 뒤에 오는 여섯 자리 16진수로 색의 빨강, 초록, 파랑 채널을 저장합니다. 두 자리씩이 각 채널을 나타내며 00(없음)에서 FF(최대)까지 표현해 RGB와 같은 1,670만 색을 더 짧게 표기합니다. HEX는 CSS, 디자인 도구, 브랜드 가이드라인에서 기본 표기입니다.
- 구문:
- #RRGGBB
- 범위:
- 채널별 00–FF
- 적합한 용도:
- CSS, 디자인 인수인계, 브랜드 가이드라인
RGB to HEX 참조표
가장 흔한 CSS 색상들을 RGB에서 HEX로 변환한 표입니다.
| 색상 | RGB | HEX |
|---|---|---|
| black | rgb(0, 0, 0) | #000000 |
| white | rgb(255, 255, 255) | #FFFFFF |
| red | rgb(255, 0, 0) | #FF0000 |
| lime | rgb(0, 255, 0) | #00FF00 |
| blue | rgb(0, 0, 255) | #0000FF |
| yellow | rgb(255, 255, 0) | #FFFF00 |
| orange | rgb(255, 165, 0) | #FFA500 |
| teal | rgb(0, 128, 128) | #008080 |
| purple | rgb(128, 0, 128) | #800080 |
| gray | rgb(128, 128, 128) | #808080 |