Hi!
I’m Erik, and I’m excited to share the relaunch of UI Colors!
It’s been over 3 years since I launched UI Colors as my side project. Since then, it has grown a lot, with new features, refinements, and improvements along the way.
In April, I lost my job as a Product Designer. Instead of looking for another job, I decided to go all-in on UI Colors and make it my main focus!
Over the past few months, I’ve been working full time to make it better than ever, adding powerful new features and making the entire experience smoother and more useful for designers and developers.
Here’s what’s new in UI Colors 2.0:
🌈 Generate harmonious color scales based on color theory
☑️ Find accessible color combinations using the Contrast Grid
🎨 Add secondary and tertiary color scales to your palette
💾 Save, manage and share your palettes (primary, secondary, tertiary scales)
👀 Preview your color scales on 20+ realistic UI examples
🔧 Create scales with consistent contrast values using the consistent APCA setting
🌓 Toggle between light /dark mode to test your colors in both situations
I’d love to hear what you think!
Thanks for checking it out, and please let me know if you have any feedback :)
Become an affiliate: https://uicolors.lemonsqueezy.co...
@benjamin_anderson3 Thanks! If you’re asking about inverting the color scale, that’s not possible at the moment. For designing in dark mode, you’ll want to use the lighter colors for text and the darker shades for backgrounds. Inverting the scale could be an interesting feature to add though!
I love how focused and purposeful this tool is. By the way does UI Colors allow you to import existing Tailwind config files so you can tweak them on the fly?
Replies
UI Colors
Do the exports work with both Tailwind 2 and 3, or are there any limitations I should be aware of?
UI Colors
@ali09 I am not sure how Tailwind 2 used to handle custom colors, but UI colors has exporting options for both Tailwind 3 and 4.
What a fantastic tool for developers working with Tailwind. Can it also create color palettes from images?
UI Colors
@noahno4 Thanks Noah! It can’t create palettes directly from an image upload, but you can use the pipette tool to pick colors from an image.
I absolutely love this all in one color workflow. Is there an option for a dark mode preview too?
UI Colors
@freddie_leo Thank you! You can switch between light / dark mode in the right upper corner of UI Colors :)
This really makes handling Tailwind colors so much easier. Can you export directly to a config file?
UI Colors
@paul_george7 Yes! But in Tailwind 4, it works a bit differently than in Tailwind 3. See: https://tailwindcss.com/docs/theme
Love this tool. Does the app support custom color scales (like 3–5 steps instead of Tailwind’s usual 9) or is it limited to the default structure?
UI Colors
@amelia_smith19 Thanks for the kind words! Currently, the app sticks to Tailwind’s default scale, so custom color scales aren’t supported yet.
Amazing tool. Can I use this tool to automatically generate dark/light mode variations or is that something I have to do manually?
UI Colors
@benjamin_anderson3 Thanks! If you’re asking about inverting the color scale, that’s not possible at the moment. For designing in dark mode, you’ll want to use the lighter colors for text and the darker shades for backgrounds. Inverting the scale could be an interesting feature to add though!
@erikdevries_nl Is there a way to randomize or auto-generate a color set for some inspiration?
UI Colors
@grayson_parker2 Yes, you can hit the spacebar to create a random color scale
This is incredibly helpful. Is there a way to preview colors in context, like on UI components?
UI Colors
@william_rivera3 Thanks! There are 20+ UI examples on UI Colors to preview your custom color scales
Is it possible to save multiple palettes under a single account?
UI Colors
I love how focused and purposeful this tool is. By the way does UI Colors allow you to import existing Tailwind config files so you can tweak them on the fly?
Are you considering any integrations with design tools like Figma or Sketch?
UI Colors
@ben09 There is a Figma plugin :) https://www.figma.com/community/plugin/1242548152689430610/tailwind-css-color-generator
Congrats on the launch Erik! UI colors is my favorite color tool 🌟
UI Colors
@ozan_oztaskiran Thanks so much for all the support!