ProColor - 100% Accessible Color Palette Generator

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 Generation

1. Dynamic step counts (5, 6, 8, 10, 12, 16)
2. 13 color algorithms (Tailwind, Radix UI, Ant Design, Monochromatic, Hue Shift, Analogous, Complementary, etc.)
3. 15 naming presets (50–900, 1–12, 10–100%, A–F, Material, Bootstrap, etc.)
4. Real-time preview with hex codes and role badges
5. Base color picker + hex input
6. Extract colors directly from Figma objects

♿️ Accessibility & Contrast Built In

1. WCAG 2.2 AA / AAA contrast checking
2. APCA (Advanced Perceptual Contrast Algorithm)
3. OKLCH ΔL contrast model
4. Per-color contrast ratios (vs. white & dark surfaces)
5. Manual-adjustment for failing colors
6. Palette validation with warnings
7. Color Blindness Simulation (9 types)
8. Visual Acuity Simulation (low-vision blur + reduced contrast)
9. High-Contrast Mode Preview

🎛 Fine-Tuning Controls

1. Contrast shift (−20% to +20%)
2. Hue shift (−30° to +30°)
3. Luminance curve (0.5–2.0)
4. One-click reset to defaults

🎨 Color Profiles

1. 13 pre-configured profiles (Tailwind, Material, Radix UI, Fluent 2, Bootstrap, and more)
2. Automatically sets algorithm, naming preset, and steps

🧩 Semantic Color Mapping

1. Assign roles: Primary, Secondary, Warning, Success, Neutral
2. Auto-generate semantic tokens for design systems

📤 Export & Integration

1. Generate palettes as Figma frames
2. Create local color styles
3. Create Figma Variables (scoped folder structure)
4. Export to:

• CSS Variables

• JSON

• Tailwind config

• SCSS / SASS

1. Built-in code drawer with copy buttons

🎚 Gradient Generator

1. Pick any two palette colors
2. Live gradient preview
3. Create gradient layers in Figma
4. Create gradient local styles

🔗 Color Relationships

1. Complementary
2. Triadic
3. Analogous
4. Generate derived palettes from relationships

💡 Inspiration Library

1. 21 system palettes (Material, Radix, Tailwind, etc.)
2. 36 industry palettes (Healthcare, Finance, Tech, E-commerce, Education, Creative)
3. Use any as a base color seed

👁 Visual Features

1. Hue cards with contrast badges
2. Accessibility warnings
3. Smart tooltips with adjustment suggestions
4. Visual acuity simulation
5. Color blindness preview overlay

☕️ Support the project

If ProColor helps your workflow, you can say thanks ☕️

https://buymeacoffee.com/hakanertan

👋 Connect with Me

1. LinkedIn: https://www.linkedin.com/in/hakanertann/
2. About Me: https://hakan-ertan.com/about-me/