Back to Plugins
ColorGen

ColorGen

Effortlessly craft vibrant color palettes & gradients & bring them straight into Figma—fun included.

color palettegradientscolor scale

Plugin Preview

ColorGen preview

About this plugin

Colorgen – Your Ultimate Color Toolkit for FigmaThis is my first plugin! ColorGen is an all-in-one color workflow plugin for modern designers who want better palettes, gradients, and scalable color systems directly inside Figma. Generate, preview, apply, and organize colors faster, then bring them into your file as artboards and Variables.Key FeaturesSmarter Color Palette GeneratorGenerate unique 5-color palettes using harmony modes (Random, Analogous, Monochromatic, Complementary, Triadic) with improved color logic and more design-friendly results.Tailwind CSS Color GeneratorCreate full Tailwind-style scales (50–950) from HEX, HSL, or Random input.Includes synced HEX + HSL controls, auto color naming, and fast regeneration.Gradient Generator (Enhanced)Generate curated gradients with editable stops and direct apply-to-selection support.Control gradient output with:Mood presets (for more distinct visual styles)Gradient type (Linear, Radial, Angular, Diamond, or Auto)Number of stops (2–7 or Auto)Figma Variables SupportOptionally create/update real Figma Variables from generated palettes and Tailwind scales, while also adding visual artboards to the canvas.Add to Canvas in One ClickInstantly insert palette and scale artboards into your Figma file for design system reference and handoff.HSL Color Game (Improved Difficulty)A built-in game that now scales in challenge over time with progressive difficulty tiers, increasing grid complexity, and subtler color differences.Resizable Plugin WindowResize the plugin panel so longer generators (like Tailwind + gradients) are easier to use.ColorGen is built to make color exploration practical, system-friendly, and fun. Feedback is welcome and helps shape future updates.Roadmap / Areas for ImprovementContinue improving palette quality with richer color models and additional generation strategies.Expand advanced controls for semantic color systems and accessibility-first palette suggestions.Add palette generation from uploaded/selected images.Add export/import options for token workflows.

Plugin Details

Version4
CreatedNovember 3, 2024
Last UpdatedMarch 2, 2026
Categoryediting & effects plugins
CreatorJacquelyn Halpern
Stats39 installs, 5 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • https://cdn.jsdelivr.net
    • https://cdn.tailwindcss.com