Colorca

Maker

Hey Product Hunt! 👋 I’m excited to share Colorca, an online tool that speeds up designing color palettes for digital products. 🤔 Why bother? Creating a color palette can be tedious, especially when you care about WCAG accessibility requirements. It’s back-and-forth tweaking shades for individual hues and checking color contrast for each color combination. It all gets even more cumbersome when using default color models such as RGB or HSL in your favorite design tool. Picking colors via RGB is a roulette. Using HSL results in unpredictable contrast among different hues with the same lightness. 🎨 Evenly perceived lightness with HSLuv Colorca uses the HSLuv color model to define colors, which lets you easily define different color hues with evenly perceived lightness. So if you have Red and Blue text with the same lightness, both shades will have almost identical contrast against the same background. That’s a huge win because you can combine colors based on their lightness, and you don’t need to bother about hue differences. Compare a few hues with Colorca’s WCAG Contrast Checker to see the magic 🪄. 🌞 Defaults based on what works Default lightness steps in Colorca are based on IBM Carbon Design System to give you a headstart for designing a balanced palette for light and dark themes. IBM’s design team has done a great job defining the evenly spaced lightness steps for complex interfaces. Of course, you can adjust them to your preference. 💡 Open to feedback and improvements I’ve started Colorca as a personal tool to speed up my process. Hoping this could be helpful for more designers, I’ve decided to make it available for the community. I look forward to making it a valuable tool for a wider audience, so any feedback is highly appreciated. Thank you! 🙏 Brano, Maker of Colorca

Report

Share

2yr ago