색상 팔레트 생성기

아름다운 5색 팔레트를 생성하세요. 마음에 드는 색을 잠그고 스페이스바로 다시 생성합니다.

#47D786
rgb(71, 215, 134)
hsl(146, 64%, 56%)
#8AFF66
rgb(138, 255, 102)
hsl(106, 100%, 70%)
#0CCA69
rgb(12, 202, 105)
hsl(149, 89%, 42%)
#2CC6BD
rgb(44, 198, 189)
hsl(176, 64%, 47%)
#0B713A
rgb(11, 113, 58)
hsl(148, 82%, 24%)
또는 스페이스바

낳볼내기 형식：

:root {
  --color-1: #47d786;
  --color-2: #8aff66;
  --color-3: #0cca69;
  --color-4: #2cc6bd;
  --color-5: #0b713a;
}

색상 팔레트 생성기란?

색상 팔레트 생성기는 웹 디자인, 그래픽 디자인, 일러스트, 브랜딩 프로젝트에서 사용할 수 있는 무작위 5색 팔레트를 만듭니다. 각 견본에는 hex, RGB, HSL 값이 표시되며, 나머지를 다시 생성하는 동안 개별 색상을 잠글 수 있습니다.

도구는 브라우저에서 완전히 실행되며 회원가입이나 계정이 필요 없습니다. 팔레트는 CSS 사용자 정의 속성, Tailwind 구성 값 또는 일반 hex 목록으로 낳볼내기하여 프로젝트에 직접 붙여넣을 준비가 되어 있습니다.

색상 팔레트를 생성하는 방법

팔레트 생성은 빠르고 직관적입니다：

  • '생성'을 클릭하거나 스페이스바를 눌러 새로운 무작위 5색 팔레트를 만듭니다.
  • 아무 색상 견본이나 클릭하여 해당 hex 코드를 클립보드에 복사합니다.
  • 견본 위에 마우스를 올리고 잠금 아이콘을 클릭하여 해당 색상을 고정합니다.
  • 다시 스페이스바를 누르면——잠금 해제된 색상만 변경되어 좋아하는 색상을 중심으로 구축할 수 있습니다.
  • 낳볼내기 섹션을 사용하여 원하는 형식으로 팔레트를 복사합니다.

낳볼내기 형식

이 도구는 워크플로우에 쉽게 통합할 수 있도록 세 가지 낳볼내기 형식을 지원합니다：

  • CSS 변수 — 어떤 스타일시트에도 넣을 수 있는 사용자 정의 속성이 포함된 :root 블록을 생성합니다.
  • Tailwind — tailwind.config.js 파일에서 사용할 준비가 된 colors 객체를 생성합니다.
  • Hex 목록 — 디자인 도구와 문서에 유용한 줄바꿈으로 구분된 간단한 hex 값 목록입니다.

멋진 팔레트를 만드는 팁

  • 브랜드와 어울리는 1~2가지 색상을 잠그고 보색 강조색을 찾기 위해 생성합니다.
  • 텍스트와 배경색 사이에 좋은 대비가 있는지 확인하기 위해 HSL 밝기 값을 살펴봅니다.
  • 접근성을 고려한 디자인에서는 텍스트용으로 4.5:1 이상의 대비 비율을 확보합니다.
  • 결정하기 전에 여러 팔레트를 생성하여 스크린샷으로 비교합니다.

일반적인 사용 사례

  • 웹사이트, 앱, 랜딩 페이지의 색 구성 찾기.
  • 로고와 마케팅 자료를 위한 브랜드 색상 팔레트 만들기.
  • 일러스트와 디지털 아트의 색 조합 탐구.
  • 프레젠테이션과 슬라이드용 테마 팔레트 생성.
  • 바로 사용할 수 있는 CSS나 Tailwind 값으로 빠른 프로토타이핑.

자주 묻는 질문

팔레트를 생성하려면?+
기본 색상을 선택하거나 HEX/RGB를 입력하면, 도구가 자동으로 배색 체계를 생성합니다.
어떤 색상 형식을 지원합니까?+
HEX, RGB, HSL, CMYK 등을 지원합니다.
팔레트를 저장할 수 있습니까?+
네, 팔레트의 저장, 내보내기, 공유가 가능합니다.
도구는 무료입니까?+
완전히 무료입니다.
이미지에서 팔레트를 생성할 수 있습니까?+
네, 이미지를 업로드하면 자동으로 주요 색상을 추출합니다.
Is there a keyboard shortcut to generate new palettes?+
Yes. Press the spacebar to instantly generate a new palette. This makes it fast to cycle through combinations until you find one you like.

관련 도구

색상 대비 확인기CSS 그라데이션 생성색상 혼합기Photo Watermark Remover

색상 팔레트 생성기 — 무료 온라인 색상 팔레트 생성, 배색 체계, 색상 팔레트, 온라인 팔레트 생성, 무료 팔레트 도구, 색상 코디네이션, 디자인 팔레트, 색상 생성. 회원가입 불필요. 브라우저에서 작동.