Bug 266440 – Allow CSS Custom Property in mask-icon's color attribute

• Status: NEW
• Component: DOM

[Jordan]

It would be nice if this worked:
```
<link rel="mask-icon" color="--my-color" href="https://assets.com/img/safari-pinned-tab.svg">
```

This tag was implemented before WebKit supported custom properties, so I understand why they don't work, but now that WebKit supports them it would be very nice for developers to not have to hardcode and manually maintain this color value. 

I'm opening a ticket for MS to do the same for their `<meta name="msapplication-TileColor" content="--my-color">` tag.

Thanks!

[Anne van Kesteren]

This should be standardized first. I recommend opening a new issue against the HTML Standard.

[Jordan]

Agreed, but there was a lot hand-wavy talk over there that this is WebKit-only and they may or may not consider changes all depending on WebKit interest and implementation. So I think it needs to start here first.

GH issues regarding changes to mask-icon:
https://github.com/whatwg/html/pull/2230

[Jordan]

whatwg feature request https://github.com/whatwg/html/issues/9997

FWIW I would love to contribute this to WebKit, so if there's a willingness to support it I could try to do it.

[Radar WebKit Bug Importer]

<rdar://problem/120013002>

[Jordan]

Regarding the need to standardize first:

My naive understanding of the spec is that it would actually be appropriate for WebKit to move forward with this addition without waiting for WHATWG. The spec for mask-icon's color says:

"This specification does not have any user agent requirements for the color attribute." (https://html.spec.whatwg.org/multipage/semantics.html#attr-link-color)

My assumption is that's because this is a Safari-only thing, hence WK moving forward with support for Custom Property would be appropriate. It would be a non-proprietary additive feature. It's not too rebellious :)

Regardless, I would like to submit an update to spec the language, but I'm afraid it will land on deaf ears unless WK gives some signal that this would be a welcome update.

The updated spec language I think would be as simple as something like:

*Before*
"The value must be a string that matches the CSS <color> production, ..."

*After*
The value must be a string or CSS Custom Property whose value resolves to a string that matches the CSS <color> production, ..."

Would be happy to help any way I can.