색상 코드 변환기
색상 조화 생성기
색상 팔레트 생성기
색상 대비 분석기
색상 모델 이해
- RGB: 빨강, 초록, 파랑의 조합 (0-255)
- HEX: RGB를 16진수로 표현 (#RRGGBB)
- HSL: 색조, 채도, 밝기로 표현
- HSV: 색조, 채도, 명도로 표현
- CMYK: 인쇄용 색상 모델
- LAB: 인간의 시각과 유사한 색상 공간
- 웹에서는 주로 RGB와 HEX 사용
- 디자인에서는 HSL이 직관적
색상 조화 이론
- 보색: 색상환에서 정반대 위치의 색상
- 삼각 조화: 120도 간격의 세 색상
- 유사색: 인접한 색상들의 조합
- 사각 조화: 90도 간격의 네 색상
- 단색 조화: 같은 색조의 다른 명도/채도
- 분할 보색: 보색의 양옆 색상 사용
- 따뜻한 색: 빨강, 주황, 노랑 계열
- 차가운 색: 파랑, 초록, 보라 계열
색상 심리학
- 빨강: 열정, 에너지, 위험, 사랑
- 주황: 활력, 창의성, 따뜻함
- 노랑: 행복, 밝음, 주의, 지성
- 초록: 자연, 평화, 성장, 안정
- 파랑: 신뢰, 평온, 전문성, 차가움
- 보라: 고급스러움, 신비, 창의성
- 분홍: 부드러움, 사랑, 여성성
- 검정: 우아함, 권위, 신비
웹 접근성과 색상
- WCAG AA: 최소 4.5:1 대비율 (일반 텍스트)
- WCAG AAA: 최소 7:1 대비율 (일반 텍스트)
- 큰 텍스트는 더 낮은 대비율 허용
- 색상만으로 정보 전달 금지
- 색맹 사용자 고려 필요
- 충분한 대비로 가독성 확보
- 링크와 일반 텍스트 구분
- 포커스 상태 명확히 표시
디자인에서의 색상 활용
- 60-30-10 규칙: 주색상 60%, 보조색 30%, 강조색 10%
- 브랜드 색상의 일관성 유지
- 타겟 오디언스 고려한 색상 선택
- 문화적 색상 의미 고려
- 계절감과 트렌드 반영
- 인쇄물과 디지털의 색상 차이 고려
- 다양한 디바이스에서의 색상 표현
- 색상의 감정적 영향 활용
색상 도구와 리소스
- Adobe Color: 전문적인 색상 조화 도구
- Coolors.co: 빠른 팔레트 생성
- Paletton: 색상 이론 기반 도구
- Color Hunt: 트렌디한 팔레트 모음
- WebAIM: 접근성 대비 검사기
- Colour Lovers: 커뮤니티 팔레트
- Material Design: 구글의 색상 가이드
- Pantone: 표준 색상 시스템