How is an analogous palette generated?

Three to five colors adjacent on the color wheel (~30° apart). Produces soft, harmonious designs.

Can I export as Tailwind or CSS variables?

Yes. The export panel supports CSS custom properties, SCSS variables, and a Tailwind-compatible config snippet.

Color Palette Generator

Enter any color and generate complementary, analogous, triadic, tetradic, and monochromatic palettes. Copy individual swatches or export the full palette as CSS variables.

Runs locally in your browser

Seed color

Scheme

Swatches

Scheme

analogous

Seed

#6366F1

#63adf1
#6366f1
#a763f1

Color Converter

Convert between HEX, RGB, HSL, and CMYK.

HEX to RGB

Convert HEX color codes to RGB values and back.

CSS Gradient Generator

Build CSS gradients visually and copy the code.

Box Shadow Generator

Design CSS box-shadows with a live preview.

About Color Palette Generator

Enter any color and generate complementary, analogous, triadic, tetradic, and monochromatic palettes. Copy individual swatches or export the full palette as CSS variables.

Color Palette Generator is part of FizzKit — a collection of focused, browser-based tools. Because everything runs locally, it works offline once loaded and never exposes your data to a remote server.

Frequently asked questions

Two colors opposite each other on the color wheel (180° apart). Maximum contrast; often used for calls-to-action.

Related tools