UI Colors is a Tailwind CSS color generator for building and previewing palettes across interface designs. It can generate success, info, warning, and error scales, alongside a custom neutral scale for text, borders, and surfaces. Preview tabs cover cards, websites, branding, dashboards, components, Shadcn/ui, apps, charts, gradients, logos, and headings. Users can pick base and heading fonts from a curated selection; choosing custom fonts is an unlockable feature. A separate Tailwind Colors page covers v3 and v4 colors, with click-to-copy values in OKLCH, hex, and HSL. It also offers real-world UI previews and accessible contrast checks. The API accepts a hex value and returns shades 50–950 in hex and HSL, with a limit of 1,000 requests per minute. API use is restricted from creating a competing app, plugin, or browser extension primarily for generating color scales. The site links to a Figma plugin. A free plan is listed, and pricing starts from $99. UI Colors is available on the web, as an API, and as an extension.
Who it is for
UI Colors suits designers and developers who need to generate Tailwind palettes and inspect how colors appear in interface examples. Its API and extension may also suit workflows that use color scales beyond the web generator.
What is good
- Generates status and neutral color scales
- Previews palettes in multiple interface contexts
- Offers accessible contrast checks
- Copies OKLCH, hex, and HSL values
- Free plan listed
What to know first
- Custom font selection is an unlockable feature
- API limited to 1,000 requests per minute
- API barred from competing color-scale generators
Verdict
UI Colors brings palette generation, interface previews, and contrast checking together, with an API for returning complete shade scales. Buyers should note the API rate limit and its restriction on competing color-scale products.
Compared on color palette generators
- Palette methods
- generate
- Accessibility checks
- Yes
- Export formats
- OKLCH, HEX, HSL
- Saved palettes
- Yes
