Tailwind colors

Tailwind v4 is CSS-first — drop this in your stylesheet, no config file needed. Scales are named after their nearest Tailwind family, so a scale called rose replaces Tailwind's built-in rose. Rename it if you'd rather keep both.

@import "tailwindcss";

@theme {
  --color-blue-50: #f6faff;
  --color-blue-100: #e8f2ff;
  --color-blue-200: #d2e5ff;
  --color-blue-300: #b5d4ff;
  --color-blue-400: #5ca3ff;
  --color-blue-500: #1f85f9;
  --color-blue-600: #0071e0;
  --color-blue-700: #005ebc;
  --color-blue-800: #004e9d;
  --color-blue-900: #0f417c;
  --color-blue-950: #082549;

  --color-indigo-50: #f8faff;
  --color-indigo-100: #ebf0ff;
  --color-indigo-200: #d9e2ff;
  --color-indigo-300: #c0ceff;
  --color-indigo-400: #7d94ff;
  --color-indigo-500: #5c71fa;
  --color-indigo-600: #4c5ce9;
  --color-indigo-700: #3f4dc3;
  --color-indigo-800: #34419f;
  --color-indigo-900: #2d387e;
  --color-indigo-950: #19214b;

  --color-indigo-2-50: #f8f9ff;
  --color-indigo-2-100: #edf0ff;
  --color-indigo-2-200: #dce2ff;
  --color-indigo-2-300: #c6ceff;
  --color-indigo-2-400: #8a96ff;
  --color-indigo-2-500: #6d73ff;
  --color-indigo-2-600: #5a52ff;
  --color-indigo-2-700: #4b1ff9;
  --color-indigo-2-800: #3d22ca;
  --color-indigo-2-900: #31279e;
  --color-indigo-2-950: #1b175e;

  --color-purple-50: #fbf8ff;
  --color-purple-100: #f5eeff;
  --color-purple-200: #ecdeff;
  --color-purple-300: #e0c7ff;
  --color-purple-400: #c285ff;
  --color-purple-500: #b05cfa;
  --color-purple-600: #9c41e6;
  --color-purple-700: #8236c0;
  --color-purple-800: #6a2f9c;
  --color-purple-900: #552b7a;
  --color-purple-950: #301747;

  --color-fuchsia-50: #fef7ff;
  --color-fuchsia-100: #fcebff;
  --color-fuchsia-200: #f9d8ff;
  --color-fuchsia-300: #f6beff;
  --color-fuchsia-400: #e969ff;
  --color-fuchsia-500: #dc1ff9;
  --color-fuchsia-600: #c000db;
  --color-fuchsia-700: #a000b7;
  --color-fuchsia-800: #840097;
  --color-fuchsia-900: #6b0e79;
  --color-fuchsia-950: #3d0646;
}