Color shade generator

About this plugin

A comprehensive Figma plugin that generates complete color systems from a single accent color, creating both primary color palettes and semantically meaningful traffic light colors (success, warning, danger) that maintain visual harmony with your brand. Features direct integration with Figma Variables for instant design token creation.My UX\UI dribbble shots https://dribbble.com/danilefremovKey FeaturesIntelligent Color GenerationSingle Input System: Enter any accent color in HEX, RGB, or HSL format10-Shade Primary Palette: Automatically generates shades from 50 (lightest) to 900 (darkest)Smart Accent Positioning: Intelligently places your original accent color within the appropriate shade levelNon-Linear Distribution: Uses perceptually uniform lightness progression for better visual hierarchySemantic Color SystemTraffic Light Colors: Generates red (danger), yellow (warning), and green (success) colorsStyle Inheritance: Traffic light colors adopt the visual characteristics of your accent colorTemperature Adaptation: Adjusts hue ranges based on whether your accent is warm or cool-tonedConsistent Saturation: Maintains visual harmony while preserving semantic meaningInteractive Preview InterfaceVisual Color Swatches: See all generated colors with clear labels and hex valuesAccent Identification: Original accent color is clearly marked with a star badgeCopy to Clipboard: One-click copying of any color valueOrganized Layout: Primary colors and semantic colors displayed in separate, logical sectionsReal-time Feedback: Instant visual updates when regenerating palettesDual Export Options1. Add to FileVisual Frames: Creates organized color frames directly on your Figma canvasSmart Labeling: Each frame includes shade name and hex value with auto-contrast textGrouped Organization: All colors organized in a container frame with proper spacingAuto-positioning: Places new palette frames without overlapping existing content2. Add to Variables ⭐One-Click Variable Export: Instantly add generated colors to your Figma file's Variables systemStructured Variable Collections: Creates organized collections with professional naming conventionsDesign Token Ready: Variables are immediately ready for design system implementationAutomatic Organization: Primary colors and semantic colors properly categorized