같은 색이라도 표기법이 여럿
디자인 작업을 하다 보면 같은 색을 여러 표기법으로 마주친다. 웹 시안에서는 HEX, 인쇄 시안에서는 CMYK, 코드 작업에서는 RGB. 하나의 색을 여러 자리에 옮길 때마다 변환이 필요하다. 자주 마주치는 7가지 상황.
1. 시안 색상 코드를 코드로 옮길 때
포토샵·일러스트 시안에서 추출한 색을 웹·앱 코드로 옮기는 흐름. 보통 HEX 표기로 변환. #FFFFFF 같은 형태가 가장 흔하다.
2. RGB → HEX 변환
이미지 편집 도구에서 RGB로 추출한 색을 CSS·HTML에 쓰려면 HEX로 변환. 단순 산술이지만 매번 손으로 환산하면 시간이 든다.
3. HEX → CMYK 변환
웹 시안을 인쇄물로 옮기려면 CMYK 변환. 화면 색과 인쇄 색이 다르게 나오는 경우가 있어 사전 변환·검수 필수.
4. HSL 표기 활용
HSL(색상·채도·명도)은 색감 조정이 직관적이라 디자이너가 자주 쓴다. RGB·HEX와 자유롭게 변환 가능.
5. 클라이언트 색상 시안
"이 색으로 해 주세요"라며 받은 자료가 RGB 표기인 경우, 본인 작업 환경에서 다른 표기로 변환 필요. 색상 변환기로 한 번 입력하면 여러 표기를 동시에 받는다.
6. 브랜드 컬러 통일
브랜드 메인 컬러를 웹·앱·인쇄·영상 매체에 일관되게 적용하려면 매체별 표기 변환 필요. 한 자리에서 여러 표기를 정리해 두면 통일성이 자리 잡힌다.
7. 접근성 검토
웹 접근성 가이드는 색 대비를 RGB 또는 명도 기준으로 평가. 색상 코드를 RGB로 변환해 대비비 확인이 필요한 경우가 종종 있다.
한 번 변환에 필요한 시간
위 7가지 상황 중 한 가지라도 자주 마주친다면 도구 한 번 익혀 두면 작업 시간이 분 단위로 짧아진다. 컬러 변환기로 한 번 입력하면 HEX·RGB·HSL이 한 화면에 떠 있다.
마무리
색상 변환은 디자인·웹 작업에 흔한 자리. 한 번 도구 익혀 두면 다음 작업부터 흐름이 부드러워진다.