"블로그·앱 색상 맞추고 싶은데 어떤 컬러가 어울릴까요?"

아름다운 색 조합은 우연이 아닙니다. 색채 이론에 따라 감정·시선·가독성이 결정됩니다. 이번 글에서는 컬러 기초부터 2026 트렌드까지 실전 팔레트 제작법을 정리합니다.

컬러 3가지 표기법 이해

표기	형식	특징	예 (빨강)
HEX	#RRGGBB	웹 표준	#FF0000
RGB	rgb(R,G,B)	0~255 값	rgb(255,0,0)
HSL	hsl(H,S%,L%)	직관적 조정	hsl(0,100%,50%)
HSV/HSB	hue,sat,val	디자인 툴	Photoshop

실무 팁: 디자인 작업은 HSL이 직관적. H(색상)·S(채도)·L(명도) 각각 독립 조정 가능.

색상환과 기본 조합 5가지

① 보색 (Complementary)

색상환에서 정반대. 강한 대비·시선 집중. 예: 빨강+녹색, 파랑+주황.

② 유사색 (Analogous)

인접한 3색. 조화·편안함. 예: 파랑+청록+초록.

③ 삼색조 (Triadic)

색상환 120° 간격 3색. 활기·균형. 예: 빨강+노랑+파랑.

④ 분할 보색 (Split-Complementary)

주색 + 보색 양 옆 2색. 보색보다 덜 강함. 예: 파랑 + 주황 옆 2색.

⑤ 사각 (Tetradic)

4색 사용. 복잡하지만 풍부. 주·보조 비율 주의.

60-30-10 법칙 (디자인의 황금률)

• 60%: 주 색상 (배경·큰 영역)
• 30%: 보조 색상 (섹션·제목)
• 10%: 강조 색상 (버튼·CTA)

유명 브랜드 대부분 이 법칙. 토스 앱: 흰색 60% + 파랑 30% + 빨강 10%.

감정과 색 — 심리학

색	감정·의미	업계
빨강	열정·긴급·위험	식음료·엔터
파랑	신뢰·안정·기업	금융·IT·의료
노랑	활기·친근·주의	어린이·관광
초록	자연·성장·건강	환경·유기농
보라	창의·고급·신비	뷰티·럭셔리
주황	열정·활기·따뜻	스포츠·패스트푸드
분홍	감성·로맨스·어림	뷰티·패션
검정	세련·권위·고급	명품·테크

2026 Pantone 올해의 컬러

Pantone이 매년 발표하는 "올해의 색". 2026 트렌드:

• Mocha Mousse (#A47864) — 2025 올해의 컬러 (초콜릿 브라운)
• Sage Green — 편안한 자연 초록
• Digital Lavender — 디지털 감성 라벤더
• Cherry Red — 활기찬 붉은색

접근성 — 색맹·저시력 고려

• 색약자 고려: 빨-녹 구분 어려움 (전 세계 8%)
• 색상만으로 정보 전달 X: 아이콘·텍스트 병용
• 대비 비율 WCAG AA: 4.5:1 이상 (일반 텍스트)
• AAA: 7:1 이상 (시각장애 고려)
• 도구: WebAIM Contrast Checker, Sim Daltonism

브랜드 컬러 만들기 — 실전 5단계

1. 타겟 감정 정의 (신뢰? 활기? 고급?)
2. 메인 컬러 1개 선정 (HSL 조정)
3. 보조 2~3색 색상환 기반 (유사·보색)
4. 중립색 (회색·흰색·검정)
5. 테스트: 다양한 크기·배경·접근성

유명 브랜드 팔레트

• 토스: #0064FF (파랑 메인) + 흰 + 검정
• 카카오: #FEE500 (노랑) + 검정 + 흰
• 네이버: #03C75A (녹) + 흰 + 검정
• Netflix: #E50914 (빨강) + 검정 + 흰
• Spotify: #1DB954 (녹) + 검정 + 흰

팔레트 영감 사이트

• Coolors: 자동 팔레트 생성
• Adobe Color: 색상환 기반 조합
• Dribbble: 디자이너 작업 레퍼런스
• Pinterest: 무드보드 기반 팔레트
• Pantone: 트렌드 컬러 업데이트

컬러 변환기

색상 도구 →

참고
• Itten, J. The Art of Color.
• Pantone Color Institute 2026 Color Forecast.
• W3C WCAG 2.1 접근성 가이드라인.