브랜드 색을 정해 달라고 했더니, 좋아하는 색 일곱 가지를 한 화면에 다 풀어놓는 분들이 많다. 머리띠는 분홍, 버튼은 초록, 제목은 파랑, 배경은 노랑. 화려해 보이라고 넣은 색인데 정작 손님 눈은 어디에 둘지를 잃고 그대로 화면을 떠난다. 색은 많을수록 풍성한 게 아니라, 많을수록 산만하다. 작은 회사 웹사이트가 적은 색으로 또렷한 인상을 남기는 색상 설계의 원칙 다섯 가지를 정리했다.
1. 색은 세 가지면 충분하다 — 60·30·10의 균형
잘 정돈된 화면은 대개 세 가지 색으로 굴러간다. 화면의 약 60%를 차지하는 주조색(보통 흰색이나 옅은 회색 같은 배경), 30%의 보조색(머리글·구획을 잡아주는 색), 그리고 10%의 강조색이다. 이 비율을 지키면 색이 적어도 화면은 단조롭지 않고, 무엇보다 시선이 자연스럽게 흐른다. 색을 더 넣고 싶을 땐 새 색을 추가하기보다, 가진 색의 밝기와 진하기를 조절해 변주하는 편이 안전하다.
2. 강조색은 '눌러야 할 곳'에만 아껴 쓴다
강조색의 임무는 단 하나, 손님의 손가락을 부르는 것이다. 문의 버튼, 구매 버튼, 핵심 링크처럼 행동을 유도하는 자리에만 강조색을 쓰면, 손님은 설명을 읽지 않아도 어디를 눌러야 할지 한눈에 안다. 반대로 제목에도 강조색, 아이콘에도 강조색, 배경 띠에도 강조색을 쓰면 정작 가장 중요한 버튼이 그 속에 묻혀버린다. 강조색은 화면에서 가장 귀한 색이니, 가장 아껴 써야 한다.
3. 색에도 업종의 표정이 있다
색은 말보다 먼저 첫인상을 정한다. 손님은 글을 읽기 전에 색부터 본다. 병원·법률·금융처럼 신뢰가 중요한 곳은 차분한 파랑·남색이 안정감을 주고, 음식·공방·아이 관련 업종은 따뜻한 주황·노랑·갈색이 더 살갑게 다가간다. 친환경·웰빙이라면 초록 계열이 메시지를 거들어 준다. 유행하는 색을 좇기보다, 우리 업종이 손님에게 주고 싶은 감정에서 색을 거꾸로 골라야 한다.
4. 멋보다 먼저, 읽히는 대비를 확보한다
아무리 고운 색 조합도 글자가 안 읽히면 실패다. 옅은 회색 배경에 옅은 회색 글자, 노랑 바탕에 흰 글자는 디자인 시안에선 멀끔해 보여도 햇빛 아래 휴대폰에선 흔적도 없이 사라진다. 본문 글자와 배경 사이에는 충분한 명도 대비가 있어야 한다. 이는 멋의 문제가 아니라 모두가 읽을 수 있게 하는 웹 접근성의 기본이기도 하다. 색을 정했다면, 화면 밝기를 낮춰 보거나 흑백으로 바꿔 보며 글자가 살아남는지 꼭 확인하자.
5. 팔레트를 정했으면 끝까지 지킨다
색 설계에서 가장 흔한 실수는 페이지마다 색이 조금씩 달라지는 것이다. 첫 화면 버튼은 짙은 파랑인데 문의 페이지 버튼은 옅은 하늘색이면, 손님은 의식하지 못한 채 '어딘가 어수선하다'고 느낀다. 처음에 정한 색 코드(예: #2563EB 같은 정확한 값)를 팔레트로 적어두고 모든 페이지에서 똑같이 쓰는 것, 그 일관성이 작은 회사 사이트를 한결 정돈되고 믿음직해 보이게 만든다.
적은 색이 또렷한 인상을 남긴다
좋은 색 설계는 색을 많이 쓰는 솜씨가 아니라, 색을 절제하는 안목에서 나온다. 세 가지 색으로 균형을 잡고, 강조색을 아끼고, 업종의 표정을 입히고, 대비를 지키고, 팔레트를 끝까지 따른다. 이 다섯 가지만 지켜도 화면은 한결 또렷해진다. CYAN 에이전시는 작은 회사의 홈페이지를 만들 때 늘 업종과 손님의 마음에서 출발해 절제된 색 팔레트를 함께 설계한다. 색이 너무 많아 정신이 사나운 사이트로 고민이라면, 한 번 들여다볼 일이다.