Back to Plugins
UI Color Palette /figma・WCAG Color Palette Manager for Apps & Websites

UI Color Palette /figma・WCAG Color Palette Manager for Apps & Websites

Color Palettes that meet WCAG Guidelines and Operations (tailored for individuals)

accessible color palettepalettecolor palette generatoraccessibilityoklchcontrastcolor systemcolor palettecolorwcagwcag-checkerscolorapcacolor scalelch

Plugin Preview

UI Color Palette /figma・WCAG Color Palette Manager for Apps & Websites preview

About this plugin

New UI Color Palette 5.0 Millésime is a fresh-from-the-oven version with a batch of new features, such as new exports, alpha, and contrast mode.


UI Color Palette is a Figma, Dev mode, and FigJam plugin that creates, manages, exports, 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.


---


UI Color Palette /figma is the original plugin where the subscriptions are actually managed by Figma and tailored for individuals. If you're looking for a scalable solution for your team, check out UI Color Palette /one.


---


Join the Discord server to have help, share your ideas, ask questions, etc: uicp.ylb.lt/community


---


Create, Manage, Export, and Publish color palettes


Create your accessible palette in seconds

  1. Pick your brand colors directly or pull from Coolors, Realtime Colors, or Colour Lovers (1M+ palettes)
  2. Set up lightness levels using preset systems like Material 3, Ant Design, Tailwind, or make your own
  3. Pick your preferred color space: LCH, OKLCH, LAB, OKLAB, HSLuv, or HSL


Manage the color scaling that complies with WCAG

  1. Check contrast with WCAG 2.1 and APCA
  2. Build light, dark, or colorblindness (protanomaly, deuteranomaly, etc) color modes
  3. Turn the shades/tints into transparency


Export the palette as color primitives

  1. Sync colors to `local styles` and `variables`
  2. Export as tokens in many formats: DTCG, Tokens Studio, Style Dictionary v3
  3. Generate code for Apple and Android Apps: SwiftUI, UIKit, Kotlin, and XML


Publish the palette for reuse and sharing

  1. Store palettes in the cloud to use them on several platforms: Penpot and Sketch
  2. Share your most loved palette with the community of UI Color Palette users
  3. Hunt the perfect palettes from the community of UI Color Palette users


---


Useful links


Have Help

  1. Read the documentation
  2. Contact support


Get Involved

  1. Submit feedback
  2. Share your ideas


Give Support

  1. Follow the plugin LinkedIn page
  2. Follow the author page


---


Quick info


🖥️ Website: www.ui-color-palette.com

📰 UI Color Palette release note: uicp.ylb.lt/whats-new

🧭 Browser complete compatibility: Figma Desktop App, Chromium-based browsers (Arc, Edge, Chrome, etc)

🧭 Browser partial compatibility: Mozilla Firefox, Apple Safari

📦 The plugin is open-source. Feel free to watch, fork the repository, or request a merge

👨‍🎨 Made by Yelbolt, products that cut the pain and spark the brain

Plugin Details

Version72
CreatedJanuary 14, 2022
Last UpdatedSeptember 17, 2025
CategoryAccessibility tools
CreatorAurélien Grimaud
Stats16275 installs, 746 likes
PricingPaid

Technical Details

  • API:1.0.0
  • UI:./dist/index.html
  • main:./dist/plugin.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • https://*.amazonaws.com
    • https://*.figma.com
    • https://*.githubusercontent.com
    • https://*.googleusercontent.com
    • https://*.gravatar.com
    • https://*.mixpanel.com
    • https://*.sentry.io
    • https://*.wp.com
    • https://*.yelbolt.workers.dev
    • https://asset.brandfetch.io
    • https://corsproxy.io
    • https://figma.com
    • https://fonts.googleapis.com
    • https://fonts.gstatic.com
    • https://www.colourlovers.com
    • https://zclweepgvqkrelyfwhma.supabase.co