디지털 환경에서 색상을 표현하는 방식은 다양합니다. 본 컬러 피커는 가장 대중적인 4가지 형식을 지원합니다.
| 형식 | 설명 | 활용 사례 |
|---|---|---|
| HEX | #RRGGBB 형태의 16진수 코드 | HTML/CSS 표준, 가장 널리 사용됨 |
| RGB | Red, Green, Blue의 혼합 (0~255) | 포토샵, 프로그래밍 그래픽 라이브러리 |
| HSL | 색상, 채도, 명도 기반 표현 | 색상 변형(어둡게/밝게)이 필요할 때 유용 |
| HSV | 색상, 채도, 명도(Value) 표현 | 디자인 툴의 컬러 피커 로직에서 주로 사용 |
✅ 가독성을 고려한 대비(Contrast): 웹 접근성을 위해 배경색과 글자색 사이에는 충분한 대비가 필요합니다. 본 도구에서 추출한 HEX 코드를 활용해 텍스트의 가독성을 테스트해 보세요.
✅ 브랜드 일관성 유지: 프로젝트의 메인 컬러(Primary Color)를 정했다면, HSL 값에서 L(명도) 값만 조절하여 일관성 있는 서브 컬러(Hover, Active 상태 등)를 생성할 수 있습니다.
Q: HEX 코드 앞에 '#'은 왜 붙나요?
A: 브라우저가 뒤에 오는 문자를 16진수 색상 데이터로 인식하게 만드는 약속된 기호입니다. CSS 작성 시 필수입니다.
Q: RGB와 RGBA의 차이는 무엇인가요?
A: RGBA는 RGB에 'Alpha(투명도)' 값이 추가된 형태입니다. 투명한 배경을 만들고 싶을 때 사용합니다.