색상 코드 변환기

HEX, RGB, HSL 색상 코드를 실시간으로 변환하세요.

hsl(217, 91%, 60%)

색상 코드 변환기는 HEX·RGB·HSL·CMYK를 양방향 변환해요. 웹 디자인·CSS·인쇄·브랜드 가이드 정리에 매번 손이 가요.

각 모델이 쓰이는 곳

- **HEX (#FF5733)**: 웹·앱 표준. 가장 짧고 보편적 - **RGB (255,87,51)**: 디지털 화면. 알파(투명도) 표현 가능 → RGBA - **HSL (12°,100%,60%)**: 디자이너 친화적. 색조·채도·명도 직관적 - **CMYK (0,66,80,0)**: 인쇄 전용. RGB와 색역(gamut)이 달라서 변환 시 일부 색 사라짐 - **HSV / HSB**: Photoshop·Figma 색 선택기 기본

RGB ↔ CMYK 변환의 한계

RGB(빛 합성)와 CMYK(잉크 흡수)는 표현 가능한 색 범위(gamut)가 달라요. 형광 색·진한 청록은 RGB에서만 표현 가능하고 인쇄하면 흐려져요. 해결 방법: - **소프트 프루핑**: Photoshop View → Proof Setup → Working CMYK로 인쇄 모습 미리보기 - **ICC 프로필 적용**: 프린터·잉크에 맞춘 변환 프로필 사용 - **브랜드 컬러는 별도 spec**: HEX·CMYK·Pantone 따로 정의해 두기

접근성 — 색 대비 비율

WCAG 가이드는 텍스트 가독성을 위한 최소 대비를 정의해요. - **AA 일반 텍스트**: 4.5:1 이상 - **AA 큰 텍스트(18pt+ / 14pt+ 굵게)**: 3:1 - **AAA 일반 텍스트**: 7:1 흰 배경의 회색 텍스트(#999)는 대비 2.85:1로 AA 미달이에요. 본문은 #555 이하(#444 이하 권장).

자주 묻는 질문

HEX 3자리 #FFF는 #FFFFFF 같나요?

네. CSS는 3자리 HEX를 6자리로 자동 확장해요(#F → #FF). 다만 #ABC = #AABBCC라서 임의 색은 표현 못 해요.

RGB와 sRGB 차이는?

RGB는 추상적 모델, sRGB는 구체 색공간(IEC 61966-2-1)이에요. 웹은 사실상 sRGB가 표준이고, 광고·영상은 P3·Rec.2020 같은 더 넓은 색공간을 써요.

투명도는 어떻게 표현해요?

RGBA로 0~1 알파, 또는 8자리 HEX(#RRGGBBAA)로 표현. CSS는 둘 다 지원해요. `rgba(255,87,51,0.5)` ≡ `#FF573380`.