ProColor - 100% Accessible Color Palette Generator
Generate accessible color palettes, from base color to shipped tokens.
Plugin Preview
About this plugin
ProColor - Accessible color palettes, from base color to shipped tokens.Design-grade color generation with built-in accessibility, contrast science, and Figma-native workflows.Perfect for design systems, product teams, and anyone who needs truly reliable color.🌈 Core Palette GenerationDynamic step counts (5, 6, 8, 10, 12, 16)13 color algorithms (Tailwind, Radix UI, Ant Design, Monochromatic, Hue Shift, Analogous, Complementary, etc.)15 naming presets (50–900, 1–12, 10–100%, A–F, Material, Bootstrap, etc.)Real-time preview with hex codes and role badgesBase color picker + hex inputExtract colors directly from Figma objects♿️ Accessibility & Contrast Built InWCAG 2.2 AA / AAA contrast checkingAPCA (Advanced Perceptual Contrast Algorithm)OKLCH ΔL contrast modelPer-color contrast ratios (vs. white & dark surfaces)Manual-adjustment for failing colorsPalette validation with warningsColor Blindness Simulation (9 types)Visual Acuity Simulation (low-vision blur + reduced contrast)High-Contrast Mode Preview🎛 Fine-Tuning ControlsContrast shift (−20% to +20%)Hue shift (−30° to +30°)Luminance curve (0.5–2.0)One-click reset to defaults🎨 Color Profiles13 pre-configured profiles (Tailwind, Material, Radix UI, Fluent 2, Bootstrap, and more)Automatically sets algorithm, naming preset, and steps🧩 Semantic Color MappingAssign roles: Primary, Secondary, Warning, Success, NeutralAuto-generate semantic tokens for design systems📤 Export & IntegrationGenerate palettes as Figma framesCreate local color stylesCreate Figma Variables (scoped folder structure)Export to:• CSS Variables• JSON• Tailwind config• SCSS / SASSBuilt-in code drawer with copy buttons🎚 Gradient GeneratorPick any two palette colorsLive gradient previewCreate gradient layers in FigmaCreate gradient local styles🔗 Color RelationshipsComplementaryTriadicAnalogousGenerate derived palettes from relationships💡 Inspiration Library21 system palettes (Material, Radix, Tailwind, etc.)36 industry palettes (Healthcare, Finance, Tech, E-commerce, Education, Creative)Use any as a base color seed👁 Visual FeaturesHue cards with contrast badgesAccessibility warningsSmart tooltips with adjustment suggestionsVisual acuity simulationColor blindness preview overlay☕️ Support the projectIf ProColor helps your workflow, you can say thanks ☕️https://buymeacoffee.com/hakanertan👋 Connect with MeLinkedIn: https://www.linkedin.com/in/hakanertann/About Me: https://hakan-ertan.com/about-me/
Plugin Details
| Version | 4 |
|---|---|
| Created | November 24, 2025 |
| Last Updated | December 2, 2025 |
| Category | Accessibility tools |
| Creator | Hakan Ertan |
| Stats | 260 installs, 52 likes |
| Pricing | Free |
Technical Details
- API:1.0.0
- main:code.js
- Document Access:dynamic-page
- Editor Types:figma
- Allowed Domains:
- none
More Like This
Discover other plugins in the Accessibility tools category.
Stark - Contrast & Accessibility Checker
Fix Color Contrast and Typography issues and add WCAG annotations for a smooth design to dev handoff
Contrast
Quickly check and scan for contrast issues on gradients, images, blends, and fills.
Color Palettes ( Colorsinspo ) : Color & Accessibility Tools
A free suite of integrated Color & Accessibility tools - 10+ tools free access 🔥