HOW TO change the colour of title bars and window borders in Xfce

[michael-hi]

One thing I dislike about the default Mint setup is the drab greyness of the title bars. They merge in visually with the actual window and also make it hard to distinguish between active and background windows. You can change to a dark theme and have black title bars but in Xfce it is not at all obvious how you can get rid of this grey or black and replace it with pink, red, green or whatever shade takes your fancy.

This post is mainly about the colour but you might also have other reasons for changing the window borders eg to get thinner or fatter title bars or larger window buttons. Or maybe you prefer slightly thicker window borders, making it easier to grab and resize windows with the mouse. Another factor is that some title bars are plain and some patterned; some are flat (evenly-coloured) and some have colour gradients which may give a slightly shiny or 3D effect.

So, in the hope that it helps a few people to brighten up their windows, here are some ways I have found to change the colours. Bear in mind this all relates to Xfce, not MATE or Cinnamon.

Choose a different window theme (sounds obvious, I know)

Changing themes in Xfce involves two different places in the Settings menu - "Appearance", where the Style tab sets the theme for most of the standard graphical gadgets making up the desktop (the GTK theme), and "Window Manager", which applies to the window borders including the title bar and its buttons (the Xfwm theme).

Most Xfce distros give only a few choices in the latter, although these do include the useful Default-hdpi and Default-xhdpi options which give large and extra-large (but still grey) title bars. Mint goes further by giving a whole range of "Mint-Y" colour options in the Window Manager, but unfortunately these don't actually colour the title bar, just the Close button! Looking at the other Window Manager themes, note that some have a fixed colour but others change in line with the base colour of the chosen Appearance (GTK) theme. Of the standard Xfce window themes provided, Daloa, Kokodi and Moheli fall into this latter category.

So the simplest way of colouring the title bar is to choose Daloa, Kokodi or Moheli in the Window Manager settings and then select any one of the different Mint-X or Mint Y colour options in the Appearance settings.

There are possible drawbacks: you might not like those three particular designs and/or you might not like the somewhat muted Mint range of colours. Or you might even (horror!) be using a different Xfce distro altogether, one which unlike Mint doesn't even offer a range of Appearance colours. What to do then?

Install more Xfwm window themes

The quickest way to get a much wider selection of window themes is to install the xfwm4-themes package. In LM19.3 and earlier simply enter this in the terminal:

Code: Select all

sudo apt install xfwm4-themes

You will then find a longer list of options to choose from in the Window Manager settings. As before, some will be fixed in colour but others will change in line with the colour of your Appearance theme.

Unfortunately, this package is missing from the repositories for LM20. If you have LM20 or 20.1 you will need to find and download it yourself, eg from here:
http://archive.ubuntu.com/ubuntu/pool/u ... -2_all.deb
and install it by double-clicking on the .deb file or by:

Code: Select all

cd Downloads
sudo dpkg -i xfwm4-themes_4.10.0-2_all.deb

Or install an Xfwm window theme from elsewhere

Such as from here:
https://www.xfce-look.org/browse/cat/138/order/latest/
This site mostly seems to consist of fancy desktop themes but there are some nice Xfwm window themes too. A good example is the OneColor design by Novomente:
https://www.xfce-look.org/p/1148918/
It has plain brightly-coloured borders and also even larger options for HiDPI screens and touchscreens. Taking the standard version as an example, its tar.gz file can be downloaded from the linked page. Then unzip it (ie right-click and "Extract here") to give a folder named OneColor_XFCE_pack which contains seven individual folders. Copy each of these seven folders to a folder named .themes in your home folder, which is the usual place for installing extra themes. Create this .themes folder if it does not already exist.

Note - Files and folders beginning with a dot (eg .themes) are hidden. They are only visible if Show Hidden Files is selected in the View menu of the file manager. Or press Ctrl-H.

These seven extra options will then be available for selection in your Window Manager settings. The named colours are fixed but the one simply named OneColor XFCE will change colour in line with the theme chosen in your Appearance settings.

By the way, the OneColor theme is also available for the MATE desktop. The same designer has other Xfce window themes on the same site, eg City (which might look good with dark desktop themes), Saturglass and System One.

What if I want even more choice of colours?

With Mint, one option is to download the Mint-Yz package by sebastjava (see his thread on the Themes, Icons, & Wallpaper section of these forums). The latest version of the .deb file may be downloaded from his page at:
https://github.com/SebastJava/mint-yz-theme/releases
and installed eg by double-clicking on it.

You will then have an extra range of colours in both Appearance and Window Manager settings, although (as with Mint-Y) the Window Manager settings won't actually colour the title bar itself. However, you will find that if you select any "changeable" option in the Window Manager (such as Daloa, Kokodi, Moheli or OneColor XFCE), you will be able to cycle through as many as 22 different colours for the title bar simply by switching between the different Mint X/Y/Yz colour options on the Style tab of the Appearance settings.

But what if I want a different colour of my own choice?

It seems there are basically two ways to do this. (Note - I don't think these methods will work for those Xfwm themes which have a fixed colour. You would probably need to edit the theme's .xpm files in that case.)

You can take an existing Xfwm window theme you like, copy it to .themes in your home folder and then modify the colour in it directly. The installed themes are in /usr/share/themes so if you want to modify one of the "changeable" Xfwm themes (such as Kokodi) then copy the Kokodi folder from there to .themes in your home folder. Rename it (for instance to Kokodi-Pink or whatever) to avoid confusion. Open that renamed folder and the xfwm4 folder within it and find the file named themerc which can be edited as below with a text editor. You do all this as ordinary user not as root. When saved, this new choice will be available for selection in the Window Manager settings.

To change the title bar to a shade of pink for instance, add this line to the themerc file:

Code: Select all

active_color_1=#ff82ab

The six-character number is the hexadecimal code for that particular colour and is preceded by the # sign. You may also wish to add a line for active_color_2 and set a similar value for that as well. This seems to be an improvement in some cases (in this case it colours the border also) but not in others. Click on a different theme in the Window Manager settings and then back again to see the effect of any change. If you want to experiment further, have a look at the options in the Xfwm guidance here:
https://wiki.xfce.org/howto/xfwm4_theme

The themerc file will probably already include lines for such things as the title's text colour and shadow. You may need to alter the values of these for legibility, eg to black without a shadow:

Code: Select all

active_text_color=#000000
title_shadow_active=false

--------------------------------------------------------------------------
An alternative - and perhaps better - approach is to modify the GTK (Appearance) theme instead. However, this may not be practical because GTK files are complex and some themes have no obvious setting to alter. Fortunately, it works for Mint-Y so we can take that as an example. First copy the Mint-Y folder from /usr/share/themes to .themes in your home folder. Rename it (eg to Mint-Y-CustomGreen or whatever) and then look inside the gtk-3.0 folder for the text file named gtk.css which can be edited (as ordinary user, remember, not as root). Look near the top of this file for the entry .gtkstyle-fallback:selected and try changing the value for background-color eg from 92b372 to 40bf40 to get a brighter green. Make sure you don't delete the semi-colon! Then save, exit, and choose that renamed theme in the Appearance settings. Now switch between various different themes in the Window Manager settings. Those themes which are changeable rather than fixed-colour (and there will be quite a few if you installed the xfwm4-themes package) should now show a bright green instead of a mint green title bar. In fact, you could try changing all instances of 92b372 to 40bf40 in the gtk.css file (search and replace) and you should then see GTK highlight colours also change from mint to brighter green.

(Note - for older versions of Xfce before 4.14 you may instead need to open the gtk-2.0 folder and edit the gtkrc file. Try changing the value of selected_bg_color near the top of this text file.)

How do I find the hex code for a particular colour?

You need a colour chooser. There isn't one in the standard Xfce menu but you can open a simple one from the terminal with zenity --color-selection Better still, install gcolor2 the deb file for which can be found here:

32 bit:
http://archive.ubuntu.com/ubuntu/pool/u ... 1_i386.deb
64 bit:
http://archive.ubuntu.com/ubuntu/pool/u ... _amd64.deb

Double-click on the deb file to install it and you should find it in the Graphics section of the Xfce menu. The advantage of this little program is that it has a useful long list of pre-saved colours and also a "dropper" icon which enables you to identify any colour on the desktop.

What about header bars?

Some applications, eg Calculator, Disks and Document Scanner, come from Gnome and do not have a title bar, just a thick grey "header bar". You cannot get rid of these (unfortunately) but you can install the following, which in most cases will add back your title bar and window border and thus retain some visual consistency with other applications:

Code: Select all

sudo apt install gtk3-nocsd

After installing, log out and back in again for it to start working.

And finally

Just another reminder that this post relates only to the Xfce edition of Mint - but it should apply to all recent Mint Xfce versions (and to the new version of Xfce: 4.16).

And now a brief rant - why is all this so complicated? Why is the wacky interaction between Appearance and Window themes never explained anywhere? And it's not just Xfce, because MATE and Cinnamon seem even more obscure. Also, why have Debian/Ubuntu/Mint removed useful and popular software like xfwm4-themes and gcolor2 from their repositories for no good reason?

Anyway, here's a link to a web article about Xfce themes which may also be of interest:
https://www.ubuntupit.com/best-xfce-themes-for-linux
Most of those shown are desktop themes but there are several Xfwm window border themes illustrated, including a couple which I have mentioned above.

Have fun repainting your windows!

[DraganTheMighty]

Nice and useful for those who like customizing.

[shmu]

kudos to @michael-hi for this amazing tutorial!

[begtognen]

Thank you. This has been TREMENDOUSLY helpful and I really appreciate you taking the time.