W3C home > Mailing lists > Public > whatwg@whatwg.org > June 2015

[whatwg] Icon mask and theme color

From: Kornel Lesiński <kornel@geekhood.net>
Date: Mon, 15 Jun 2015 11:18:38 +0100
Message-Id: <7EF0D0E1-A46E-41E0-9F0E-CD9D64B89C8F@geekhood.net>
To: WHAT Working Group <whatwg@lists.whatwg.org>
Apple has released a version of Safari that has a new interpretation of <link rel=icon> and <meta name=theme-color> that conflicts with existing usage on the Web.

Safari (8.1 OS X 11.11) uses `theme-color` for foreground color of favicons of pinned tabs, but other browsers use `theme-color` for background colors. This makes it impossible to have a light theme color that fits Chrome's background and a dark pinned icon color that suits Safari (rdar://21379839).

Additionally Apple introduced a `mask` attribute on the link element that is merely modifying the link relationship, but in a way that is incompatible with other browsers.

To avoid compatibility problems I suggest specifying a way to define icon masks and colors in a way that doesn't conflict with usage on the Web. 

The new Safari is still only a preview, so I hope Apple will switch to a better solution.

To prevent user agents from using theme-color in conflicting ways I suggest defining theme-color to be a background color:


and adding a new meta:

<meta name="icon-mask-color"> to define color for the favicon specifically.

Additionally I suggest defining `icon-mask` link relationship for an icon that user agent can colorize:

<link rel="icon-mask" href="silhouette.svg">

This way authors can control whether they want the icon to be reused as a regular icon, with <link rel="icon icon-mask">, or not, by using this relationship alone.

Kind regards, Kornel Lesiński
Received on Monday, 15 June 2015 10:19:17 UTC

This archive was generated by hypermail 2.4.0 : Wednesday, 22 January 2020 17:00:32 UTC