기획자를 위한 컬러 가이드 A to Z
이 배경색에는 어떤 포인트 컬러가 어울릴까?
이런 분들이 읽으면 좋아요!
센스 있는 컬러감을 만들어 내고 싶은 분
기본적인 디자인 컬러 가이드를 알고 싶은 분
유용한 컬러휠 툴을 추천 받고 싶은 분
이런 내용을 알 수 있어요!
CMYK와 RGB 차이점을 알 수 있어요.
컬러휠(색상환) 이론을 알 수 있어요.
유용한 무료 컬러휠(색상환)을 추천 받을 수 있어요.
*아래 컨텐츠는 패스트파이브 제휴사 '패커티브'에서 제공해 주셨습니다.
'여기엔 이런 색을 쓰면 좋겠는데, 어울리는 게 맞을까...?'
제품의 패키지나 서비스의 상세 페이지를 기획하면서 어떤 컬러를 써야 좋을지 고민해본 적 한 번쯤 있으시죠? 내 눈엔 잘 어울리는 색인 것 같지만 이를 직접 제작하는 디자이너나 고객의 시선에서도 매력적일지 판단하기 어려운 경우가 많은데요. 이럴 때 필요한 게 바로 '컬러 휠!'
컬러 휠이란 색의 변화를 계통적으로 표시하기 위해서 색표를 둥근 모양으로 배열한 것을 말하는데요. 컬러 휠을 알면 비슷한 계열의 색상을 매치하거나 보색을 찾는 게 쉬워집니다.
‘이 컬러 말고… 좀 더 어울리는 색깔로…’라는 모호한 설명은 이제 그만!
자, 이제 '센스 있는' 컬러 배합을 하러 가볼까요?
컬러휠(색상환) 이론
먼저 색 이론을 알아가기 위해서 필수적인 컬러휠(색상환)에 대해 알아보도록 합시다.
박스 제작과 패키지 디자인에 필요한 색이 오렌지인지 레드인지 결정하셨나요?
색상을 더 선명하게 만들지, 흰색을 이용해 파스텔 톤으로 만들지, 검은색을 살짝 더해 흐리고 어두운색을 만들지는 여러분의 선택입니다.
CMYK와 RGB의 차이
CMYK는 Cyan, Magenta, Yellow, Key(black)을 나타냅니다. 프린터의 잉크 카트리지를 직접 바꿔 본 적이 있다면 아마 기억하실 겁니다.
CMYK는 색상을 빼내는 개념으로, 더 많은 색을 추가할수록 검은색에 가까워지고, 색을 빼다 보면 C,M,Y,K의 4원색으로 나누어집니다. 팔레트에 여러 색의 물감을 짜고 섞는다고 생각해 보세요. 점점 더 많은 색이 섞일수록 색은 탁해지고 어두워집니다.
CMYK의 개념은 실제 물감을 섞어 색을 만드는 것과 같기 때문에 인쇄에 사용됩니다. 인쇄물을 디자인하기 위해서는 언제나 그래픽 디자인 툴을 CMYK로 설정한 후 디자인을 제작해야 정확한 결과를 예상할 수 있습니다.
패키지 디자인과 박스 제작의 경우 신중하게 컬러를 테스트해야 인쇄물을 예상할 수 있으니 주의해 주세요!
반면 RGB는 컴퓨터를 포함한 전자 디스플레이, 즉 발광 스크린에서 사용됩니다.
Red, Green, Blue를 나타내는 RGB는 빛을 포함한 색이 점점 더해져 최종적으로 많은 색이 섞일수록 흰색에 가까워지는 개념입니다.
CMYK와 정반대인 이유는 이러한 색들이 물리적인 잉크를 포함하는 것 대신 빛을 포함하기 때문입니다. 프리즘을 통과한 빛들이 색색으로 나뉘는 것을 본 적 있나요? 각 파장에 따라 여러 컬러로 나뉜 빛들이 합쳐져 다시 흰색이 된다는 이론은 어렵게 생각할 필요가 없습니다.
이제 색상 이론의 기본을 알았으므로, 이 지식을 사용해 브랜드 디자인을 완성하고 고객에게 깊은 인상을 줄 만한 박스 제작을 하는 방법에 대해 이야기하겠습니다.
어떤 색끼리 잘 어울리고 어떤 색끼리 대비를 주는지 알고 싶다면 주목하세요.
색 조합을 고려하세요.
색상 맥락은 색상 간의 대비와 조화 여부를 결정지어 줍니다. 유사 색상으로 구성된 색 조합은 조화롭고 자연스럽지만, 보색을 통해 강한 대비를 주는 경우 역동적이고 자유로운 변화의 느낌을 줄 수 있습니다.
이는 다른 색 조합이 사람들이 색을 인지하는 방식을 다르게 유도하기 때문입니다. 다양한 색들이 한곳에 모여있는 경우 더 강한 인상을 줄 수 있지만, 이 다채로운 컬러들을 조화롭게 구성하는 것은 더 어려운 업무입니다. 운 좋게도 이러한 색 구성표를 만드는 데는 논리적 규칙이 사용되고 있으니 컬러 룰을 준수해 좋은 색 조합을 활용할 수 있죠.
컬러휠(색상환)을 참고하세요.
1) 유사한 색상 찾기
컬러휠에서 하나의 메인 컬러와 근처에 위치한 두 가지 컬러를 쌍을 이뤄 보면 유사한 색채 배합이 형성됩니다. 세 가지 대신 다섯 가지로 이루어진 색상 구성표를 사용하는 경우 두 가지 색상을 더 추가할 수 있습니다.
유사색을 선택하는 경우 대비가 높지 않기 때문에 일반적으로 더 부드럽고 대조가 적은 디자인을 만들 수 있습니다. 이러한 색 구성표들을 다양하게 활용해 브랜드 디자인과 잘 어울리는 컬러 구성을 제작할 수 있습니다.
2) 보색 찾기
똑똑한 독자라면 이미 이해하셨을지 모르지만 보색 역시 색상환을 사용해 쉽게 찾아낼 수가 있습니다. 한 가지 색과 완전히 반대되는 방향에 위치한 컬러들을 선택하세요. 여기서 중요한 점은 조화로움을 위해 한 가지 보색을 고른 후에는 또 다른 보색 대신 그 주변 색을 고르는 것이지요. 보색이 너무 남발되는 경우 주의가 산만해질 수 있기 때문입니다.
같은 색조 내에서 밝기와 채도가 변경된 색상을 선택하세요.
같은 색 구성 내에서 밝기와 채도를 변경하면 조화롭지만 다양한 컬러를 보여줄 수 있습니다. 이는 조화롭고 차분한 브랜딩이나 디자인에 적합하기 때문에, 보다 주의를 확 끄는 디자인을 제작하고 싶은 경우에는 보색 색상이나 다른 튀는 색을 한 가지 정도 추가하는 것이 좋습니다.
온라인 컬러휠(색상환) 추천
1) 어도비 컬러
링크: https://color.adobe.com/ko/create
브랜딩, 인포그래픽 및 모든 디자인에 참고하기 쉬운 어도비 컬러입니다.
이 온라인 툴을 사용하면 앞에서 설명한 색상환에 따른 색 구성을 빠르게 찾아낼 수 있습니다. 구성표에서 원하는 색을 선택한 뒤 HEX 또는 RGB 코드를 복사하여 붙여 넣어 적용할 수 있습니다.
또한 이미 만들어진 수백 가지 색 구성표를 이용해 나만의 디자인에 어떤 컬러가 잘 어울릴지 예상하고 적용해 볼 수도 있습니다. 어도비 계정을 가지고 있는 경우 각 테마를 자신의 계정에 쉽게 저장할 수 있습니다.
2) Paletton
링크: https://paletton.com/#uid=1000u0kllllaFw0g0qFqFg0w0aF
선택한 컬러를 메인 색상으로 빠르게 컬러 팔레트를 만들어주는 툴입니다.
유저가 비슷한 컬러를 찾을지, 보색 대비 등 튀는 컬러군을 찾을지 선택하면 사용자의 취향에 부합하는 색상 팔레트를 직접 찾아줍니다. 여기서 원한다면 직접 일부 색상을 변경할 수도 있습니다. 유저의 입맛에 따라 굉장히 다양한 컬러군을 찾아 주기 때문에 아직 컬러를 정하지 못했지만 막연하게 브랜딩을 고민하고 있다면 꼭 확인하고 시도해보는 것을 추천해 드립니다.
3) webfx color generator
링크: https://www.webfx.com/web-design/color-picker/
Color scheme을 이용해 색상을 빠르게 추출하는 데에 유용한 툴입니다. 비슷한 밝기, 채도의 컬러 팔레트를 만들고 이 코드를 복사해 디자인 프로그램에 붙여 넣어, 브랜드 디자인에 컬러를 바로 적용할 수 있습니다.
비전공자를 위한 디자인 컬러 가이드를 설명해 드렸는데요.
오늘 설명해 드린 기본적인 이론을 바탕으로 다양한 툴을 이용하여 실습해 보시면
센스 있는 브랜드 컬러 만들기, 어렵지 않으실 거예요!
