ui-palette-generator

UI Palette GeneratorUI Palette Generator is a Figma plugin that instantly creates accessible light and dark UI color palettes based on a single primary color. Perfect for designers building scalable, consistent design systems, it automatically generates all necessary palette shades, hover states, backgrounds, and text colors — ensuring optimal contrast and readability.

Key FeaturesPrimary-to-Palette GenerationCreate a full set of primary, secondary, success, warning, error, and info colors from one primary color.

Background Shades (z0–z5)Smoothly blended background colors for depth and elevation in both light and dark themes.

Hover VariantsAutomatically generates hover states for all palette colors.

Text ScalesIncludes base, light, lighter, and lightest text opacities.

Text on PaletteProvides accessible text-on-color pairs (e.g., textBaseOnPrimary).

Variable Mode SupportAdds light and dark palettes as variable modes with one click (free plan adds only the selected theme).

Live PreviewInstantly see how generated colors look in real UI components.

Ideal for UI designers and teams who need fast, accessible, and systematic color palettes that are ready to use in Figma.