색상 조합 기초 — 보색·유사색·삼각색을 활용한 디자인 팁

최종 업데이트: 2026년 4월

색상 이론은 복잡해 보이지만 핵심 원리는 간단합니다. 웹사이트, 발표 자료, SNS 그래픽을 만들 때 몇 가지 색상 관계를 이해하면 의도적이고 완성도 높은 조합을 선택할 수 있습니다.

5가지 기본 색상 조화

보색 (Complementary)

색상환에서 정반대에 위치한 두 색(예: 파란색과 주황색). 대비가 강하고 눈에 띕니다. 하나의 색을 강조하고 싶을 때 효과적입니다.

유사색 (Analogous)

색상환에서 인접한 세 색(예: 파란색, 청록색, 초록색). 자연스럽게 조화롭습니다. 배경, 일러스트, 차분한 디자인에 적합합니다.

삼각색 (Triadic)

색상환에서 균등하게 배치된 세 색(예: 빨강, 노랑, 파랑). 활기차고 균형 잡혀 있습니다. 한 색을 주조색으로 쓰고 나머지 둘을 포인트로 활용하세요.

분할 보색 (Split-Complementary)

하나의 색과 그 보색의 양쪽 인접색(예: 파랑, 황주황, 적주황). 보색보다 긴장감이 적고 여전히 대비가 강합니다. 초보자에게 다루기 쉬운 조합입니다.

단색 (Monochromatic)

한 색의 다양한 명도·채도 변화. 항상 조화롭고 깔끔하며 세련된 느낌을 줍니다. 미니멀 디자인과 전문적인 레이아웃에 잘 어울립니다.

색상 조합 실용 규칙

  • 60-30-10 법칙 활용: 주조색 60%(배경, 넓은 면), 보조색 30%(섹션, 카드), 포인트색 10%(버튼, 하이라이트). 이 비율이 시각적으로 균형 잡힌 느낌을 줍니다.
  • 색상 수 제한: 2~3가지 색이면 대부분의 디자인에 충분합니다. 색이 많을수록 균형을 잡기가 어렵습니다.
  • 가독성을 위한 대비 확인: 텍스트는 배경과 충분한 명도 차이가 있어야 합니다. 어두운 배경에 밝은 텍스트, 또는 그 반대로 설정하세요.
  • 색 심리 고려: 파랑은 신뢰·안정감, 빨강은 긴박감·에너지, 초록은 자연·성공, 노랑은 주의 집중을 연상시킵니다. 콘텐츠 목적에 맞는 분위기를 선택하세요.

자주 하는 색상 조합 실수

  • 채도 높은 색 남발: 원색들을 함께 쓰면 서로 주목을 빼앗아 시각적으로 피로합니다. 채도 높은 포인트색에 무채색이나 낮은 채도의 색을 함께 쓰세요.
  • 저대비 텍스트: 흰 배경에 연한 회색 텍스트, 검은 배경에 짙은 파랑 텍스트 등은 가독성이 크게 떨어집니다. 반드시 테스트하세요.
  • 난색·한색 균형 무시: 모두 난색이거나 모두 한색이면 단조로워집니다. 반대 색온도를 소량 추가하면 생동감이 생깁니다.
  • 색상만으로 의미 전달: 남성의 약 8%는 색각 이상을 갖고 있습니다. 중요한 구분에는 색과 함께 아이콘, 레이블, 패턴을 병행 사용하세요.

내 디자인에 어울리는 색상 조합을 찾아보세요.

어울리는 색 찾기 도구 바로 사용하기