Tailwind CSS Palette & Variable Generator

brand: {
  50: '#f1f1fe',
  100: '#e3e3fc',
  200: '#bdbff9',
  300: '#8a8cf4',
  400: '#575af0',
  500: '#2327eb',
  600: '#1317d3',
  700: '#1013ad',
  800: '#0c0f88',
  900: '#090b67',
  950: '#060742',
}

  --color-brand-50: #f1f1fe;
  --color-brand-100: #e3e3fc;
  --color-brand-200: #bdbff9;
  --color-brand-300: #8a8cf4;
  --color-brand-400: #575af0;
  --color-brand-500: #2327eb;
  --color-brand-600: #1317d3;
  --color-brand-700: #1013ad;
  --color-brand-800: #0c0f88;
  --color-brand-900: #090b67;
  --color-brand-950: #060742;