웹사이트 색상을 정할 때 메인 컬러 하나는 정했는데, 거기에 어울리는 서브 컬러를 뭘로 해야 할지 모르겠더라고요. 아무 색이나 넣으면 조화가 안 맞아서 촌스러워 보이고, 색상 이론을 공부하자니 시간이 오래 걸립니다. 디자이너 없이 혼자 만드는 상황이라 더 막막했어요.
색상 조화 이론 기초
색상환에서 정반대에 있는 색을 보색이라고 해요. 빨강의 보색은 청록색이고, 노랑의 보색은 보라색입니다. 보색 조합은 대비가 강해서 눈에 확 띄는 디자인을 만들 때 좋아요. 유사색은 색상환에서 옆에 있는 색들인데, 부드럽고 통일감 있는 느낌을 줍니다. 파란색 계열로 통일하면 유사색 조합이에요.
컬러 팔레트 생성기에서 메인 컬러를 선택하면 보색, 유사색, 삼각색 등 다양한 배색 조합을 자동으로 보여줍니다. 색상 이론 몰라도 조화로운 색 조합을 바로 얻을 수 있어요.
어떤 배색 규칙을 쓸까
임팩트 있는 디자인을 원하면 보색을 쓰세요. CTA 버튼 같은 곳에 보색을 쓰면 클릭률이 올라가요. 차분하고 세련된 느낌을 원하면 유사색이 좋습니다. 같은 계열 색상끼리 그라데이션 느낌을 줄 수 있어요. 명도와 채도만 다르게 해서 깊이감을 주는 것도 방법입니다.
삼각색은 색상환에서 120도 간격으로 떨어진 세 가지 색인데, 다양하면서도 균형 잡힌 느낌을 줍니다. 아이들 브랜드나 활기찬 느낌을 원할 때 써보세요. 네이버나 구글 로고도 여러 색을 쓰지만 조화롭잖아요.
HEX 코드로 바로 복사
컬러 팔레트 생성기에서 만든 색상은 HEX 코드로 바로 복사할 수 있어요. CSS에 그대로 붙여넣기 하면 됩니다. 디자이너 없이 웹사이트 만들 때 색상 때문에 고민이라면 이 도구 써보세요. 전문가가 만든 것 같은 배색을 쉽게 얻을 수 있습니다.