Post

Try the latest <color-input> concept: ⚓️ anchor() progressive enhancement 🤖 workers for color compute 🙈 new animations & interactions 🎨 gamut boundaries, mapping, stretching ☯️ contrast scores & much more nerdy.dev/rfc-latest-c...

This is getting really good! Love that the jitter is completely gone from the 2d picker. Would you accept a PR that adds contrast indicators like these?

I had them on there for a little bit! But removed them in favor of the values and info at the bottom right (new), since the lines felt like clutter and only represented one But maybe!? Make a case about something I missed?

well, one thing is you almost never want to measure against white or black, and for WCAG there's three lines you might want to be aware of with one (the lightest one) being the relevant one (small, large text or non-text, AA or AAA) and the other ones being informative.

i'm not going to add UI so you can specify a color to contrast against, or UI so you can set a font size… sounds like another tools job to me

i also dont have an embeddable version that exists not in the popup… sounds like, for you to adopt this component into that tool you showed (which does control font size and color), you'd like all 3 contrast boundaries drawn as well as an inline render mode yeah?

Yeah I’m pretty happy with all my design choices. Having wide gamut support and a modern color system is a strong pull though!

My contrast lines appear automatically when a bg color and font size is passed through as data, which can come from various places, otherwise they’re not rendered. There’s no ui in the color picker to manage that.

yeah, the inline aspect is more clean cut, tracking it here github.com/argyleink/cs... passing in font size and contrast color so the lines are relevant to your specific tool tho… a bit more niche