Color Palette Generator — Complementary, Analogous, Triadic – Free Online Tool

Generate beautiful color palettes with complementary, analogous, triadic, and tetradic color schemes. Export as HEX, RGB, or HSL. Free, no signup required.

Base Color:

Presets:

Complementary

#2563EB

rgb(37, 99, 235)

hsl(221, 83%, 53%)

1.0:1

#7154EF

rgb(113, 84, 239)

hsl(251, 83%, 63%)

2.5:1

#EBAD25

rgb(235, 173, 37)

hsl(41, 83%, 53%)

1.2:1

#F1C76B

rgb(241, 199, 107)

hsl(41, 83%, 68%)

1.2:1

#A8CA13

rgb(168, 202, 19)

hsl(71, 83%, 43%)

Analogous

#25C6EB

rgb(37, 198, 235)

hsl(191, 83%, 53%)

1.3:1

#4AA7EE

rgb(74, 167, 238)

hsl(206, 83%, 61%)

2.0:1

#2563EB

rgb(37, 99, 235)

hsl(221, 83%, 53%)

1.1:1

#4A55EE

rgb(74, 85, 238)

hsl(236, 83%, 61%)

1.4:1

#4A25EB

rgb(74, 37, 235)

hsl(251, 83%, 53%)

Triadic

#2563EB

rgb(37, 99, 235)

hsl(221, 83%, 53%)

1.9:1

#7F9DDD

rgb(127, 157, 221)

hsl(221, 58%, 68%)

1.6:1

#EB2563

rgb(235, 37, 99)

hsl(341, 83%, 53%)

1.5:1

#DD7F9D

rgb(221, 127, 157)

hsl(341, 58%, 68%)

1.8:1

#63EB25

rgb(99, 235, 37)

hsl(101, 83%, 53%)

Tetradic

#2563EB

rgb(37, 99, 235)

hsl(221, 83%, 53%)

1.4:1

#EB25C6

rgb(235, 37, 198)

hsl(311, 83%, 53%)

1.9:1

#EBAD25

rgb(235, 173, 37)

hsl(41, 83%, 53%)

1.2:1

#25EB4A

rgb(37, 235, 74)

hsl(131, 83%, 53%)

2.1:1

#A17AD3

rgb(161, 122, 211)

hsl(266, 50%, 65%)

Split-Complementary

#2563EB

rgb(37, 99, 235)

hsl(221, 83%, 53%)

1.8:1

#6B95F1

rgb(107, 149, 241)

hsl(221, 83%, 68%)

1.3:1

#EB4A25

rgb(235, 74, 37)

hsl(11, 83%, 53%)

2.8:1

#C6EB25

rgb(198, 235, 37)

hsl(71, 83%, 53%)

1.2:1

#D7C69F

rgb(215, 198, 159)

hsl(41, 42%, 73%)

Export

{
  "Complementary": [
    "#2563eb",
    "#7154ef",
    "#ebad25",
    "#f1c76b",
    "#a8ca13"
  ],
  "Analogous": [
    "#25c6eb",
    "#4aa7ee",
    "#2563eb",
    "#4a55ee",
    "#4a25eb"
  ],
  "Triadic": [
    "#2563eb",
    "#7f9ddd",
    "#eb2563",
    "#dd7f9d",
    "#63eb25"
  ],
  "Tetradic": [
    "#2563eb",
    "#eb25c6",
    "#ebad25",
    "#25eb4a",
    "#a17ad3"
  ],
  "Split-Complementary": [
    "#2563eb",
    "#6b95f1",
    "#eb4a25",
    "#c6eb25",
    "#d7c69f"
  ]
}

𝕏 Twitter in LinkedIn

💬 User Feedback

How to Use

Enter or pick a base color
Choose a harmony type (complementary, analogous, etc.)
Preview generated palettes
Click any color to copy its value
Export all colors as JSON or CSS variables

Use Cases

Web and app UI design
Brand color selection
Data visualization coloring
CSS theme creation

FAQ

What color harmonies are available?

Complementary, analogous, triadic, tetradic, and split-complementary schemes.

What formats can I export?

HEX, RGB, and HSL values. You can also export as JSON or CSS custom properties.

Color Palette Generator — Complementary, Analogous, Triadic – Free Online Tool

Complementary

Analogous

Triadic

Tetradic

Split-Complementary

Export

💬 User Feedback

More Tools

Partner Offers

Stay Updated

How to Use

Use Cases

FAQ