Welcome aboard!

Get started quickly!

UI Color Palette is a Figma and FigJam plugin that creates, manages, deploys, and publishes consistent and accessible color palettes. The plugin uses alternative color spaces, like LCH, OKLCH, CIELAB, OKLAB, and HSLuv, to create color shades and tints based on the configured lightness scale. These spaces ensure WCAG standard compliance and sufficient contrast between information and background color.

This plugin will allow you to:

Create a complete palette from any existing color to help you build a color scaling (or Primitive colors)
Manage the color palette in real-time to control the contrast
Sync the color shades/tints with local styles and variables
Generate code in various languages
Publish the palette for reuse across multiple documents or add shared palettes from the community

If you use the plugin in the Dev mode or the VS Code plugin, you must ask a designer to create the palettes on the current page. Learn more about the plugin capabilities.

For a quick start, you can refer to this demo:

And these pages: