Palette Ramp

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.