Shade & Palette Generator
One color in, a whole system out — OKLCH shade scales, palettes, variables & styles. (84 chars)
Plugin Preview
About this plugin
Never fight with color again. Shade & Palette Generator turns a single color into a complete, production-ready system in seconds. No color theory, no eyeballing hex values, no manual tweaking.Pick any color, or click a swatch already in your file, and instantly get an 11-step shade scale (50 → 950) built with OKLCH color science. The same perceptually-uniform approach behind Tailwind CSS v4. Lightness steps stay even and hue stays true across the whole ramp, with in-gamut mapping so nothing clips or turns muddy.Need a full palette, not just shades? Generate matching Complementary, Analogous, Triadic, Split, and Monochrome harmonies from your base color and drop them onto the canvas as labeled swatches.When your colors are right, push them straight into your file: • Add shade scales and palettes to the canvas as labeled swatches • Create Figma color styles in one click • Create Figma variables (as a proper collection) in one clickWhether you're starting a brand, building a design system, or just need colors that go together, this takes the guesswork out of color — so you can get back to designing.FREE • OKLCH shade scale (50 → 950) • Add shade scale to canvasPRO (7-day free trial) • Harmony palettes: Complementary, Analogous, Triadic, Split, Monochrome • One-click Figma variables • One-click Figma color styles • Add palettes to canvas
Plugin Details
| Version | 3 |
|---|---|
| Created | July 7, 2026 |
| Last Updated | July 13, 2026 |
| Category | editing & effects plugins |
| Creator | Dave Tindi |
| Stats | 41 installs, 5 likes |
| Pricing | Paid |
Technical Details
- API:1.0.0
- UI:ui.html
- main:code.js
- Document Access:dynamic-page
- Editor Types:figma
- Allowed Domains:
- none
More Like This
Discover other plugins in the editing & effects plugins category.