RGB 조절
r59
g130
b246
HEX
#3B82F6
RGB
rgb(59, 130, 246)
HSL
hsl(217, 91%, 60%)
RGBA
rgba(59, 130, 246, 1)
🎨 색상 코드 변환기란?
색상 코드 변환기는 HEX, RGB, HSL 등 다양한 색상 형식을 상호 변환하는 온라인 도구입니다. 컬러 피커로 시각적으로 색상을 선택하거나, RGB 슬라이더로 세밀하게 조절할 수 있습니다. 웹 개발, 그래픽 디자인, UI/UX 작업에서 다양한 형식의 색상 코드가 필요할 때 유용합니다. 변환된 값은 클릭 한 번으로 복사하여 바로 사용할 수 있습니다.
📋 색상 형식 비교
| 형식 | 예시 | 특징 |
|---|---|---|
| HEX | #3B82F6 | 웹에서 가장 흔함 |
| RGB | rgb(59, 130, 246) | 빨강/초록/파랑 조합 |
| HSL | hsl(217, 91%, 60%) | 색조/채도/밝기 |
| RGBA | rgba(59, 130, 246, 1) | 투명도 포함 |
💡 색상 형식 선택 가이드
- HEX: CSS, HTML에서 가장 널리 사용, 간결한 표기
- RGB: 프로그래밍에서 색상 조작 시 직관적
- HSL: 밝기/채도 조절이 쉬워 파생색 만들기 좋음
- RGBA: 투명도가 필요한 오버레이, 그림자 등에 사용
자주 묻는 질문
HEX 코드에서 # 기호는 꼭 필요한가요?▼
CSS에서는 # 기호가 필수입니다. 일부 그래픽 소프트웨어에서는 # 없이 사용하기도 합니다. 이 도구는 둘 다 인식합니다.
HSL이 RGB보다 좋은 점은 무엇인가요?▼
HSL은 색조(H), 채도(S), 밝기(L)로 구성되어 직관적입니다. 같은 색조에서 밝거나 어두운 변형을 만들기 쉽습니다.
투명 색상은 어떻게 만드나요?▼
RGBA 형식에서 마지막 값(알파)을 0~1 사이로 조절합니다. 0은 완전 투명, 1은 완전 불투명입니다.