웹 디자인하다 보면 HEX 코드랑 RGB 코드가 혼용된다. 변환하는 방법이랑 언제 뭘 쓰는지 정리해봤다.
HEX vs RGB
HEX는 #FF5733 같은 형식이다. RGB는 rgb(255, 87, 51) 같은 형식이다. 표현하는 색상은 같고 형식만 다르다.
변환 원리
HEX는 16진수다. FF는 10진수로 255다. #FF5733을 RGB로 바꾸면 255, 87, 51이 된다. 색상 변환 도구를 쓰면 자동으로 변환된다.
어디서 뭘 쓸까
CSS에서는 둘 다 쓸 수 있다. 디자인 툴에서는 HEX를 많이 쓴다. 투명도가 필요하면 RGBA를 써야 한다.
실무 팁
브랜드 컬러는 HEX, RGB, CMYK 전부 기록해두자. 웹, 앱, 인쇄물에서 각각 필요하다. 온라인 변환기로 한번에 다 확인할 수 있다.
웹 색상의 접근성
색맹이나 색약인 사용자를 고려해야 한다. 빨강과 초록만으로 구분하면 안 된다. 명암 대비를 충분히 주는 것이 중요하다. 접근성 검사 도구로 확인해볼 수 있다. 색상 변환 도구로 다양한 조합을 테스트해보자.
색상 코드 이해하기
HEX는 웹에서, RGB는 그래픽 프로그램에서 주로 씁니다. 둘 다 같은 색을 표현하는 다른 방식이에요. 디자인 작업 할 때 변환이 자주 필요하니 색상 변환 도구를 북마크해두면 편리합니다. CSS 작성할 때 특히 유용해요.
디자이너와 협업할 때 색상 코드로 소통하면 정확한 색을 전달할 수 있어요. 실무에서 정말 자주 쓰입니다.
HSL 색상 모델도 알아두면 좋습니다. 명도와 채도를 직관적으로 조절할 수 있어서 색상 팔레트 만들 때 유용해요.