Color Palette Builder

About this plugin

Create professional color palettes with automatic Figma Styles and Variables. Perfect for brand designers and design system developers.

Palette Generation

1. 6 harmony types: Monochromatic, Complementary, Triadic, Analogous,
2. Split-Complementary, and Tetradic
3. Generate 3-8 colors per palette
4. Interactive preview with click-to-edit swatches
5. Lock specific colors while regenerating others
6. Custom naming for each color

Brand System Features

1. Tint & shade scales: 10 lightness variations (50-900) for each color
2. Neutral palette: Auto-generated whites, grays, and blacks tinted with your palette hue
3. 60/30/10 proportion guide: Visual balance reference with customizable color mapping

Accessibility

1. WCAG contrast checker showing AA/AAA compliance for text on each color
2. Color pair matrix displaying contrast ratios for all combinations

Development Ready

1. Dark mode variables with automatic lightness inversion
2. Code export in CSS Variables, SCSS, Tailwind config, or JSON tokens

What Gets Created

1. Figma color styles and variables for easy reuse in your file
2. Visual documentation frames on your canvas

Start with any color, and the plugin generates a complete, production-ready color system in seconds.