xfwm4 themeing

 
left-active.xpm
left-inactive.xpm

right-active.xpm
right-inactive.xpm

bottom-active.xpm
bottom-inactive.xpm
bottom-left-active.xpm
bottom-left-inactive.xpm
bottom-right-active.xpm
bottom-right-inactive.xpm

top-left-active.xpm
top-left-inactive.xpm
top-right-active.xpm
top-right-inactive.xpm


close-active.xpm
close-inactive.xpm
close-prelight.xpm
close-pressed.xpm


hide-active.xpm
hide-inactive.xpm
hide-prelight.xpm
hide-pressed.xpm



maximize-active.xpm
maximize-inactive.xpm
maximize-prelight.xpm
maximize-pressed.xpm
maximize-toggled-active.xpm
maximize-toggled-inactive.xpm
maximize-toggled-prelight.xpm
maximize-toggled-pressed.xpm


menu-active.xpm
menu-inactive.xpm
menu-prelight.xpm
menu-pressed.xpm



shade-active.xpm
shade-inactive.xpm
shade-prelight.xpm
shade-pressed.xpm
shade-toggled-active.xpm
shade-toggled-inactive.xpm
shade-toggled-prelight.xpm
shade-toggled-pressed.xpm


stick-active.xpm
stick-inactive.xpm
stick-prelight.xpm
stick-pressed.xpm
stick-toggled-active.xpm
stick-toggled-inactive.xpm
stick-toggled-prelight.xpm
stick-toggled-pressed.xpm


title-1-active.xpm
title-1-inactive.xpm
title-2-active.xpm
title-2-inactive.xpm
title-3-active.xpm
title-3-inactive.xpm
title-4-active.xpm
title-4-inactive.xpm
title-5-active.xpm
title-5-inactive.xpm



xpm format 

XPM image is made of different sections, the values that describe the format of the image, the colors that compose the image, the pixels

A character is assigned to each color of the image (if the image has more colors than available charaters, then more than a single character can be assiged to a colors). If a color symbol is specified, the given color will be ignored and replaced by the corresponding color in the color symbol table.

To get the gtk colors applied to your theme, you need to edit the XPM files and add the proper color symbols to the color definition table. 

 

 

Header/Format Section

This section defines the image dimensions, number of colors, and characters per pixel.

static char *image_name[] = {
  "W H N C PP",  // Format string
  ...
};
 

  • W = Width (in pixels)

  • H = Height (in pixels)

  • N = Number of colors in the color table

  • C = Characters per pixel (usually 1, but can be more for many colors)

  • PP (optional) = Hotspot coordinates for cursors (e.g., 1 1 for a pointer)

     

    Color Table

    Each color is defined by a line mapping a character sequence to a color value.

    Format:
    "KEY c COLOR s SYMBOL"

    • KEY = Character(s) representing the color (length = C from the header).

    • c COLOR = Defines the color (can be #RGB, #RRGGBB, rgb:RR/GG/BB, or color names like red).

    • s SYMBOL (optional) = Symbolic color name (e.g., foreground, background). If specified, the actual color is replaced by the system's theme color.

       

      "  c #FFFFFF s background",  // White, uses GTK theme's background
"X c #FF0000 s foreground",  // Red, uses GTK theme's foreground
". c none",                  // Transparent
       

      Pixel Data

    Each line represents a row of pixels, where each character corresponds to a color key from the table.
    Example for a 3x3 image:

 

 "   ",
" X ",
"   "

 

Color Symbols

  • By using symbolic names (e.g., s background), the color dynamically adapts to the system/theme (useful for GTK+/Qt theming).

  • Example: If your GTK theme uses dark mode, s background might resolve to #222222 instead of the hardcoded #FFFFFF

     

    Transparency

    Defined with c none (no color)

 

Multi-Character Keys

If the image has >94 colors (ASCII printable chars), C (chars per pixel) increases (e.g., 2 for AA, AB, etc.).

 

 Comments

XPM files can include C-style comments (/* ... */).

 

 

 /* XPM */
static char *example_xpm[] = {
  "4 4 2 1",       // 4x4 pixels, 2 colors, 1 char per pixel
  "  c #000000",   // Black
  ". c #FFFFFF",   // White
  "    ",
  " .. ",
  " .. ",
  "    "
};

 

This draws a 2x2 white square centered in a 4x4 black canvas.

 

GTK+ Theming with XPM

To make icons adapt to the user's theme:
Replace hardcoded colors with symbolic names (e.g., s foreground).

 

Common Symbolic Color Names


Gtk Color pickup

As you have no doubt noticed when using Xfwm4's default theme, the theme uses the colors of the current Gtk theme. Colors for an XFWM theme can be defined in the theme's themrc file. If they are not defined there, they are picked up from the current Gtk theme. The following colors are used:

Name Gtk value Description
active_text_color fg[selected] Text color on title for active window
inactive_text_color fg[insensitive] Text color on title for inactive window
active_text_shadow_color dark[selected] Shadow color for active window's title
inactive_text_shadow_color dark[insensitive] Shadow color for inactive window's title
active_border_color fg[normal] Very rarely used usually set to black
inactive_border_color fg[normal] Idem
active_color_1 bg[selected] Background color for active title
active_color_2 bg[normal] Background color for active window
active_hilight_1 light[selected] Lighter color for active title for 3D look
active_hilight_2 light[normal] Lighter color for active window
active_mid_1 mid[selected] Slightly darker color for active title
active_mid_2 mid[normal] Slightly darker color for active window
active_shadow_1 darkselected[] Darker color for active title for 3D look
active_shadow_2 dark[normal] Darker color for active window
inactive_color_1 bg[insensitive] Background color for inactive title
inactive_color_2 bg[normal] Background color for inactive window
inactive_hilight_1 light[insensitive] Lighter color for inactive title for 3D look
inactive_hilight_2 light[normal] Lighter color for inactive window
inactive_mid_1 mid[insensitive] Slightly darker color for inactive title
inactive_mid_2 mid[normal] Slightly darker color for inactive window
inactive_shadow_1 dark[insensitive] Darker color for inactive title for 3D look
inactive_shadow_2 dark[normal] Darker color for inactive window

The Gtk values “fg” and “bg” are defined in the gtkrc file of the current Gtk theme. Please notice that the values “dark”, “light” and “mid” can not be defined in the gtkrc but are computed (dark = 0.7 * bg, light = 1.3 * bg, mid = 0.5 * (dark + light)). The symbols get replaced by the actual color values at runtime so that the window border can inherit Gtk theme colors automatically, unless they are defined in the themerc.

To use the defined colors in the XFWM theme, the XPM files have to be edited. Since XPM files are plain text, they can be edited with your favorite text editor.

Ensure the color table includes mappings like:


"X c #000000 s foreground",  // Uses theme's text color
"o c #FFFFFF s background",  // Uses theme's base color
 
 

 

for i in {1..5}; do 
  ln -sf title.png "title-$i-active.png";
  ln -sf title.png "title-$i-inactive.png"; 
done
 
 
svg

 
 title.svg
<svg width="40" height="32" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <linearGradient id="aero-gradient" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0%" stop-color="#f0f7ff" />
      <stop offset="50%" stop-color="#d2e0f7" />
      <stop offset="100%" stop-color="#b0c0e1" />
    </linearGradient>
  </defs>
  <rect width="40" height="32" fill="url(#aero-gradient)" />
</svg>

 
 
 for i in {1..5}; do 
  ln -sf title.svg "title-$i-active.svg";
  ln -sf title.svg "title-$i-inactive.svg"; 
done
 

 

borders  

for f in left right  top-left top-right; do
    ln -sf border.svg  $f-active.svg
done

 
for f in bottom bottom-left bottom-right; do
   ln -sf border-h.svg  $f-active.svg
done


 

for f in left right  top-left top-right; do
    ln -sf border-i.svg  $f-inactive.svg
done

 

for f in bottom bottom-left bottom-right;
 do   ln -sf border-h-i.svg  $f-inactive.svg
done
 

 

 

xpm

 

title.xpm

/* XPM */
static char * title_xpm[] = {
"8 30 2 1",
"     c None",
".    c #FFFFFF s  active_color_1 ",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........",
"........"};

 

title-inactive.xpm

 same as title.xpm just color change from active_color_1 to inactive_color_1

 


 

for i in {1..5}; do 
  ln -sf title.xpm "title-$i-active.xpm";
done 
 
for i in {1..5}; do 
  ln -sf title-inactive.xpm "title-$i-inactive.xpm"; 
done  

for f in left right  top-left top-right bottom bottom-left bottom-right ; do
ln -sf border-inactive.xpm  $f-inactive.xpm
done

 

for f in top-left top-right left right  bottom bottom-right bottom-left  ; do 
ln -sf border.xpm  $f-active.xpm
done

 

src

https://wiki.xfce.org/howto/xfwm4_theme

Comments

Post a Comment

Popular posts from this blog

fedora install from container tarball

  https://mirrormanager.fedoraproject.org/ https://mirrors.tuna.tsinghua.edu.cn/fedora/releases/42/ https://mirrors.tuna.tsinghua.edu.cn/fedora/releases/42/Container/x86_64/images/Fedora-Container-Base-Generic-Minimal-42-1.1.x86_64.oci.tar.xz tar xf Fedora-Container-Base-Generic-Minimal-42-1.1.x86_64.oci.tar.xz tar tvf Fedora-Container-Base-Generic-Minimal-42-1.1.x86_64.oci.tar.xz drwxr-xr-x 0/0 0 2025-04-09 17:45 blobs/ drwxr-xr-x 0/0 0 2025-04-09 17:45 blobs/sha256/ -rw-r--r-- 0/0 504 2025-04-09 17:45 blobs/sha256/4f30be32cf4ee44c2113f77c18d1c004732d546b2e73c4e4adde1ba0cadf7338 -rw-r--r-- 0/0 50630077 2025-04-09 17:45 blobs/sha256/b79a3ddbd1b19eee5e402a69bb305d3a7fddfeda4c08ffc9dc35a568f80f218b -rw-r--r-- 0/0 907 2025-04-09 17:45 blobs/sha256/ee0f4ff69a65fe4fe35c238b7c4fb4f93d49ba38cf4ebbc5793c27c107fc3d68 -rw-r--r-- 0/0 258 2025-04-09 17:45 index.json -rw-r--r-- 0/0 30 2025-04-09 17:45 oci-la...
Read more

xdm linux merge incomplete download parts

 some download stuck at 99.99% , merge them regardless got to ~/.xdm-app-data/Data/*.state cat dec.py import os import re # Define the pattern to extract the segment number pattern = re.compile(r'seg-(\d+)-v1-a1\.ts') # Get the current working directory current_directory = os.getcwd() # List to hold tuples of (segment_number, filename) files_with_segments = [] # Iterate through files in the current directory for filename in os.listdir(current_directory): match = pattern.search(filename) if match: # Extract the segment number as an integer segment_number = int(match.group(1)) # Add the tuple (segment_number, filename) to the list files_with_segments.append((segment_number, filename)) # Sort the list by the segment number (numerical sort) files_with_segments.sort(key=lambda x: x[0]) # Open the filelist.txt for writing with open('filelist.txt', 'w') as filelist: for _, filename in files_with_segments: file...
Read more

kde on debian

https://wiki.debian.org/KDE sudo apt install   xserver-xorg-input-libinput xserver-xorg-video-intel  sudo apt install plasma-desktop plasma-workspace-wayland  sddm  issue  file:///usr/share/plasma/plasmoids/org.kde.plasma.kickoff/contents/ui/Kickoff.qml:157:34: Type FullRepresentat ion unavailable file:///usr/share/plasma/plasmoids/org.kde.plasma.kickoff/contents/ui/FullRepresentation.qml:80:22: Type Norma lPage unavailable file:///usr/share/plasma/plasmoids/org.kde.plasma.kickoff/contents/ui/NormalPage.qml:43:13: Type Footer unavai lable file:///usr/share/plasma/plasmoids/org.kde.plasma.kickoff/contents/ui/Footer.qml:155:5: Type LeaveButtons unav ailable file:///usr/share/plasma/plasmoids/org.kde.plasma.kickoff/contents/ui/LeaveButtons.qml:14:1: module "org.kde.k itemmodels" is not installed # upower , it is installed by powerdevil though sudo apt install kde-config-gtk-style  kde-config-gtk-style-preview   breeze-gtk-theme  sudo apt i...
Read more