Pembuat Palet Warna

Color harmonies explained

Palette	Hues	Feel
Complementary	Base + 180°	High contrast, energetic
Analogous	Base ± 30°	Harmonious, calm
Triadic	Base + 120° + 240°	Vibrant but balanced
Split complementary	Base + 150° + 210°	Contrast with less tension
Tetradic	Base + 90° + 180° + 270°	Rich; best with one dominant color
Monochromatic	One hue, different lightness	Clean, consistent

Use the 60-30-10 rule: 60% of the design in a neutral or main color, 30% in a secondary color and 10% in an accent. Check text readability with the contrast check in the color converter.

Frequently asked questions

What is a complementary color?

The color directly opposite on the color wheel (180° away), such as orange and blue. Complementary pairs create strong contrast, which makes them good for calls to action, but they can feel loud in large areas.

Which palette type should I use for a website?

Monochromatic and analogous palettes feel calm and professional. A common approach is one main brand color, a complementary accent for buttons and links, and neutral grays for text and backgrounds.

How are the palettes calculated?

The base color is converted to HSL (hue, saturation, lightness) and its hue is rotated around the color wheel: 180° for complementary, ±30° for analogous, 120° steps for triadic, and so on. Monochromatic palettes vary the lightness instead.

How do I use the CSS export?

Copy the CSS custom properties into your stylesheet's :root and use them anywhere, for example color: var(--color-1). Changing one variable then updates every place it's used.

Instal ZYBERMART

Color harmonies explained

Frequently asked questions

Akun Anda

Apa yang ingin Anda buat?

Desain

Media sosial

Dokumen

Belajar

Edit

Color harmonies explained

Frequently asked questions

Alat terkait