색상 조합 기초 — 보색·유사색·삼각색을 활용한 디자인 팁
글 Jeff · 2026년 4월 1일 작성 · 2026년 4월 30일 수정
좋은 색상 조합은 우연히 나오지 않습니다. 그렇다고 디자인 전공이 필요한 것도 아닙니다. 사람들이 보기 좋다고 느끼는 조합에는 몇 가지 패턴이 있습니다. 그 패턴만 알면, 색을 고르는 일이 추측이 아닌 선택이 됩니다.
5가지 핵심 색상 조화와 이걸 실제로 적용하는 규칙, 그리고 좋은 색을 골라도 어설퍼 보이게 만드는 실수들을 정리했습니다.
5가지 기본 색상 조화
보색 — 강렬한 대비, 신중하게 사용
색상환에서 정반대에 위치한 두 색입니다: 파랑+주황, 빨강+초록, 보라+노랑. 대비가 강해서 CTA 버튼이나 강조 포인트로는 효과적이지만, 전체에 쓰면 시각적으로 피로합니다. 하나를 주조색, 다른 하나를 강조색으로만 쓰는 게 원칙입니다.
사례: 레이커스(보라+금), 네덜란드 대표팀(주황+파랑)
유사색 — 안전하고 조화로운 선택
색상환에서 인접한 세 색: 파랑, 청록, 초록. 자연스럽게 조화롭고 눈에 편합니다. 배경, 일러스트, 차분한 분위기가 필요한 디자인에 잘 맞습니다. 거의 틀릴 수가 없는 조합입니다.
사례: 자연 사진 팔레트, 스파·웰니스 브랜딩
삼각색 — 활기차고 균형 잡힌 조합
색상환에서 120° 간격으로 배치된 세 색: 빨강+파랑+노랑(원색), 또는 초록+주황+보라. 에너지 넘치고 역동적입니다. 하나를 60%의 주조색으로 쓰고, 나머지 둘을 강조색으로 씁니다.
사례: 구글 로고, 토이스토리 포스터
분할 보색 — 보색의 순한 버전
하나의 색 + 그 보색의 양쪽 인접색. 파랑이라면 황주황과 적주황. 보색의 대비 에너지는 가져가면서 긴장감을 줄인 조합입니다. 보색이 너무 강하게 느껴질 때 좋은 선택입니다.
단색 — 세련된 단순함
한 색의 다양한 명도·채도 변화: 연한 파랑, 중간 파랑, 진한 파랑. 항상 조화롭습니다. 새로운 색조 없이 깊이와 시각적 흥미를 만들어냅니다. 미니멀하고 전문적인 레이아웃에 가장 깔끔한 선택입니다.
사례: 많은 기업·테크 브랜드의 다양한 파란색 조합
60-30-10 법칙 — 색상 규칙 중 가장 실용적인 것
세 가지 색(또는 명도)이 있을 때, 이 비율로 나눕니다:
- 60% — 주조색: 배경, 넓은 면. 차분하고 중성적인 색이 좋습니다.
- 30% — 보조색: 카드, 사이드바, 헤더. 구조를 만듭니다.
- 10% — 강조색: 버튼, 하이라이트, 아이콘. 여기서는 과감해도 됩니다.
채도 높은 눈에 띄는 색을 60%로 쓰면 눈이 피로합니다. 10%에만 쓰면 원하는 곳에서 정확히 튑니다.
색상 심리 — 색이 주는 느낌
| 색상 | 주로 연상되는 느낌 | 많이 쓰는 분야 |
|---|---|---|
| 파랑 | 신뢰, 안정감, 차분함 | 금융, 의료, 테크 |
| 빨강 | 긴박감, 에너지, 열정 | 식음료, 세일, 엔터테인먼트 |
| 초록 | 자연, 건강, 성장 | 친환경, 웰니스, 금융 |
| 노랑 | 따뜻함, 주의 집중, 낙관 | 리테일, 아동 제품 |
| 보라 | 창의성, 고급스러움, 신비 | 뷰티, 프리미엄 상품 |
| 주황 | 활력, 친근함, 합리적 가격 | 가성비 브랜드, 식품 |
색상 심리는 문화와 맥락에 따라 달라집니다. 파랑이 신뢰스럽게도, 차갑고 냉정하게도 느껴질 수 있습니다. 위 내용은 경향이지 법칙이 아닙니다.
자주 하는 실수들
- 채도 높은 색을 한꺼번에 많이 사용. 원색 빨강 + 원색 파랑 + 원색 노랑 = 혼란. 완전히 채도 높은 색들이 한 화면에 있으면 시선이 어디로 가야 할지 모릅니다. 채도 높은 강조색 하나에 낮은 채도나 무채색을 곁들이세요.
- 저대비 텍스트. 흰 배경에 연한 회색 텍스트, 검은 배경에 짙은 남색 텍스트. 가독성이 심각하게 떨어집니다. 제목이 아닌 본문 텍스트로 꼭 테스트해 보세요.
- 난색과 한색의 균형 무시. 빨강·주황·노랑만 쓰면 답답하거나 공격적으로 느껴집니다. 파랑·초록·보라만 쓰면 차갑습니다. 반대 온도의 색을 조금 섞으면 균형이 생깁니다.
- 색상만으로 의미 전달. 남성의 약 8%가 색각 이상을 갖고 있습니다. "빨간 항목이 오류, 초록이 정상"이라는 표시는 적록 색맹인 사람에게 구분이 안 됩니다. 중요한 구분에는 색과 함께 아이콘, 레이블, 패턴을 함께 쓰세요.
이 글을 읽었다면 이것도
색상 코드를 입력하면 어울리는 조합을 바로 찾아드립니다.
어울리는 색 찾기 도구 바로 사용하기