[css-color] Alpha component of "color" property and color glyphs


There is a question that, should the alpha component of "color" property
affect color glyphs like other normal glyphs? Our opinion is, it should not.

Currently, in WebKit and Edge, alpha of "color" doesn't affect color
glyphs, which means even if you specify "color: transparent", you can still
see color glyphs. In Blink, the alpha of "color" decides the opacity of
color glyphs like other glyphs. In Gecko 45, the behavior is mostly like
WebKit and Edge, but color glyphs disappear when color is totally
transparent, due to a misoptimization. However, since Gecko 46, the
behavior is changed to Blink's.

The spec says, "color" is "the foreground fill color of ... text content".
It seems to me it also means alpha component, just like other components,
should not affect color glyphs, since those glyphs do not use fill color at

It would also affect "background-clip: text", as people generally use
"color: transparent" (or actually "-webkit-text-fill-color: transparent")
to hide the text. However, hiding color glyphs and leaving the outline
there like normal glyphs doens't make much sense. Most emojis would end up
being just a circle in that case, which completely loses their original

If authors want to make a piece of text, including color glyphs,
translucent, opacity is always the right property to use.

Given these, we think WebKit and Edge's behavior, which also matches the
spec, is most sensible, and we are going to switch to that behavior as well.

I think given it is not fully interoperable at the moment, and authors may
have contrary expectation intuitively, this is at least worth a note in the
spec saying something like, "color property, including its alpha component,
does not affect glyphs which do not use fill color (e.g. color glyphs).
Authors are suggested to use opacity if they want to make them translucent
as well."


- Xidorn

Received on Thursday, 31 March 2016 05:05:59 UTC