Accessible Palette Generator

About this plugin

Accessible Palette Generator

Create accessible color scales and sync them to Figma Variables! instantly.

Designing accessible color systems shouldn’t slow you down. Accessible Palette Generator lets you build consistent tint and shade scales from a single base color, validates contrast ratios against WCAG standards in real time, and exports everything directly into Figma Variables with one click.

⚡ Key Features

1. Smart Color Scales
2. Generate balanced tint and shade ramps from any HEX color using a consistent HSL-based algorithm.

Built-in Accessibility Checks

Instantly see WCAG 2.1 contrast ratios (AA & AAA) for every color against both white and black text.

Figma Variables, One Click Away

Export colors directly to Local Variables with support for custom Collections and Groups

(e.g. Brand Colors / Primary).

Native Figma Experience

A clean, familiar UI that feels right at home in Figma — with full Light & Dark mode support.

🛠 How It Works

2.Pick a base color

Use the color picker or paste a HEX value.

2.Customize your scale

Control the number of tints and shades to match your system needs.

3.Validate accessibility

Instantly identify which colors pass or fail WCAG contrast requirements.

4.Create Variables

Export the full palette directly into your design system.

🔒 Privacy First

This plugin runs entirely inside Figma.

No data is collected, stored, or sent to external servers.

Created by [Your Name / Team]