Toolbox

Every color tool, in one place

40+ free tools grouped by job. Pick the right one fast - or jump in anywhere; every tool shares your palette via the global HUD.

Create palettes

Generate, extract or invent a palette from scratch. The starting points for any color project.

Palette Generator

Smart 5-color palettes with locks, harmonies and OKLCH editing.

Open tool

Prompt Studio

Describe a brand or mood; get curated palettes back.

Open tool

Extract from Image

k-means palettes from any photo, with mood presets.

Open tool

Pick from Image

Eyedrop exact colors from any uploaded picture.

Open tool

Pick from Camera

Live color sampling using your device camera.

Open tool

Palette from URL

Fetch a screenshot and extract its dominant colors.

Open tool

Pick & convert

Single-color tools: pick precisely, convert to every format, and inspect what you have.

Color Picker

HSV canvas, alpha channel and 10 format outputs.

Open tool

Color Converter

HEX, RGB, HSL, OKLCH, LAB, P3 in one screen.

Open tool

Color Wheel

Generate harmonies - complementary, triadic, analogous.

Open tool

Color Mixer

Blend two colors in OKLCH at any ratio.

Open tool

Named Colors

330+ CSS named colors with hex, RGB and OKLCH.

Open tool

Gradients & effects

Build hero gradients, mesh backgrounds, duotones and pattern fills.

Gradient Maker

Linear, radial, conic with OKLCH interpolation.

Open tool

Mesh Gradient

Stripe-style multi-color soft mesh in CSS.

Open tool

Duotone

Two-color image filters for editorial art direction.

Open tool

Pattern Maker

Generate seamless CSS background patterns.

Open tool

Box Shadows

Multi-layer shadows for depth and elevation.

Open tool

Design systems

12-step ramps, semantic tokens, dark-mode mirrors and exports.

Design System

OKLCH 12-step ramps from a brand color.

Open tool

Design Tokens

Export W3C DTCG / Style Dictionary.

Open tool

Token Studio

Multi-mode (light/dark/brand) token editor.

Open tool

Tailwind Colors

Browse and copy the full Tailwind palette.

Open tool

Material You

Material 3 dynamic-color tonal palettes.

Open tool

Dark Mode

Generate a dark-mode mirror of any palette.

Open tool

Preview & inspiration

See how a palette will land on real surfaces before shipping.

UI Preview

Drop palette into a live UI mock.

Open tool

Palette Visualizer

Desktop, tablet and mobile mocks side by side.

Open tool

Explore

Curated, mood-filtered palette gallery.

Open tool

Palettes

Hand-curated schemes by tag and hue.

Open tool

Trends

Hue forecast and trending collections.

Open tool

For developers

Editor extensions, CLI, GitHub Action, MCP server, public API.

Developer Hub

API, CLI, integrations and recipes.

Open tool

Public REST API

Free convert / contrast / palette endpoints.

Open tool

CLI

npm install -g @colorui/cli.

Open tool

Browser Extension

Eyedrop and palette grab on any web page.

Open tool

Figma Plugin

Generate, contrast and convert inside Figma.

Open tool

VS Code

Color preview, conversion and palette in editor.

Open tool

Raycast

Palette search and convert from your launcher.

Open tool

GitHub Action

Audit color tokens on every PR.

Open tool

MCP Server

Bring ColorUI into Claude, Cursor, Windsurf.

Open tool

Specialized & experimental

Less-common but high-leverage tools.

Recolor SVG

Swap any color in an SVG to a new palette.

Open tool

Favicon Generator

Generate a brand-color favicon set.

Open tool

Display P3

Audit which colors fit P3 vs sRGB.

Open tool

Spatial

Plot a palette in 3D OKLCH space.

Open tool

Color Animation

Generate keyframe color transitions.

Open tool

Palette Diff

Compare two palettes side by side.

Open tool

Palette to Prompt

Turn a palette into an AI image prompt.

Open tool

Brand Story

Narrative around your brand color choices.

Open tool

Where to start

· Building a brand from one color? → Design System
· Need a palette right now? → Palette Generator
· Picked colors that fail accessibility? → Contrast Checker
· Have a brand photo or screenshot? → Extract from Image
· Shipping a design system in code? → Developer Hub