UI Colors
Simple web tool for generating customizable color scales with real-time editing, export options, and Figma integration.
Pros
- Quickly generate color scales with UI examples
- Figma plugin
Cons
- Many features require a pro account
UI Colors is a web tool built for creating and editing color scales quickly and easily. You start with a single color and generate a full range of lighter and darker shades. The tool lets you control hue, saturation, and lightness with sliders, making it easy to adjust colors until they feel balanced and consistent.
Once your palette is built, you can export colors in multiple formats including CSS, JSON, and directly into Figma. It is a clean, focused tool that helps build color systems for digital projects without needing extra plugins or complicated steps. The interface stays out of the way and lets you focus on creating colors that actually work together.
For developers working with Tailwind CSS, UI Colors also generates ready-to-use color tokens that fit directly into a Tailwind config. But for everyone else, it works just as well as a general-purpose color tool for building palettes for any design system, website, or product.


More
Color Generators
Accessible Color Palette Generator
Browser tool that generates accessible UI palettes for light and dark modes, balancing perceived lightness, contrast rules, and practical UI roles.
Adobe Color
Color tool for building palettes, pulling themes from images, and syncing color systems across your Adobe apps.
ColorBox
Tool for generating accessible color palettes with customizable steps, contrast indicators, and dark mode variants.
Khroma
Generate infinite color combinations with an AI tool that adapts to your favorite colors.
Color Hunt
A curated collection of beautiful color palettes that are created and submitted by the community.
Get a grip on your design
resources and join our community
Free Membership
Current Membership
Save your favorite resources to your personal board for quick access and easy referencing.
- Create 1 board
- Save 10 resources
- Share your saved board with your team and network
- Rate and suggest resources
- Access to curated boards
- Be the first to discover new tools, trends, and insider perspectives
Premium Membership
Save your favorite resources to your personal board for quick access and easy referencing
- Create 50 boards
- Save 50 resources per board
- Share your saved board with your team and network
- Rate and suggest resources
- Access to curated boards
- Be the first to discover new tools, trends, and insider perspectives
Save this resource to a board.
Before saving a resource a board needs to be created.
Save to favorites.
Add to my list.
Name your new board:
Edit Board
Share or Delete Board
Are you sure you want to delete this Board?
Delete from my favorites.Are you sure you want to delete this Resource?
Remove from this board.Suggest a resource, report a broken or expired link.
Send We See Giants a message.
Free Membership
Current Membership
Save your favorite resources to your personal board for quick access and easy referencing.
- Create 1 board
- Save 10 resources
- Share your saved board with your team and network
- Rate and suggest resources
- Access to curated boards
- Be the first to discover new tools, trends, and insider perspectives
Already have an account? LOGIN