[v4] Consider darkening text colors

[khinshankhan]

With v4, using a class like text-accent-11/60 results in css like color-mix(in srgb, var(--color-accent-11) 60%, transparent). This is a great improvement from v3 as it allows for any color type rather than using a hack to specify alpha.

However, what if I want to darken text? There doesn't seem to be an easy way to generate something like color-mix(in srgb, var(--color-accent-11) 60%, #fff).

My initial thought was maybe on "opacities greater than 100" instead of using transparent use black but in hindsight, black isn't quite the opposite of transparent and it doesn't seem intuitive. Also, there may be cases for wanting custom colors for the mix instead. What if we used a css variable here so that text-accent-11/60 generates color-mix(in srgb, var(--color-accent-11) 60%, --tw-color-mixin) and by default that's transparent but can be customized via another class eg mix-text-[color]?

Interested in other thoughts. May be related to #11321

[thesmartwon]

The issue with --tw-color-mixin is that there'd have to a different mixin variable for each supported color property. What if you wanted to mix one color with the background and another with the border?

I've proposed a different syntax that addresses this: #14827 (comment)