Chameleon

About this plugin

🦎 CHAMELEONChameleon is a Figma plugin that turns color token management into a breeze. Build smart palettes, structure tokens, and export directly into native Figma Variables.🎨 KEY FEATURES🎨 Smart palette generation — create harmonious color ramps from a single base color🌒 Auto dark theme — instantly generate dark versions of your palettes♿ A11Y mode — contrast-optimized palettes that meet WCAG accessibility standards🧷 Figma Variables export — full support for collections, modes, and cross-collection aliases📤 JSON import/export — compatible with Figma Variables and Token Studio✏️ Flexible structure — rename shades, palettes, collections, and modes while preserving links🌒 AUTO DARK THEMEInstantly generate perceptually balanced dark palettes based on your light theme.How it works:Inverts brightness scale: lightest shade (50) becomes darkest, darkest (900) becomes lightestBase color remains at position 500Brightness follows a perceptual (non-linear) scaleSaturation is increased for dark shades, reduced for light onesAdditional correction ensures visual harmony🎨 BASE MODEBest for:Creating aesthetic palettes without strict contrast rulesBranding and accent color systemsVisually balanced UIs with emphasis on artistic controlGeneration logic:Base color is placed at center (shade 500)Builds out lighter (50–400) and darker (600–900) shadesBrightness and saturation adjust relative to the base♿ A11Y MODEPalettes generated with perceptual brightness, ensuring strong contrast between shades.Best for:Interfaces requiring WCAG complianceGovernment, medical, educational and fintech productsInclusive design for wide audiencesGeneration logic:Builds a scale of perceived brightnessBase color is positioned where its brightness fits bestShades are calibrated for target contrastContrast between neighbors ≥ 1.3:1📌 HOW TO USECreate your base palettes in the "Global" tab (5 to 15 shades)Enable A11Y mode if neededSwitch between light and dark themes to evaluate the resultExport everything to Figma Variables or JSONYoutube⚙️ UINDER YHE HOODHSL-based ramp generationEdge brightness: Light — 95% → 20%, Dark — 15% → 85%Auto positioning of base color (especially in A11Y mode)Built-in WCAG contrast checkerVisual base marker (★)Full support for Figma Variables & Token Studio structure🚧 STATUSThis plugin is in beta. We welcome feedback and are actively improving it.