Free UI palette generator

Color palettes that actually work in UI.

Generate app-ready palettes and preview them instantly on dashboards, landing pages, buttons, cards, forms, charts, and pricing sections.

Press Space to generate

Primary
Secondary
Accent
Background
Surface
Text
Muted Text
Border
Success
Warning
Error
Search...
Revenue
$45,231+20.1%
Customers
2,350+180
Active Now
573-12
SuccessWarningErrorInfo
Overview
+12.5%
Enable notifications

Export Palette

Copy your palette as CSS variables, Tailwind config, or JSON.

:root {
  --color-primary: #635BFF;
  --color-secondary: #22C55E;
  --color-accent: #F97316;
  --color-background: #FFFFFF;
  --color-surface: #F8FAFC;
  --color-text: #0F172A;
  --color-muted-text: #64748B;
  --color-border: #E2E8F0;
  --color-success: #22C55E;
  --color-warning: #F59E0B;
  --color-error: #EF4444;
}

Share Palette

Copy a shareable link to this exact palette.

cccolor.me/?palette=...

Contrast Check

WCAG AA requires 4.5:1 contrast ratio for normal text.

on
Text on Background
17.85:1Pass
on
Muted on Surface
4.55:1Pass
on
Primary Button
4.70:1Pass