Color Palette Generator
Intelligent color palette generator with harmony controls, export-ready JSON and CSS tokens, gradient previews and contrast hints for interface design.
Choose your base color and harmony
Adjust the hue, pick a color strategy and decide how many swatches you want. Everything updates in a single click.
Tip: export as CSS variables to drop straight into your design tokens, or copy the gradient string for hero backgrounds and charts.
Your fully synchronized palette
Click a swatch to copy it, or export the entire set as JSON, CSS variables or a ready-made gradient.
#1
#46B4E5rgb(70, 180, 229)hsl(198, 75%, 59%, 100%)
Text contrast 2.25 : 1
#2
#0088F6rgb(0, 136, 246)hsl(207, 100%, 48%, 100%)
Text contrast 3.43 : 1
#3
#4F46E5rgb(79, 70, 229)hsl(243, 75%, 59%, 100%)
Text contrast 6.01 : 1
#4
#9445E6rgb(148, 69, 230)hsl(269, 76%, 59%, 100%)
Text contrast 4.72 : 1
#5
#C646E5rgb(198, 70, 229)hsl(288, 75%, 59%, 100%)
Text contrast 3.71 : 1
Gradient preview
Palette generator FAQs
Your current palette starts at #46B4E5 and ends at #C646E5. Explore the questions below to get the most from each harmony.