Tailwind palette

The violet palette

An 11-step violet ramp generated in OKLCH for perceptually even lightness steps, gamut-mapped to sRGB. Copy the Tailwind v4 config below and drop it straight into your project.

50#F6F3FF
100#E9E3FF
200#D7CDFF
300#BDADFF
400#A78CFF
500#8B5CF6
600#774FD9
700#6047B2
800#483A89
900#3A326D
950#191437
tailwind.config — v4@theme
@theme {
  --color-violet-50: #f6f3ff;
  --color-violet-100: #e9e3ff;
  --color-violet-200: #d7cdff;
  --color-violet-300: #bdadff;
  --color-violet-400: #a78cff;
  --color-violet-500: #8b5cf6;
  --color-violet-600: #774fd9;
  --color-violet-700: #6047b2;
  --color-violet-800: #483a89;
  --color-violet-900: #3a326d;
  --color-violet-950: #191437;
}
Open in the generatorAll colour palettes

More palettes