3 ms·
Only have a screenshot to show at the moment, but I'm working on an accessible color palette creator tool for web/UI design: https://x.com/seanw_org/status/181
by seanwilson 2y ago
Only have a screenshot to show at the moment, but I'm working on an accessible color palette creator tool for web/UI design:
https://x.com/seanw_org/status/1815442179361317022 https://x.com/seanw_org/status/1815442179361317022
There's lots of tools in this space, but the key features of this is it lets you easily check the contrast of any color pair (not just against white, so you can check e.g. your text colors will contrast on off-white shades), it's for creating a full palette of colors vs a handful of brand colors (you always end up needing lighter/darker variants for things like borders and backgrounds), and you can alter how the hue/saturation/lightness varies across a whole swatch of colors with a few clicks (being able to visualise these curves also makes picking new colors really easy).
Feel free to reach out if you think this might be useful to you!
- sunnybeetroot 2y agoThis is great! One feature that I use ChatGPT for is “give me the closest foreground color to X that meets AAA accessibility on Y background color”. ChatGPT that calculates it with a python script. Has been super useful. Maybe it could work on your site?
- seanwilson 2y agoYeah, that's the kind of use case I want to make easy! One of the tricky parts when working with ~100 colors is how you can easily tell the tool which pairs should always contrast so it can check them automatically, instead of you having to keep selecting pairs to check. It's simple right now though to make all colors of the same grade have the same lightness so you get easy to remember contrast guarantees e.g. green-700 will have WCAG AA contrast on grey-100, and the same for any 700 (or above) vs 100 (or below) pairing.