All tools

Color Palette Generator

Converter

Generate color harmonies and CSS gradients from any base color, then copy hex codes and CSS.

Neighbors on the wheel for a harmonious, calm palette.

Click a color to copy · Space to shuffle

About the Handiwork Color Palette Generator

The Color Palette Generator builds harmonious color schemes from any base color and creates ready-to-use CSS gradients. Switch between Palette mode for complementary, analogous, triadic, tetradic, monochromatic, and tint/shade schemes, and Gradient mode for linear and radial CSS gradients — then copy hex codes or CSS with one click.

How to use the Handiwork Color Palette Generator

  1. Pick a base color with the swatch or enter a hex code.
  2. Choose a harmony to generate a matching palette, or switch to Gradient mode.
  3. Copy individual swatches, all hex codes, or the generated CSS gradient.

Color harmonies explained

Color harmonies are relationships on the color wheel that look pleasing together. Complementary pairs opposites for high contrast, analogous uses neighbors for a calm look, triadic and tetradic spread colors evenly for vibrant balance, and monochromatic or tint/shade schemes vary the lightness of a single hue for subtle, cohesive designs.

Building CSS gradients

Gradient mode lets you blend two colors into a linear or radial gradient. Adjust the angle for linear gradients with the slider or quick presets, preview the result live, and copy a CSS-ready background declaration you can paste straight into your stylesheet.

Frequently asked questions

What color formats can I copy?

Palette swatches copy as hex codes, and you can copy the whole palette at once. Gradients copy as a ready-to-paste CSS background declaration.

Which color harmonies are supported?

Complementary, analogous, triadic, tetradic, monochromatic, and tints & shades — generated instantly from your chosen base color.

Does it support radial gradients?

Yes. Switch the gradient type to radial for a circular blend, or use linear with an adjustable angle for directional gradients.