I've been heavily customizing my elementary os desktop to look more to my liking, and I would like to know if it's possible to change the color of the bar above each window, based on the application that's being run. It seems like it would be possible, but when I google for it I can never find anything. In fact, I find nothing; no questions about it, no articles--I thought that I might be calling it the wrong thing, or it just isn't possible. That's why I'm asking here. Is it possible to dynamically change the window bar color?

Also my second question is kind of like the first but not as important, is it possible to dynamically change the color of the panel at the top of the desktop based on the color of the application open? I saw something like it using ImageMagick, but I couldn't find it again

1 Answer 1


tl;dr It is possible, but it's not super straightforward and it won't work for every app.

Firstly, there's something called Gtk.CSS that is used to style the toolkit. If you're familiar with CSS, you'll know that it operates based on selecting elements (like classes and IDs). In order to select a specific app window, it would need to set an ID that you can select in CSS. Some apps do, but some apps don't. Luckily for us, Sam Hewitt has done a lot of the footwork of finding out which apps set IDs. You can use his Paper stylesheet as a reference.

Now, you'll need to modify your stylesheet and add new CSS rules for each app you'd like custom theme. This could be complex depending on which stylesheet you're currently using.

At elementary, we're currently working on a simple Granite utility that app developers can use to set colors for their apps' headerbar. But this will need to be done from the source code of the app.

As far as altering the color of the panel per app, this is not really possible at the moment. The panel is only aware of the focused app's state (maximized, tiled, or not). It doesn't receive any information about the app's internal CSS.

  • Thanks a lot! Upgrading from Luna to Freya helped a lot of my problems. I installed Paper, and it's looking good. I was wondering if you could point me to where to I can make the panel transparent when no windows are maximized, and make the panel opaque color when windows are? The elementary theme does this by default, but it only works with paper if i change the Gtk+ theme from Paper to Elementary to Paper again in tweaks ;p
    – Axel M
    Jun 9, 2015 at 0:26
  • I suppose you only need this: .panel { background-color: transparent; } Jun 12, 2015 at 2:15

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .