Difference between “-webkit-text-fill-color” and “color”?

From the WebKit blog:

text-fill-color – This property allows you to specify a fill color for text. If it is not set, then the color property will be used to do the fill.

So yes, they are the same, but -webkit-text-fill-color will take precedence over color if the two have different values.

I think the rationale for this is that you can choose a different color if you want when using -webkit-text-stroke, but it will gracefully fall back to color if -webkit-text-stroke isn’t available (and thus -webkit-text-fill-color isn’t either). There may be cases where you would otherwise end up with unreadable text.

Please note that, as of 2021, -webkit-text-fill-color (and probably other -webkit prefixed properties) are not necessarily exclusive to WebKit-based browsers (i.e. it works in Firefox).

Leave a Comment