Alternative extension icon on light/dark theme in Chrome

[Simeon Velichkov]

My extension's icon is dark by default, but I have implemented a lighter version as well for all sizes and I'm letting the user to switch between them using `chrome.action.setIcon` and them I'm storing that setting.

That works well for the browser's toolbar and recently for the extension's dropdown thing as well, but on chrome://extensions the icon is still stuck on the default dark one as well as on the extension's default details page and the favicon set on my extension's options page.

Is there a way to update those as well?

[Jackie Han]

Follow up: https://github.com/w3c/webextensions/issues/229

Developers cannot control the extension icon in these places. Browsers should provide a way to adapt to different themes. Even with the icons on the toolbar, developers can't listen to theme changes very well.

According to my observation, developers use the following workaround to solve it:

- Use opposite colors to fill the background and the icon (or the icon shape and the icon inner). 

- Use a color that's not too dark and not too bright for the icon.

This method is not the best effect, nor can it achieve effects like browser built-in icons.

--
You received this message because you are subscribed to the Google Groups "Chromium Extensions" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-extens...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/da447e90-7f76-44a5-b759-02d89b25884en%40chromium.org.

[Patrick Kettner]

Thank you for the suggestions Jackie!

@Simeon currently, those icons are data uri versions of the icons listed in the manifest.json `icons` section. Unless my reading of chromium's source is wrong, the only way they would be able to be changed would be to actually update the files on the disk at those paths. Which an installed extension can't do. If you would like to see that changed, any chance you would open up a bug on crbug.com/new?

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/CAAgdh1LHCONSBTUE8L93%2Bp16dioUZ15_-K%3DV8EDsd1HmKUZ8CA%40mail.gmail.com.

[Jackie Han]

Recently, in Chrome 114, the browser finally detects the theme from the hosting OS - Ubuntu Linux in my case.

Chrome has followed system themes for many years on Windows and Mac.

I do understand that this is sort of like an edge case where your extension icon is dark with no background

It is not an edge case, it is a common case.

I think the difficulty is that the theme is not only system light and dark themes. Users can set custom theme by:

1. install a chrome theme from the Web Store.

2. at chrome://settings/manageProfile, users can pick a theme color (and the scope of each theme is different). 

However, I think the most basic is that the developer provides two types of icons, and the browser automatically selects the best one based on the background color.

On Sun, Jun 18, 2023 at 5:17 PM Simeon Velichkov <simeonv...@gmail.com> wrote:

Thanks, all valid points, just to expand a little bit on where I'm coming from:

Recently, in Chrome 114, the browser finally detects the theme from the hosting OS - Ubuntu Linux in my case. And so if we assume that moving forward the browser itself will make that decision on what theme to use for its internal pages, and there is no way for the user/developer to alter that, then it makes sense to have an option for light/dark icons in the extension's manifest file.

Otherwise `chrome.action.setIcon` works just fine, since the user has control over what theme to pick for the browser's tabs and toolbar, and therefore implementing a light/dark option for the extension's icon solves that issue.

Also, I do understand that this is sort of like an edge case where your extension icon is dark with no background, but at the same it is a perfectly valid case too. Personally I find such icons less distracting, in particular my icons follow the same design and colors of the default icons in the toolbar, the ones for the side panel and the extensions dropdown.

I will most likely open up a feature request ticket on crbug.com/new, thanks.

[Jackie Han]

From the platform's point of view, for the first issue, the icon should not be manually adjusted by the users themselves. For example, the user customizes a theme, and then manually adjusts the icons of all 20 installed extensions by himself (assuming that all extensions provide settings for adjusting icons).

Overall, the problem developers face is:

1. do not know where the icon will be used. There may be many places, e.g. tabs strip icon, toolbar icon, side panel icon, context menu icon, and icons at chrome://extensions/, etc.

2. do not know the background color

3. do not get notified when the background color changes (i.e. the theme changes).

On Sun, Jun 18, 2023 at 6:46 PM Simeon Velichkov <simeonv...@gmail.com> wrote:

Yes, Linux is finally in the club too. What I was trying to explain earlier was that it seems that we have 2 different cases here:

1. One where the user has the ability to set the theme for the tabs and toolbar.

2. Another where Chrome picks the theme from the underlying OS settings, for its internal settings pages.

One is easily solved by using `chrome.action.setIcon`, meaning the user sets the theme, and again the user determines which icon will look best depending on the chosen theme.

The second one is where Chrome itself detects the theme from the underlying OS and decided what theme to use, but it only picks a static icon from the manifest since there is only one.

At least that's how it behaves on my end.