Design

Color Palette Generator

Create five-color palettes with six harmonies, perceptual color controls and text contrast checks.

OKLCH
Hue wheel

Drag around the wheel or move the hue slider. Lightness and chroma adjust independently.

How the palette is built

Analogous colors use nearby hue angles; complementary colors use opposite angles; split complementary, triadic and tetradic schemes distribute hues around the wheel. Monochromatic palettes vary lightness around one hue. These are starting points for design, not a scientific guarantee of beauty.

OKLCH separates perceived lightness, chroma and hue. Colors outside sRGB are brought into range by reducing chroma while keeping lightness and hue. Neutral colors have little or no visible hue. Contrast labels refer only to the suggested black or white text on each swatch; the table checks pairs separately.

Methods: Björn Ottosson, Oklab (2020), W3C CSS Color 4, and WCAG 2.2 contrast. No palette alone establishes full accessibility.

Need type to match? Convert your fonts.

How to use Color Palette Generator

  1. Enter a six-digit HEX color or use the color picker.
  2. Choose a base HEX color and a harmony, then adjust hue, lightness or chroma.
  3. Generate your palette, review contrast and download CSS, JSON or SVG.

Process multiple files

Use a workflow to apply the same settings to each file.

Formats and requirements

Input formats
plain text
Output
JSON, CSS or SVG
Availability
Free in your browser and through the CLI
Files per operation
1
Browser file limit
128 bytes per file, 1 MiB total

What to expect

Five-color OKLCH palettes with sRGB chroma reduction and WCAG text contrast. Harmony rules are design heuristics, not accessibility guarantees.

Do my files leave my device?

No. Thanks to advanced file-processing technology, your files are processed directly on your device, inside your browser. OneKit does not receive your input files or results. Required public processing libraries may download when you first use the tool.

File privacy and local processing →

Install OneKit

Keep OneKit in its own app window, with a shortcut on your device.