- From: CSS Meeting Bot via GitHub <sysbot+gh@w3.org>
- Date: Tue, 02 Aug 2022 19:35:19 +0000
- To: public-css-archive@w3.org
The CSS Working Group just discussed `transparency`, and agreed to the following: * `RESOLVED: When calculating color contrast between pairs of semi transparent colors, if the background is opaque, UAs should alpha blend the foreground on the background and use that as the foreground color. If the background is also semi-transparent, it would be alpha blended first with an opaque version of the foreground` * `RESOLVED: Amend previous resolution, the canvas color in previous resolution is TBD` * `RESOLVED: (rather than opaque version of foreground)` <details><summary>The full IRC log of that discussion</summary> <fantasai> Subtopic: transparency<br> <fantasai> github: https://github.com/w3c/csswg-drafts/issues/7358<br> <emilio> lea: current draft doesn't mention transparency<br> <emilio> ... most contrast arguments ignore it<br> <emilio> ... if fg is semi-transparent some algorithms make it work, otherwise ignore it<br> <emilio> ... when you have a range of contrasts there's no answer<br> <emilio> ... one option would be using the minimum contrast<br> <emilio> ... for wcag there's work to compute min/max contrast<br> <florian> q+<br> <astearns> ack florian<br> <emilio> ... if foreground is transparent but bg is opaque you can alphablend but in the bg case it's not so clear cut...<br> <lea> q+<br> <chris> q+ to wonder about mixed domain backgrounds<br> <astearns> ack dbaron<br> <emilio> florian: for fg there's an answer, for background... it's trickier, it's not terribly convenient to find the whole color, but if you're trying what's the best contrasting color against transparent this is not answerable<br> <emilio> dbaron: first intuition is that having a bg that's not opaque should be a syntax error<br> <emilio> ... wrt contrast ranges, maybe alpha-compositing bg with alpha over foreground with no alpha might give you the minimum contrast, but might vary per algo<br> <astearns> ack fantasai<br> <emilio> fantasai: was gonna suggest the same, composite semi-transparent bg over foreground color would give you the worst case scenario<br> <emilio> ... if both semi-transparent it gets extra-exciting, maybe composite against black?<br> <astearns> ack lea<br> <emilio> lea: not sure how we'd specify this so that colors are semi-transparent<br> <emilio> q+<br> <emilio> lea: compositing on black might give you the max contrast<br> <astearns> ack chris<br> <Zakim> chris, you wanted to wonder about mixed domain backgrounds<br> <fantasai> s/so that colors are semi-transparent/so that semi-transparent is invalid<br> <emilio> chris: if you have stuff like iframes that are transparent, does that allow you to find the background behind the iframe<br> <fantasai> i/lea: compositing/TabAtkins: in prose/<br> <astearns> ack em<br> <emilio> TabAtkins: not doing that, there's no way to know what the color will be used on<br> <fantasai> emilio: Making it invalid at syntax time sounds nice, but not possible in current impl<br> <dbaron> s/current impl/the presence of currentColor/<br> <fantasai> emilio: Offhand, I don't expect this to be a super common thing to hapen<br> <florian_irc> s/for background... it's trickier, it's not terribly convenient to find the whole color, but if you're trying what's the best contrasting color against transparent this is not answerable/For background, what authors should be supplying is not the possibly semi-transparent background color of the element, but rather the composited background against which the foreground will be seen. It's not necessarily easy for authors to figure<br> <florian_irc> what that is, but that's the only thing that makes sense. The color-mix function might help./<br> <fantasai> emilio: doing what fantasai and dbaron suggested seems a reasonable compromise to me<br> <astearns> ack dbaron<br> <lea> q+<br> <emilio> dbaron: what I was suggesting if they are both not opaque was to take the foreground, modify alpha to be 1, then composite the bg on top<br> <florian> s_what that is, but that's the only thing that makes sense. The color-mix function might help./__<br> <emilio> ... then compare fg composited against that<br> <emilio> ... that was my intuition for the worst case<br> <emilio> fantasai: [sanity-checks that]<br> <florian> s_to figure_to figure what that is, but that's the only thing that makes sense. The color-mix function might help._<br> <TabAtkins> composite fg over bg over (fg with alpha set to 1)<br> <lea> no need for color-mix(), relative color syntax can do that: lab(from foreground l a b / 1)<br> <emilio> dbaron: new_bg = alpha(fg, 1.0); bg = composite(bg, new_bg);<br> <fantasai> emilio: the goal is to make both opaque<br> <fantasai> emilio: so you need to composit on top of the new background that's opaque<br> <emilio> dbaron: this is sort of speculative, we should work it out in an issue<br> <emilio> astearns: well this would be the issue<br> <emilio> dbaron: underlying question is "does this give you the worst case?"<br> <emilio> lea: intuitively it seems like it might<br> <emilio> fantasai: so generically, we have a canvas that is the foreground with alpha 1, then we draw the background, then the foreground<br> <TabAtkins> fg compared against (bg on top of opaque fg)<br> <emilio> ... if everything is opaque then it all works out<br> <florian> q?<br> <fantasai> s/works out works out easily, otherwise you need to do some compositing/<br> <emilio> florian: sounds like it gives a clear answer<br> <emilio> TabAtkins: how can you get a less contrasting color with the foreground than the foreground itself<br> <astearns> ack lea<br> <emilio> q+<br> <florian> s/clear answer/, not sure it's a great answer/<br> <dbaron> It's probably not the absolute minimum for all algorithms, but it's probably close.<br> <astearns> ack emilio<br> <florian> q+<br> <fantasai> emilio: I'm not sure it'll be the least contrasting color<br> <fantasai> emilio: the least contrasting option would be the compositing the background with the foreground maxed out<br> <fantasai> TabAtkins: that's the suggestion<br> <fantasai> emilio: but that's not quite the same<br> <fantasai> emilio: the least conrasting option with the foreground is the foreground itself<br> <fantasai> emilio: okay, yeah<br> <fantasai> emilio: if you apply the background, then, yes, that should give you the worst. Nevermind<br> <emilio> dbaron: I'm not sure it's the least contrasting. if you state it like fantasai where you have three layers<br> <lea> FWIW this was the research I had done 10+ years ago on min/max WCAG contrast: https://lists.w3.org/Archives/Public/w3c-wai-ig/2012OctDec/0011.html<br> <lea> I can't at a glance tell if the formula for min contrast is what dbaron is proposing<br> <emilio> dbaron: the contrast aren't uniform with blending<br> <astearns> ack florian<br> <emilio> ... so I think there's variations where this might not work<br> <lea> +1 fantasai<br> <emilio> florian: other concern is that if we manage to find the least contrasting situation, we might fall back to black / white unnecessarily<br> <emilio> fantasai: I think dbaron's proposal is the best option, I propose to spec it and let people tell us why we're wrong<br> <fantasai> emilio: I think what I was thinking is along the lines of what dbaron thought earlier<br> <florian> s/unnecessarily/unnecessarily, as what's behind the semi-transparent background might not at all be that worse case scenario/<br> <fantasai> emilio: the worst contrast is when the blend of the color and the color below it is exactly the foreground<br> <fantasai> emilio: using the foreground color itself doesn't give you the worst one<br> <fantasai> emilio: suppose you have a red foreground, opaque red<br> <fantasai> emilio: and you have semitransparent white bg<br> <dbaron> s/of the color/of the background color/<br> <fantasai> emilio: can you get a way such that compositing semitransparent white will end up red?<br> <lea> RESOLVED: When calculating color contrast between pairs of semi transparent colors, if the background is opaque, UAs should alpha blend the foreground on the background and use that as the foreground color. If the background is also semi-transparent, it would be alpha blended first with an opaque version of the foreground<br> <fantasai> TabAtkins: a medium gray foreground, half-transparent black background, clearly the worst contrast is putting it over white<br> <fantasai> TabAtkins: putting over medium gray is not as bad<br> <fantasai> emilio: it's probably good enough<br> <fantasai> florian: could also just put white or black as the backdrop, depending on color scheme<br> <fantasai> emilio: [missed]<br> <fantasai> emilio: Gecko does have some contrast checks for selection<br> <fantasai> emilio: what we do in the case of semintransparent backgrounds is using the default background<br> <TabAtkins> Notably the worst case here is 50% transparent bg. as it gets more or less transparent, the answer becomes easier<br> <fantasai> emilio: basically composit with canvas, can guarantee it's opaque<br> <fantasai> emilio: simpler answer, maybe more correct<br> <fantasai> TabAtkins: how about we resolve for now that we'll adopt this approach with a color TBD<br> <fantasai> TabAtkins: could still use examples and thought<br> <fantasai> RESOLVED: Amend previous resolution, the canvas color in previous resolution is TBD<br> <dbaron> (rather than opaque version of foreground)<br> <TabAtkins> RESOLVED: (rather than opaque version of foreground)<br> </details> -- GitHub Notification of comment by css-meeting-bot Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7358#issuecomment-1203133122 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Tuesday, 2 August 2022 19:35:21 UTC