Some extensions adjust their system status panel icon automatically. How do they do it?

[alex.culea]

I’m developing my own extension and would like to ensure the icon it places in the system status panel (tray) adjusts to the background of the panel so the icon is clearly visible with either light or dark shell themes.

I noticed some extensions have this functionality without any detection code and without including two versions of their icons. One of these extensions is: https://github.com/gpouilloux/gnome-shell-extension-docker. They use an SVG (docker.svg file) that’s filled white and yet on when the panel is light it gets drawn with a black fill.

What does it that their icon is ‘magically’ adapted?
My extension for reference.

[matthiasc (Matthias Clasen)]

They are probably using a symbolic icon.

[alex.culea]

Thanks! Indeed it was the use of Symbolic Icons that enabled the example extension.

In my case I just had to rename the icon from file.svg to file file-symbolic.svg to be automatically themed with the shell theme without any code changes while still using Gio.icon_new_for_string with St.Icon

Neat!