HEX 코드는 세 개의 8비트 숫자를 여섯 자리 16진수로 압축한 것입니다. HEX를 RGB로 변환하려면 그 6자리를 두 자리씩 나누어 각 쌍을 0에서 255 사이의 10진수로 읽으면 됩니다 — CSS, Figma, 이미지 편집기가 기대하는 값과 정확히 일치합니다.
HEX에서 RGB로 어떻게 변환되는지
- 앞의 #을 제거하고 코드가 세 자리인 경우 각 숫자를 두 번 적습니다: #f53은 #ff5533이 됩니다.
- 여섯 자리를 세 쌍으로 나눕니다 — RR, GG, BB.
- 각 쌍을 16진수로 읽어 10진수로 변환합니다: FF는 255, 57은 87, 33은 51이 됩니다.
- 세 결과를 rgb(R, G, B) 형식으로 씁니다.
작동 예시
HEX #FF5733=RGB rgb(255, 87, 51)
이 변환은 정확합니다. HEX와 RGB는 같은 sRGB 값을 다른 표기법으로 설명하므로 어느 쪽도 반올림되거나 손실되지 않습니다.
HEX과(와) RGB 설명
HEX이(가) 무엇인가요?
HEX 코드는 앞의 # 뒤에 오는 여섯 자리 16진수로 색의 빨강, 초록, 파랑 채널을 저장합니다. 두 자리씩이 각 채널을 나타내며 00(없음)에서 FF(최대)까지 표현해 RGB와 같은 1,670만 색을 더 짧게 표기합니다. HEX는 CSS, 디자인 도구, 브랜드 가이드라인에서 기본 표기입니다.
- 구문:
- #RRGGBB
- 범위:
- 채널별 00–FF
- 적합한 용도:
- CSS, 디자인 인수인계, 브랜드 가이드라인
RGB이(가) 무엇인가요?
RGB는 색을 빛의 세 채널—빨강, 초록, 파랑—로 표현하며 각 채널은 0에서 255 사이 값입니다. 화면 작동 방식을 그대로 반영해 세 채널이 모두 255이면 흰색, 모두 0이면 검은색이 됩니다. 색으로 계산할 필요가 있을 때는 RGB가 적합하며, rgba()는 투명도를 추가합니다.
- 구문:
- rgb(R, G, B)
- 범위:
- 채널별 0–255
- 적합한 용도:
- 코드, 캔버스, rgba()로 투명도 처리
HEX to RGB 참조표
가장 흔한 CSS 색상들을 HEX에서 RGB로 변환한 표입니다.
| 색상 | HEX | RGB |
|---|---|---|
| black | #000000 | rgb(0, 0, 0) |
| white | #FFFFFF | rgb(255, 255, 255) |
| red | #FF0000 | rgb(255, 0, 0) |
| lime | #00FF00 | rgb(0, 255, 0) |
| blue | #0000FF | rgb(0, 0, 255) |
| yellow | #FFFF00 | rgb(255, 255, 0) |
| orange | #FFA500 | rgb(255, 165, 0) |
| teal | #008080 | rgb(0, 128, 128) |
| purple | #800080 | rgb(128, 0, 128) |
| gray | #808080 | rgb(128, 128, 128) |