Color Palette Generator

Generate tints and shades from a base color.

Base Color

Tailwind CSS Configuration

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'brand': {
          50: '#ebf3fe',
          100: '#d8e6fd',
          200: '#b1cdfb',
          300: '#89b4fa',
          400: '#629bf8',
          500: '#3b82f6',
          600: '#2f68c5',
          700: '#234e94',
          800: '#183462',
          900: '#0c1a31',
          950: '#060d19',
        },
      },
    },
  },
}