Improving white background systray icons for dark themes

Community Guides
,
1

If you are having issues with your systray icons having white background this might improve the icons, if you are using SVG icons.

It will make the icons go from white-icons to color-icons

First you need to find the folder with the systray icons, icons can be installed in ~/.icons or /usr/share/icons

A good place to start would be /usr/share/icons/<theme>/22/panel, but it might not be the same for all themes.

SVG files are text files, and you can easily add a background, which removes the white background.

Add this line after the svg tag <rect fill="#ffffff" width="22" height="22"/>

Make the color match your xfce panel background color, and the size needs to be the same as the pixel size of the folder you are in.

network-wired-symbolic.svg example 
<svg width="22" height="22" version="1.1" xmlns="http://www.w3.org/2000/svg">
<rect fill="#ffffff" width="22" height="22"/>
 <defs>
  <style id="current-color-scheme" type="text/css">.ColorScheme-Text { color:#dedede; } .ColorScheme-Highlight { color:#4285f4; }</style>
 </defs>
 <path d="m4 5c-0.554 0-1 0.446-1 1v4c0 0.554 0.446 1 1 1h1v6h1v-3h5v2h-3v1h7v-1h-3v-2h6c0.554 0 1-0.446 1-1v-7c0-0.554-0.446-1-1-1h-12zm0 1h3v1h-3zm4 0h10v7h-12v-2h1c0.554 0 1-0.446 1-1zm-4 2h1v1h1v-1h1v2h-3z" class="ColorScheme-Text" fill="currentColor"/>
</svg>

You can change all the files in the folder with a shell script.

#!/bin/bash
for file in /usr/share/icons/<theme>/22/panel*.svg; do
   sed -i '2i <rect fill="#color" width="xx" height="xx"/>' $file
done

You are going to have to remove background from images that are drawn on top of another image, e.g. the vpn lock icon.

Optional
In the global settings, set the tint saturation to 50%.

11 Likes
2

the shell script must be moved to: /usr/share/icons//22/panel, and then run the shell script? can you detail the guide?
I have icon theme Fluent/Fluent-dark (the same as you).

thanks for your work

3

You can run the script from any directory since it’s using absolute path inside. You only need to replace <theme> with your theme name.

1 Like
4

On Adwaita, the only .svgs I’ve found are Adwaita/scalable/*/*.svg. So I’ve got this locked and loaded:

for dir in /usr/share/icons/Adwaita/scalable/*; do
  for file in $dir/*; do
    sed -i '2i <rect fill="#color" width="xx" height="xx"/>' $file
  done
done

It seems a bit fishy to me to do #color and xx verbatim though, especially on scalable icons, but I also know zilch on theming, so does the above script work verbatim or did I miss something?

5

Hello, I’m new to qubesos but love more and more each day. I followed this thread, and tried multiple similar topics without success.
I’m on Qubes 4.2.4 with Lyra theme and installed the theme in ~/.icons.
→ there is no panel folder in my themes
→ it looks to me like the theme has no sys-net, pasystray, whonix icons, as there all with white background and still identical to the oob install icons.
→ tried to modify multiple wired.svg without any luck

I also tried the 'tinted icon with modified white options, but that turns the icon to a unstable background

Would really love to have all the systray icons without the white background).
Is there a way to find out precisely what’s the icon file used?

6

I made a sys-net-test, with it own template that had the icons installed.

My theme has 16,22,24,32,64,256 top level folders, I just renamed them one by one and restated sys-net-test, until it didn’t have a network icon.

Then I know what icon size was used, then it just repeated for the sub folders for that icon size, until I had the exact folder that was used.

This only changes the icon from the appVMs, it doesn’t change the icons for dom0. If you want dom0 to match the appVM icons, then you need to install the same icon theme in dom0.

You can find the Whonix icons in/usr/share/sdwdata-gui/icons, in the Whonix template.

1 Like
7

I don’t know how you do it. I found the sdwdate icons in sys-whonix and changed it. It didn’t help. Then I deleted it and rebooted sys-whonix - a white square with sdwdate icon appeared on the panel again. Please write down your actions in more detail or send your system tray icons (or your theme). It seems like only you can help with this issue :pray: :pray:

8

So this all needs to be run in each and every TemplateVM? How come in “normal” Linux distros all the tray icon bgs are transparent and not white?

9

Please write the name of the folder where you found the icon for NetworkManager. I think it should be similar for other themes as well

10

he last problem in my wonderful Qubes is that everything is working great now, and this forum helped me solve all my issues. It’s a fantastic community. I really hope someone can help me. I’m clueless about this matter

Every serviceVM (sys-). I also don’t understand why there are white squares here – I’ve tried many distros, and everywhere there was a transparent background in any themes

11

I can’t do it. changing icons for sys-whonix doesn’t change tray icon. I couldn’t change other icons either. can’t you write more instructions and help many users? I will download your theme

12

You can just create one set of modified icons, and use that in each template.

The icon can’t be alpha blended before it’s transmitted to dom0, and the Qubes OS services used to transmit the icon currently doesn’t support the use of an alpha channel. This is why you end up with transparency getting replaced with a default color (white), and it’s also why the problem goes away when the transparent background is removed.

The name is 22, this is how I found the right folder.

https://forum.qubes-os.org/t/improving-white-background-systray-icons-for-dark-themes/22687/6

13

Is this something that could be “fixed” or is this intended functionality due to some security considerations?

14

Yes. It is something that could/should be fixed. And there is an open issue on this:

And there has been some attempts to fix it, from the core team members and 3rd party developers. The most recent one was last month. It has been on my personal “TODO” list. But lack of time, other pending tasks and personal obligations left me no time for it…

2 Likes
15

Friend, please try to fix it soon :pray: You will make Qubes wonderful. Thank you for your work!

1 Like
16

How did you change sys-whonix icon?