HueOdyssey랜딩 페이지 색상 팔레트 생성기
랜딩 페이지 색상 팔레트을 7가지 시맨틱 역할, 읽기 쉬운 대비, 실제 UI 미리보기, CSS에 바로 쓸 수 있는 HEX 값과 함께 살펴보세요.
background#FFF7F7
surface#FFFFFF
secondary#7C3AED
primary#E11D48
accent#F59E0B
muted#6B5B65
text#1F1721
이 팔레트가 잘 작동하는 이유
랜딩 페이지는 하나의 핵심 행동으로 사용자를 안내합니다. 중심 버튼에 가장 강한 대비를 주고 배경, 근거, 보조 링크는 한 단계 차분하게 두세요.
7가지 색은 주요 동작, 보조, 포인트, 배경, 면, 글자, 흐린 콘텐츠 역할로 나뉩니다. 덕분에 팔레트를 무드보드 너머의 실제 인터페이스에 쓸 수 있습니다.
활용 방법
주색은 CTA와 링크에 사용하고 모든 장식 요소에 반복하지 마세요.
글자는 WCAG AA를 충족하는 배경과 면에 조합하세요.
포인트 색은 배지, 강조, 주의가 필요한 순간에 가장 효과적입니다.
관련 방향
자주 묻는 질문
이 색을 상업 프로젝트에 사용할 수 있나요?
네. HEX 값은 라이선스가 필요한 자산이 아니라 색상 데이터입니다. 인터페이스와 브랜드 맥락에 맞게 팔레트를 조정하세요.
이 팔레트는 WCAG를 준수하나요?
글자 역할은 배경과 면 위에서 검사합니다. 색, 글꼴, 크기, 굵기를 바꾼 뒤에는 대비를 다시 확인하세요.