컬러 팔레트 생성기
기기에서 실행되며 아무것도 전송되지 않습니다.모든 작업이 브라우저에서 이뤄지며 아무것도 업로드되지 않습니다.
색 개수5
팁: 스페이스 키를 누르면 새 팔레트가 만들어집니다.배색 규칙
내보내기
:root {
--color-1: #264653;
--color-2: #2a9d8f;
--color-3: #e9c46a;
--color-4: #f4a261;
--color-5: #e76f51;
}색상환 배색 규칙이나 무작위로 컬러 팔레트를 만들고, 마음에 드는 색을 고정한 뒤 CSS 변수, Tailwind 색상, JSON으로 복사하세요.
생성 버튼(또는 스페이스 키)을 누르면 새 팔레트가 나옵니다. 남기고 싶은 색을 고정하면 나머지는 색상환 배색 규칙에 따라 그 주변으로 다시 만들어집니다. 이웃한 유사색, 단색 그라데이션, 보색이나 분할 보색, 3색·4색 조화, 또는 색상이 고르게 퍼진 완전 무작위 중에서 고르세요. 색상 코드를 누르면 복사되고, 색 견본을 누르면 직접 색을 고를 수 있습니다. CSS 사용자 지정 속성, Tailwind 색상 단계, JSON으로 내보내거나 PNG로 저장하거나 같은 팔레트를 여는 링크를 복사하세요.
자주 묻는 질문
배색 규칙은 무슨 뜻인가요?
색상환 위의 위치 관계입니다. 유사색은 서로 이웃(차분함), 보색은 정반대(강한 대비), 분할 보색은 반대색의 양옆 두 색, 3색 조화는 120°씩, 4색 조화는 90°씩 떨어진 색입니다. 단색은 색상을 유지하고 밝기만 바꿉니다.
브랜드 색을 중심으로 팔레트를 만들려면?
첫 번째 색 견본을 눌러 내 색을 고르고 고정한 뒤 생성을 누르세요. 빈 칸이 선택한 규칙에 따라 그 색에서 출발해 채워집니다.
색 위의 글자는 잘 읽히나요?
색상 코드 글자는 대비가 더 높은 쪽인 검정이나 흰색으로 자동 전환됩니다. 본문 글자 조합은 색상 도구의 WCAG 대비 검사기로 정확히 확인하세요.
저장되는 것이 있나요?
현재 팔레트는 이 기기에 저장됩니다. 공유 링크는 주소의 # 뒤에 색을 담으며, 이 부분은 서버로 전송되지 않습니다.