Color Palette Generator

AI-powered

Type a vibe — 'desert at dusk', 'cyberpunk lab' — and get a 5-color palette with hex, RGB, HSL, and OKLCH for every swatch.

Starter palette
highlight
accent
primary
background
secondary

01 — Overview

How it works

Generate cohesive color palettes from a natural-language vibe. Each palette comes back as five swatches with one-click copy in hex, RGB, HSL, and OKLCH. Tweak any swatch and re-export. Powered by Claude for the seed → palette step; conversions run locally.

02 — Use cases

When to use it

  1. 01

    Kick off a brand exploration without opening a design tool

  2. 02

    Get a palette for a landing page before a designer is involved

  3. 03

    Translate a mood board prompt into usable CSS variables

  4. 04

    Generate quick swatches for a data viz or chart series

03 — Examples

Real input, real output

sunset over Tokyo

ex 01

#ff9472, #f2709c, #5b3a8c, #1d2671, #c33764

A warm-to-cool gradient palette inspired by city dusk.

minimal forest morning

ex 02

#e8efe6, #b7c9b1, #8aa78a, #4f6b56, #243d33

Soft greens stepping from highlight to deep shadow.

cyberpunk diner

ex 03

#0d0221, #ff003c, #00f0ff, #ffd700, #f6019d

High-contrast neons over near-black backgrounds.

04 — FAQ

Frequently asked

Claude proposes five hex values from your description. The tool then converts each to RGB, HSL, and OKLCH locally and previews them as swatches.

05 — More

Tools that pair well

Color Picker & Converter

Pick or paste a color, get every format — hex, RGB, HSL, OKLCH, CMYK, and the closest named color.

Color/color

CSS Gradient Generator

Build linear and radial gradients visually. Pick stops, angle, and direction; copy as CSS or Tailwind arbitrary value.

Color/gradient

Glassmorphism Generator

Visual builder for frosted-glass cards. Sliders for blur, opacity, saturation, border — copy CSS or Tailwind.

Color/glassmorphism