Back to Plugins
Tailwind CSS Color Generator

Tailwind CSS Color Generator

Full featured & free. Generate Tailwind CSS color palettes as Styles or Variables.

Plugin Preview

Tailwind CSS Color Generator preview

About this plugin

Fully featured and free to use. No in app purchase required. Enjoy :)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:Generate 11-shade Tailwind CSS palettes (50-950) from any hex colorCreate as Figma Styles or VariablesTwo color modes: Perceived (HSLuv) for perceptually uniform colors, or Linear (HSL)Adjustable hue shift, saturation shift, and lightness rangeChoose which stop (50-950) your base color representsReal-time preview of generated paletteCreate in existing variable collections or make new onesSmart updates: re-run with same name to update existing styles/variablesDark mode supportFree to use, no paywalls or signupsPerfect for:Building design systemsCreating brand color palettesTailwind CSS integrationConsistent color scales across projectsBrought to you by Crumb Digital (crumb.com.au)

Plugin Details

Version2
CreatedOctober 12, 2025
Last UpdatedOctober 12, 2025
Categoryshapes-colors
CreatorJamie
Stats124 installs, 23 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:dist/index.html
  • main:dist/code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • https://emailsig.crumb.soy

More Like This

Discover other plugins in the shapes-colors category.