Original Summary

was annoyed by the current color palette tools, but always loved the approach described in the famous stripe color palette blog and now i made a tool out of it shades of all colors stay at the same contrast - easy to use in modern design libraries other color palettes are inconsistent, or dont let you freely pick your colors. tailwind always looks the same. also shades in tailwind contrasts are not scaled properly. been bugged by this for years. you pick a tailwind-ish palette, put white text on blue-600, looks fine. same text on yellow-600, unreadable. same number, completely different contrast. so you end up eyeballing every pairing and hoping. tool: https://sir-hennihau.github.io/science-color-palette/ code: https://github.com/sir-hennihau/science-color-palette you give it a color, or even several if you want to, and it fills out the rest of the spectrum and builds a full ramp for each family. export it when you're happy with it. the whole thing hangs on placing shades by relative luminance, which is the only thing web content accessibility contrast actually depends on. every ramp climbs the same ladder, so 600 means the same thing whether it's blue or yellow or teal. three of the steps aren't approximate either, they're solved: 500, 600 and 700 land on 3:1, 4.5:1 and 7:1. measured against the ramp's own 50 shade, since that's the background you actually put them on, and checked on the final 8-bit hex rather than the ideal color, because that last rounding is enough to drop you under. stripe used cielab, which was the right call in 2019. i went with oklab instead, mainly because cielab , because it is a more modern color space. chroma is a share of whatever the hue can actually reach at that lightness (idea stolen from hsluv) instead of a fixed ceiling. that's what makes yellow go vivid early and blue go vivid late without me hardcoding anything per hue. free, no account, no sign up. would be glad to hear if it is useful (or why not) to any of you.   submitted by   /u/sir__hennihau [link]   [comments]


  • 情报分类:商业与市场研究
  • 分类依据:内容涉及商业、投资或市场动态
  • 信息来源:Reddit · SaaS
  • 发布时间:2026/9/20 05:56:13