4. Colors

Colors

Before changing colors in a new theme, you must know what each color does! This page explains each color's name and a short description.

Note: All colors listed here are found in _colors.scss. You can define colors anywhere in the code as long as you declare them before using them, following the SASS syntax.

Normal colors

• bg_color: the background color for most of the theme
• fg_color: the foreground color for most of the theme
• base_color: a contrasting color to emphasize interactive areas, such as text and view widgets
• text_color: the foreground of interactive areas
• selected_bg_color: the highlight color for some widgets
• selected_fg_color: the foreground of highlighted areas
• disabled_bg_color: background color for disabled widgets
• disabled_fg_color: foreground color for disabled widgets
• disabled_base_color: background color for disabled areas
• disabled_text_color: foreground color for disabled areas

Backdrop colors

• unfocused__colors: colors used for widgets that are not in the focused window

Dark colors

• different colors that can be used to obtain dark widgets will keeping the overall theme light

Shadows

• light/dark: used in some color mixing. Should not be changed, unless you know what you're doing
• color_shadow: used for some highlighted widgets, for example window overshoots
• wm_shadow: the window's drop shadow color. Normally black for light themes and grey for dark themes

Borders

• borders: border color for bordered widgets
• outline_color: color for the outline signaling a focused widget
• unfocused_borders: border color for unfocused bordered widgets

Notification and Special foreground colors

• colors used for in-app Notifications (for example, error is used to show a red box when gedit fails to save a file)

Widget colors colors used on specific widgets. includes

• tooltip: a floating bubble of helpful information when hovering over a control
• menu: the contextual right-click menu
• menubar: the menubar used in some applications not following the Human Interface guidelines
• toolbar: an area containing action buttons in applications
• sidebar: the places and favorites sidebar in most file managers
• taskbar: the desktop panel, usually containing the task list
• [Deprecated] titlebar: the top bar containing the window title and window buttons in GTK 3 applications. Headerbar now has this role
• headerbar: GNOME's version of a titlebar. Replaces the previously used titlebar color
• terminal: desktop terminal background and foreground colors. Some terminal emulators aren't covered with this feature.

OSD colors

darker colors for OSD components

Budgie colors

not used yet

Desktop icons colors

colors for some desktop icon elements. Should not be changed, unless you know what you're doing

LightDM colors

not used yet

Next section: Editing colors