Color Palette Generator

Generate a full 50–900 scale from any base color. Export as CSS variables, Tailwind config, or JSON.

Color

Hex

Name

:root {
  --primary-50: #f0f6fe;
  --primary-100: #cee0fd;
  --primary-200: #a7c7fb;
  --primary-300: #85b2f9;
  --primary-400: #5e99f7;
  --primary-500: #3c83f6;
  --primary-600: #0b5ee5;
  --primary-700: #0844a6;
  --primary-800: #052a66;
  --primary-900: #021027;
}