팔레트 생성기

어떤 기준 색상에서든 조화로운 색상 팔레트(보색, 유사색, 삼색 배합, 명암 전개 등)를 생성하고 CSS로 내보낼 수 있습니다.

Base color

Scheme

Colors

Click a swatch to copy its hex value.

CSS

:root {
  --color-1: #25e7eb;
  --color-2: #25a5eb;
  --color-3: #2563eb;
  --color-4: #2925eb;
  --color-5: #6b25eb;
}

사용 방법

Choose a base color with the swatch or by typing its HEX value.
Pick a scheme such as complementary, analogous or triadic. Shades, tints and analogous also let you choose how many colors to generate.
Click any swatch to copy that color's HEX value.
Copy the whole palette as CSS variables (--color-1, ...) or as a plain HEX list.

참고 사항

Palettes are computed from hue-wheel angles and HSL lightness. Complementary rotates the hue by 180 degrees, triadic by 120-degree steps, and analogous shifts within a ±40-degree window. Shades step lightness down and tints step it toward white. Everything is generated locally in your browser.

자주 묻는 질문

Why do some schemes ignore the color count?: Complementary (2), triadic (3), split-complementary (3) and tetradic (4) palettes have their size fixed by hue geometry. Only analogous, shades and tints can vary the count freely.
Is my palette saved anywhere?: No. The palette disappears when you leave the page, so copy it as CSS variables and paste it into your own project if you want to keep it.