Tailwind CSS Color Generator

About this plugin

Create professional 11-shade color palettes (50-950) instantly.

Choose between Perceived (HSLuv) or Linear (HSL) color modes, adjust hue, saturation, and lightness, and export as Figma Styles or Variables. Perfect for design systems and Tailwind CSS projects.

✨ Features:

1. Generate 11-shade Tailwind CSS palettes (50-950) from any hex color
2. Create as Figma Styles or Variables
3. Two color modes: Perceived (HSLuv) for perceptually uniform colors, or Linear (HSL)
4. Adjustable hue shift, saturation shift, and lightness range
5. Choose which stop (50-950) your base color represents
6. Real-time preview of generated palette
7. Create in existing variable collections or make new ones
8. Smart updates: re-run with same name to update existing styles/variables
9. Dark mode support
10. Free to use, no paywalls or signups

Perfect for:

1. Building design systems
2. Creating brand color palettes
3. Tailwind CSS integration
4. Consistent color scales across projects

Brought to you by Crumb Digital (crumb.com.au)