12.04: How to change the system background colour?

[lads]

Hello everyone,

I've been trying to find how to change the system default background colour in Unity. This is the background colour used, for instance, in input boxes, and used by Firefox to render pages that do not set a background.

Before Unity this would be set in the Appearence menu, but now I've searched for this option in MyUnity and CCSM but I can't find it?

Thank you for reading.

[vasa1]

Hello everyone,

I've been trying to find how to change the system default background colour in Unity. This is the background colour used, for instance, in input boxes, and used by Firefox to render pages that do not set a background.

Before Unity this would be set in the Appearence menu, but now I've searched for this option in MyUnity and CCSM but I can't find it?

Thank you for reading.

Do you want only a GUI method? Or are you willing to edit text files?

[lads]

Do you want only a GUI method? Or are you willing to edit text files?

I want both! Take that! :)

Now seriously, who cares, just let me know how to do it.

Thanks.

[vasa1]

I want both! Take that! :)

Now seriously, who cares, just let me know how to do it.

Thanks.

I'm going to answer with specific reference to Firefox.

Let's assume you're using the Ambiance theme.

In /usr/share/themes/Ambiance/gtk-2.0/ there's a file called gtkrc.

Edit it using sudo.

So,


gksudo gedit /usr/share/themes/Ambiance/gtk-2.0/gtkrc is what you'll type in a terminal.

When the file opens, you'll see something like this at the top of the file:

gtk-color-scheme = "base_color:#959595\nfg_color:black\ntooltip_fg_col or:#a2e5fb\nselected_bg_color:black\nselected_fg_c olor:#a2e5fb\ntext_color:black\nbg_color:#4573a0\n tooltip_bg_color:#000000\nlink_color:#f07746"

Change the hex value of base_color to what you want.

Save the file.

Then, right-click on your desktop to get to the "Appearances" pane. Change to another theme and then immediately change back to Ambiance. This is needed to get the change in gtkrc to register.

Now, when you start Firefox, you should see the difference.

Note that because of the way things are structured, other apps may be affected as well but these will be only gtk2 apps (if they don't have their own specific rules).

What fun.

[lads]

Thank you vasa1, that worked pretty well. I still have some characters showing up in black though, could you explain what is each of these items:

base_color
fg_color
tooltip_fg_color
selected_bg_color
selected_fg_ color
text_color
bg_color
tooltip_bg_color
link_color


Thanks.

[vasa1]

Thank you vasa1, that worked pretty well. I still have some characters showing up in black though, could you explain what is each of these items:

base_color
fg_color
tooltip_fg_color
selected_bg_color
selected_fg_ color
text_color
bg_color
tooltip_bg_color
link_color


Thanks.

That's a tough ask. Some are simple (and obvious). Some aren't. The reason I'm saying this is the heavy dependence on symbolic colors.

I don't mind trying to help but I don't know how much you know or don't and what you're willing to do. Recently, someone snapped at me about not wanting to edit files and how things should be this or that way. My point is that when there's no GUI, then what?

Anyway, in general, it would be nice to be specific about the following:
the theme you are using
the desktop environment (Ubuntu, Gnome, Xfce, whatever)
the name of the app (Firefox, LibreOffice, Chrome, gedit, whatever).

That said, I'll give the easy ones a go right now even though I suspect you may have figured them out by yourself:

base_color
fg_color
tooltip_fg_color
selected_bg_color
selected_fg_ color
text_color
bg_color
tooltip_bg_color
link_color

tooltip_fg_color and tooltip_bg_color: you will see a bubble or tooltip when you hover the mouse cursor over certain things. For example, in Firefox, if you have several tabs open, you can't read the full title. When you hover the mouse over a tab, you'll see more detail. The letters are in "tooltip_fg_color", the background is in tooltip_bg_color.

link_color is a bit of an odd one but let's say you open the Ubuntu Software Center or the help menu of certain programs, the letters of hyperlinks are colored according to "link_color". I say it's odd because you may have different colors for the unvisited and visited hyperlinks in web pages (and these are set by css rules of your browser.)

text_color is just that. But not everywhere. I guess it should be limited to text that we type and not text that's part of menus etc.

The way I tried to figure things out was to set each of the items, one at a time, in the list you put up to an really strange color. And then opening a bunch of apps and seeing where that color appears.

Then, one more wrinkle is that several apps are gtk2 although gtk3 is the latest thing. So tweaking stuff in your gtk-2.0 folder won't affect apps that use gtk3. You'll have to do that separately.

Another wrinkle, not all themes have the same format.

Maddening but if you have specific questions, do ask (and mention the desktop environment, theme and app)!

[vasa1]

One more point if all this hasn't put you off!

You could make a "hidden" folder called .themes in your home folder. Then copy over the folder corresponding to the theme you want to play with to the .themes folder. There are some advantages: your original in /usr/share/themes/ is unaffected; you don't have to use gksudo anymore; and updates won't affect themes in .themes.

This advice doesn't work for all themes. Some themes reference other themes and these may not work. The Adwaita theme has some "binary" stuff as well and, for that reason, I'm staying away from it.

Then, there are themes that are gtk2 only or gtk3 only. And most of us use apps of both types and will require themes that handle both gtk2 and gtk3.