Back to Plugins
Palette Ramp

Palette Ramp

Instant color harmonies & Tailwind ramps from any hex, right on your canvas!

Plugin Preview

Palette Ramp preview

About this plugin

Palette Ramp takes any hex color and instantly builds complete, Tailwind-style color ramps using color theory harmonies, no more guesswork, no tab-switching, no manual swatch creation.🛠 How It WorksEnter any hex colorPick a harmony typeToggle Figma Variables on or offHit Generate — your full palette appears on canvas, ready to use!✨ Key Features🎨 Color Harmony Generation Choose from 6 color harmony types: Complementary, Analogous, Split Complementary, Triad, Square, and Rectangle (Tetradic) 📐 Tailwind-Style 11-Step Ramps Every harmony color is automatically expanded into a full 11-step lightness ramp (50–950), matching the scale designers and developers already use. Each step is carefully tuned for saturation and perceptual hue correction so blues don't shift purple and lighter tints stay vibrant.🧩 Native Figma Variable Support Optionally generate Figma Color Variables alongside your ramps. Each step is bound to a named variable (e.g. base/500, complement/200), making your palette instantly available for design tokens, themes, and component styling.📦 Canvas-Ready Frames Ramps are placed directly on your canvas as clean, organized auto-layout frames with labeled chips showing step numbers and hex codes. The source color chip is highlighted for easy identification.

Plugin Details

Version1
CreatedFebruary 26, 2026
Last UpdatedFebruary 26, 2026
Categoryshapes-colors
CreatorJoel Cook
Stats5 installs, 3 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui/ui.html
  • main:dist/code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • none