Change the colours of your GTK+ themes

From Manjaro Linux
Jump to: navigation, search

Introduction

Something you may not be aware of, is that you can modify the gtkrc to relatively easily (though not necessarily quickly) change the colours of most if not all of your GTK+ engined thems.


Where is this gtkrc file

The gtkrc file resides nested inside of the GTK+ theme(s) that you use:

~/.themes/<theme.directory>/<gtk.version.being.used>/gtkrc

So the above on my machine is literally the following:

~/.themes/Aero/gtk-2.0/gtkrc

It is quite common to see more than one GTK+ engine directory listed inside of your theme. Usually gtk & gtk-2.0:

gtk
gtk-2.0
gtk-3.0

gtk-2.0 being the most commonly used. GTK-3 is problematic for theme creators as the Gnome team continually change the rules with each point release, breaking the custom theme builders work (many long time theme creators consider this to be a conspiracy by the Gnome team to have Gnome look only the way that they want it to?). This has been & will continue to drive theme designers away from GTK-3.


How are the colours written into the gtkrc?

In the gtkrc file, the colours are identified in hexadecimal (hex), like so:


 fg[NORMAL]        = "#bcbcbc"       # Main Menu TEXT colour
 fg[PRELIGHT]      = "#b1b1b1"         # slightly darker than main text   
 fg[ACTIVE]        = "#d8d8d8"        # lighter again than above   
 fg[SELECTED]      = "#000000"        # black was white - #ffffff
 fg[INSENSITIVE]   = "#757f90"        # Inactive menu entries & inactive highlight)
  
 bg[NORMAL]        = "#3E3E3E"           # Main Menu BACKGROUND colour - was #424242
 bg[PRELIGHT]      = "#5058a0"        # active highlight
 bg[ACTIVE]        = "#2b2b2b"        # darker secondary b'ground - rarely used - where (Firefox scroll bar)??
 bg[SELECTED]      = "#5058a0"        # active highlight - was -> #5058a0
 bg[INSENSITIVE]   = "#575757"        # lighter minor background     

 text[NORMAL]      = "#ABABAB"        # Main Text, including fields
 text[PRELIGHT]    = "#ABABAB"        #   "    "       "       "   
 text[ACTIVE]      = "#ababab"        #   "    "       "       " 
 text[SELECTED]    = "#ababab"        #   "    "       "       " 
 text[INSENSITIVE] = "#757f90"        # inactive highlight - was #6F6F6F

 base[NORMAL]      = "#2b2b2b"        # darker - secondary background colour
 base[PRELIGHT]    = "#5058a0"        # active highlight & menu entries
 base[ACTIVE]      = "#757f90"        # inactive highlight
 base[SELECTED]    = "#5058a0"        # active highlight
 base[INSENSITIVE] = "#575757"        # lighter minor background

Not all theme creators will use the same format, but you see a hex number in the following format - "#50f94c" know that it is a colour.

Also, the above is from my modified Aero theme. I added all of the comments to the right of the hex colours to make my life easier for whenever I come back & have another tweak of the colours. (There is only so much of this stuff I can take. You may have more tolerance for it...?)


Use GColor2 to easily handle this hex colour stuff:

If gcolor2 isn't installed on your machine, then grab it from the Manjaro repos, or for a more featured interface install Agave which brings some other colour scheme design benefits with it - your choice. GColor2 makes pretty easy work of playing with colours in hex. Any colour that you choose from its colour wheel is identified in hex plus, a real lifesaving bonus is that you can use the GColor2 eyedropper cursor to select any colour on your desktop & GColor2 will give you its hex name. Very cool indeed.

So GColor2 is the key to being able to identify what a colour on your desktop is called in hex & matching it up to the one in your gtkrc so you can then change it to the colour that you have created/identified in hex.

Note: Expect to find slight variations between
the hex identity found via GColor2 of a colour
in your unmodified desktop theme & the same
colour's identity written in the gtkrc file. I
think that this is caused by variations in the
GPU/display screen settings & therefore colour
output between what we are using & what the
creator of the theme was using. So we have to
work around that, which isn't too hard.


A colour I want to change isn't listed in the gtkrc?

I've only used the above method to modify a theme to suit my eyes better. The Aero theme (quite modified these days) that I use has some 3d elements incorporated into it. Colours seem to be attached with some of these elements that are not listed in gtkrc file anywhere. Fortunately in my case this doesn't cause too much trouble, though I would like to change those colours, I don't know how to. If you do please post in the thread linked at the bottom of this page?


It isn't hard, & it gets easier...

If the theme that you use has comments identifying the colours you will save yourself the time spent identifying them & adding the comments yourself. Which it should go without saying, is obviously a very good idea.

Once you have all of the colours identified in comments it is just a matter of replacing the previous colour with your new choice - I usually leave a copy of the previous colour's hex in the comment, for just in case. Saving the gtkrc file & logging out/in of your DE/WM environment so you can see how it looks. You can see how this isn't technically hard, but it most certainly can, before you know it, eat many hours...


Support:

Following is a link to this page's forum counterpart where you can post any related feedback: [1]