Tailwind CSS Palette Generator

/* Tailwind CSS v4 @theme */
@theme {
  --color-brand-50: #EFF3FB;
  --color-brand-100: #D5DFF6;
  --color-brand-200: #A8BFF0;
  --color-brand-300: #799DEC;
  --color-brand-400: #487BEA;
  --color-brand-500: #2563EB;
  --color-brand-600: #1450D2;
  --color-brand-700: #1242AB;
  --color-brand-800: #103584;
  --color-brand-900: #0D275E;
  --color-brand-950: #0A1939;
}

// tailwind.config.ts
colors: {
  brand: {
    50: '#EFF3FB',
    100: '#D5DFF6',
    200: '#A8BFF0',
    300: '#799DEC',
    400: '#487BEA',
    500: '#2563EB',
    600: '#1450D2',
    700: '#1242AB',
    800: '#103584',
    900: '#0D275E',
    950: '#0A1939',
  },
}