Fluxbox GTK themes

deepcyan

Using and changing the appearance of gtk themes in fluxbox.

If you have KDE installed as your base, you may want to download a few programs in order to use the GTK style interface for some of your programs.

The easy way to do this is to

apt-get update && apt-get install xfce4-mcs-manager xfce4-icon-theme gtk2-engines-xfce

This will allow you to use the light weight ‘xfce settings manager’ gui, for your GTK theme and icon changes.
This is especially useful for changing the themes and icons in GTK applications that you want to have different from KDE apps. You can also use the kde control center to change the colors of your gtk themes in fluxbox, but this will not affect certain other desirables, like icons for thunar, etc . . .

You will find the entry for’ XFCE-settings in the extended Debian part of the fluxbox menu, or you may add this entry to your ~/. fluxbox menu. Menu1 users already have this entry in place under ‘system settings’.

%%[exec] (xfce settings) {xfce4-settings-manager}%%

Now to the fun part.

You can make changes to your gtk themes in fluxbox using a couple of simple tools.

I use kcolorchooser to figure out which colors I would like to add or subtract from the theme, and copy and paste from kcolorchooser. Kcolorchooser is part of the package kcoloredit. apt-get install kcoloredit
Kcolorchooser is lightweight and easy to use. There are other color pickers in apt if kcolorchooser isn’t appealing.

Anyway, just place any theme you would like to edit into your /home folder at ~/.themes, and open up the gtkrc file inside. You can create the folder ~/.themes if you do not find it already in your home folder.

To find a theme to edit, look in /usr/share/themes for an xfce theme you would like to change, or copy ‘deepcyan’ below, and use that as a template to work from.

Remember to rename any files that you take from /usr/share/themes, that you place in ~/.themes, as you do not want to lose the original theme when you make changes.

To change theme colors, simply copy and paste from kcolorchooser to the gtk file of the theme you open in ~/.themes, and save.
Switch themes back and forth in xfce-settings-show/user-settings to see your results.

Note: Do not edit the /usr/share/theme files from /usr/share. If you would like to edit a theme currently in /usr/share/themes, just copy it to your ~/.themes folder.

If, upon completion you are pleased with your theme, you may want to put a copy in /usr/share/themes for root to use. Check ~/.xsession-errors to see if there are any glitches beforehand.

I have made a theme for anybody to use or change as they like.

It is a dark theme and will not suit everybody, but should work very well for anybody that likes dark themes.

What makes editing this theme nice is having the notations on each line item, telling what I think it does. This does not mean I’m absolutely right. Yoiu can have fun debunking my color theories. I know there are guides showing what each codeline does, but how I did it was much more fun;)

Below is the theme ‘deepcyan’ if you would like to try it out. It directly matches the Fluxbox style ‘deepflux’ from here: https://sleekmason.wordpress.com/fluxbox/fluxbox-styles/
I have noted in the deepcyan gtkrc file what I think every color code does, but it is not precise by any means.

*hint; Keep an instance of Abiword and Thunar open to see some of the changes work as you apply them. ; )

If copying the code below, you will need to first make a folder named ‘deepcyan’ inside of ~/.themes. Inside of the ‘deepcyan’ folder, make another new folder, and name it gtk-2.0.
Now, Inside of the folder gtk-2.0, make a new file, and name it ‘deepcyan’.
Copy and paste the theme below into you new ‘deepcyan’ file, save the file, and you are done.

In other words, A file inside of a folder, inside of a folder, inside of .themes, inside of your home directory, . . . got it? (look at the bottom of this page for a picture guide of sorts;)

From this point you can make any and all changes you wish to make.

Please note that this is a dark theme, and while it works very well on my setup, it might not on yours. The brightness for this theme is dependant upon where your eyes feel comfortable in regards to the text. At this point, you should be able to make everything out very clearly. If you cant, you will need to brighten your monitor a bit. People have a tendency to darken their monitors with lighter themes, and this should be re-adjusted.

This theme is complete. It should work very well if your brightness is adjusted properly.
### Deepcyan theme by sleekmason 1-12-09
### Based from xfce 4.0

style “default”
{
GtkButton::default_border = {0, 0, 0, 0}
GtkButton::default_outside_border = {0, 0, 0, 0}
GtkButton::default_spacing = 4
GtkButton::focus-line-width = 2
GtkButton::focus-padding = 2
GtkCheckButton::indicator_size = 12
GtkMenuBar::shadow_type = out
GtkMenuItem::selected_shadow_type = out
GtkPaned::handle_full_size = 2
GtkPaned::handle_size = 2
GtkRadioButton::indicator_size = 16
GtkRange::slider_width = 16
GtkRange::stepper_size = 15
GtkRange::stepper_spacing = 1
GtkRange::trough_border = 0
GtkScrollbar::min_slider_length = 25
GtkToolbar::shadow_type = out
GtkWidget::focus-line-width = 2
GtkWidget::focus_padding = 2
GtkWidget::interior_focus = 1
GtkWidget::internal_padding = 1

xthickness = 2
ythickness = 0

## (444) background
### base[NORMAL] = “#110F11” ##Bluebase
base[NORMAL] = “#111010” ##Redbase

## (555) background unselected
base[INSENSITIVE] = “#0A4444”

## (CCC) highlighted check box and separators in menus
base[PRELIGHT] = “#409797”

## (555) TEXT FILE BACKGROUND ‘SELECTED’ high text file
base[SELECTED] = “#0A4444”

## (777) TEXT FILE BACKGROUND ‘UN-SELECTED’
base[ACTIVE] = “#042D2D”

#######################################

## (555) inactive tab and scroll bar seat
bg[ACTIVE] = “#0A4444”

## (111) frame
bg[NORMAL] = “#230404”

## (111) ‘RGB’ box (unused dialog boxes)
bg[INSENSITIVE] = “#230404”

## (222VL) pressed scrollbar color and background for “use hinting”
bg[PRELIGHT] = “#4F0808”

## (555) possibly accent highlighted items (DONT KNOW)
bg[SELECTED] = “#4F0808”

#######################################

## (BBB) most ‘User Preference’s text (MENUS)
fg[NORMAL] = “#71E5E5”

###(BBB)Cranky line that doesn’t like to play well with others,
## can, and prob should be commented when black.
fg[ACTIVE] = “#71E5E5”

## (CCC) 1/2 OF INSENSITIVE TEXT AND (RGB) ARROW COLOR
fg[INSENSITIVE] = “#409797”

## (AAA) MENU TEXT highlighted
fg[PRELIGHT] = “#99F5F5”

## (BBB) This is a border accent, use text color to start.
fg[SELECTED] = “#71E5E5”

#######################################

## (AAA) THUNAR ICON ‘SELECTED’ (right click)
text[ACTIVE] = “#99F5F5”

## (CCC) 1/2 INSENSITIVE “RGB” text color BUT NOT MENU?
text[INSENSITIVE] = “#409797”

## (BBB) ALL BASIC TEXT
text[NORMAL] = “#71E5E5”

## (AAA) Dialog box (HOVER)text color
text[PRELIGHT] = “#99F5F5”

## (BBB) HIGHLIGHTED FILE TEXT
text[SELECTED] = “#71E5E5”

engine “xfce”
{
smooth_edge = true
boxfill
{
fill_style = gradient
orientation = horizontal
shade_start = 0.80
shade_end = 1.90
}
}
}

widget_class “*” style “default”

style “colored” = “default”
{
xthickness = 1
ythickness = 0

## (555) in abiword, these are the small button box colors
bg[ACTIVE] = “#183535”

## (222) DIALOG BOX COLOR
bg[PRELIGHT] = “#390404”

## (BBB) POP up Boxes “USE HINTING” text color
fg[ACTIVE] = “#71E5E5”

## (AAA) MENU highlighted text & down arrows in user interface
fg[PRELIGHT] = “#99F5F5”

## (AAA) Highlighted ‘unselected’ background text (black)
text[ACTIVE] = “#99F5F5”

## (AAA) active hover text in dialog boxes
text[PRELIGHT] = “#99F5F5”

engine “xfce”
{
smooth_edge = true
boxfill
{
fill_style = plain
}
}
}

widget_class “*List*” style “colored”
class “*List*” style “colored”
widget_class “*Text*” style “colored”
class “*Text*” style “colored”
widget_class “*Entry*” style “colored”
class “*Entry*” style “colored”

style “menubar” = “colored”
{
xthickness = 2
ythickness = 0

engine “xfce”
{
smooth_edge = true
boxfill
{
fill_style = gradient
orientation = horizontal
shade_start = 0.80
shade_end = 1.90
}
}
}

widget_class “*BonoboDockItem” style “menubar”
class “*BonoboDockItem” style “menubar”
widget_class “*HandleBox” style “menubar”
class “*HandleBox” style “menubar”
widget_class “*ToolBar” style “menubar”
class “*ToolBar” style “menubar”
widget_class “*MenuBar” style “menubar”
class “*MenuBar” style “menubar”

style “menuitem” = “colored”
{
xthickness = 1
ythickness = 0

engine “xfce”
{
smooth_edge = true
boxfill
{
fill_style = gradient
orientation = horizontal
shade_start = 0.75
shade_end = 1.90
}
}
}

widget_class “*MenuItem*” style “menuitem”
class “*MenuItem*” style “menuitem”

style “scrollbar” = “default”
{
xthickness = 2
ythickness = 1
engine “xfce”
{
smooth_edge = true
boxfill
{
fill_style = gradient
orientation = auto
shade_start = 0.30
shade_end = 1.30
}
}
}
widget_class “*Scrollbar*” style “scrollbar”
class “*Scrollbar*” style “scrollbar”

style “button” = “colored”
{
xthickness = 2
ythickness = 1

engine “xfce”
{
smooth_edge = true
boxfill
{
fill_style = gradient
orientation = horizontal
shade_start = 1.00
shade_end = 2.00
}
}
}
widget_class “*Button*” style “button”
class “*Button*” style “button”
widget_class “*button*” style “button”
class “*button*” style “button”
widget_class “*OptionMenu*” style “button”
class “*OptionMenu*” style “button”
widget_class “*Tree*” style “button”
class “*Tree*” style “button”
widget_class “*GtkScale*” style “button”
class “*GtkScale*” style “button”

style “progress” = “colored”
{
xthickness = 1
ythickness = 1

engine “xfce”
{
smooth_edge = true
boxfill
{
fill_style = plain

}
}
}
widget_class “*GtkProgress*” style “progress”
class “*GtkProgress*” style “progress”

widget_class “*CheckButton*” style “default”
class “*CheckButton*” style “default”
widget_class “*RadioButton*” style “default”
class “*RadioButton*” style “default”

#### This is for ROX-Filer
### (CCC) DON’T KNOW

style “rox” = “default”
{
bg[NORMAL] = “#409797”
bg[ACTIVE] = “#71E5E5”
}
widget_class “*Collection” style “rox”

# This is for the window borders (xfwm4 & metacity)
#
style “titlebar” = “default”
{
bg[SELECTED] = “#111010”
fg[SELECTED] = “#390404”

bg[INSENSITIVE] = “#390404”
fg[INSENSITIVE] = “#71E5E5”
}

widget “xfwm” style “titlebar”
class “MetaFrames” style “titlebar”
widget_class “MetaFrames” style “titlebar”

deepcyanpath

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s