Hi there! This post does not apply to styling the GTK+3 Whisker Menu. For that, read the page on theming.
I have seen several people state that Whisker Menu does not use their GTK theme. This is understandable but completely incorrect. Whisker Menu is a regular window and therefore it matches the GTK theme of regular windows. It can not be a GtkMenu because of the widgets it uses (believe me, I tried), so it does not match the theming of menus.
I did investigate if it would be possible for Whisker Menu to “pick up” the theming of GTK menus and mimic them. Short answer: no. Longer answer: haha, my sanity is worth more than the creaky mess of hacks it would take, and besides I’m fairly certain it still wouldn’t work. So instead I did something much simpler: I named the menu widget itself whiskermenu-window
so users or theme makers can play with its appearance as much as they want.
I will not be adding any theme configuration settings to Whisker Menu. First, I really have no interest in doing so. Second, modifying the theme from a .gtkrc
file gives you much more power than I could ever expose from a GUI. Third, anything I add would probably interfere with .gtkrc theming.
So, how do you theme Whisker Menu? It’s pretty easy, actually. Open up the hidden file named .gtkrc-2.0
in your home directory with any text editor you want. If the file doesn’t exist, create it. Now, if you want to change the background color of the menu window add something like this:
style "darkback"
{
bg[NORMAL] = "#404040"
bg[ACTIVE] = "#606060"
bg[PRELIGHT] = "#808080"
}
widget "whiskermenu-window*" style "darkback"

If you want to change the window text color as well, add something like this:
style "darkback"
{
bg[NORMAL] = "#404040"
bg[ACTIVE] = "#606060"
bg[PRELIGHT] = "#808080"
fg[NORMAL] = "#ccc"
fg[ACTIVE] = "#fff"
fg[PRELIGHT] = "#fff"
}
widget "whiskermenu-window*" style "darkback"

If you want to change the background color of the menu items, add something like this:
style "darktree"
{
base[NORMAL] = "#404040"
base[ACTIVE] = "#606060"
}
widget "whiskermenu-window*TreeView*" style "darktree"

If you want to change the text color of the menu items as well, add something like this:
style "darktree"
{
base[NORMAL] = "#404040"
base[ACTIVE] = "#606060"
text[NORMAL] = "#ccc"
text[ACTIVE] = "#fff"
}
widget "whiskermenu-window*TreeView*" style "darktree"

These examples just scratch the surface of what you can do with theming from a .gktrc file. I don’t have much experience with it myself, nor do I intend to really look into it further. There are plenty of resources on how to make GTK themes and what they say should be applicable to Whisker Menu as well.