Skip to main content

​
Theme Switching

Config-Sway includes a powerful theme system that applies consistent colors, styles, and wallpapers across Sway, Waybar, Kitty, and Rofi. The theme switcher provides instant visual transformation of your entire desktop environment.

​
Quick Start

Press Super+A to open the theme switcher menu and select a theme.
Themes are displayed with preview icons in Rofi, making it easy to identify themes visually before applying them.

​
Available Themes

Config-Sway includes six pre-configured themes:
ThemeStyleLocation
AnimeCatppuccin-inspired with blue accents~/.config/themes/Anime/
BatmanDark theme with Batman aesthetics~/.config/themes/Batman/
HackerMatrix/cyberpunk style~/.config/themes/Hacker/
Mode-DarkClean dark mode~/.config/themes/Mode-Dark/
SupermanSuperman-inspired colors~/.config/themes/Superman/
Windows10Windows 10 aesthetic~/.config/themes/Windows10/

​
Theme Structure

Each theme is stored in ~/.config/themes/<theme-name>/ and contains the following components: 
~/.config/themes/<theme-name>/
├── sway/
│   └── theme.conf          # Sway colors, borders, and gaps
├── waybar/
│   ├── config.jsonc        # Waybar configuration
│   ├── colors.css          # Waybar color variables
│   └── style.css           # Waybar styling
├── kitty/
│   ├── kitty.conf          # Kitty terminal configuration
│   └── colors.ini          # Kitty color scheme (optional)
├── rofi-style/
│   └── _core/
│       └── palette.rasi    # Rofi color palette
└── wallpaper.(jpg|png|webp) # Theme wallpaper
The rofi-style/ directory is optional. If a theme doesn’t include it, the theme switcher will automatically generate a Rofi palette from the Sway theme colors.

​
How Theme Switching Works

When you select a theme, the theme switcher (~/.config/rofi/scripts/theme-switcher.sh:62-183) performs these steps:

​
1. Save Theme Selection

The chosen theme name is saved to ~/.config/themes/.current so other scripts can reference the active theme.

​
2. Backup Existing Configuration

Before making changes, the script creates timestamped backups: 
~/.config/kitty.bak-YYYYMMDD-HHMMSS
~/.config/waybar.bak-YYYYMMDD-HHMMSS
~/.config/sway/theme.conf.bak-YYYYMMDD-HHMMSS

​
3. Apply Theme Components

The script copies theme files to their respective locations:
  • Kitty: Entire directory copied to ~/.config/kitty/
  • Waybar: Colors and styles copied, config adapted for Sway
  • Sway: Theme configuration copied to ~/.config/sway/theme.conf
  • Rofi: Palette copied or auto-generated to ~/.config/rofi/styles/_core/palette.rasi

​
4. Waybar Configuration Adaptation

The theme switcher automatically converts Hyprland-specific Waybar modules to Sway equivalents: 
# Conversions performed:
hyprland/workspaces → sway/workspaces
hyprland/window → sway/window
hyprctl dispatcher → kitty -e btop
The adapted configuration is saved as ~/.config/waybar/config-sway.jsonc.

​
5. Apply Wallpaper

The theme’s wallpaper is set using swaybg: 
# Wallpaper path saved to:
~/.config/sway/wallpaper

# swaybg launched with fill mode
swaybg -i /path/to/wallpaper.jpg -m fill

​
6. Reload Services

The script automatically reloads affected services:
  • Waybar is restarted with the new configuration
  • Sway configuration is reloaded (swaymsg reload)
  • Notifications show the theme change status

​
Creating Custom Themes

You can create your own themes by following this structure:

​
1. Create Theme Directory

mkdir -p ~/.config/themes/MyTheme/{sway,waybar,kitty}

​
2. Configure Sway Theme

Create ~/.config/themes/MyTheme/sway/theme.conf: 
# Sway theme: MyTheme

# Color variables
set $bg #1e1e2e
set $fg #cdd6f4
set $active #89b4fa
set $inactive #45475a

# Border and gap settings
default_border pixel 2
default_floating_border pixel 2
gaps inner 5
gaps outer 10

# Window colors
client.focused          $active   $active   $fg      $active   $active
client.focused_inactive $inactive $inactive $fg      $inactive $inactive
client.unfocused        $inactive $inactive $fg      $inactive $inactive
The color variables $bg, $fg, $active, and $inactive are used by the theme switcher to auto-generate Rofi colors if you don’t provide a custom Rofi palette.

​
3. Add Waybar Styles

Create ~/.config/themes/MyTheme/waybar/colors.css: 
/* Waybar color variables */
@define-color bg #1e1e2e;
@define-color fg #cdd6f4;
@define-color active #89b4fa;
@define-color inactive #45475a;
Create ~/.config/themes/MyTheme/waybar/style.css with your custom Waybar styling.

​
4. Configure Kitty Colors

Create ~/.config/themes/MyTheme/kitty/kitty.conf with Kitty color scheme and settings.

​
5. Add Wallpaper

Place your wallpaper as:
  • ~/.config/themes/MyTheme/wallpaper.jpg
  • ~/.config/themes/MyTheme/wallpaper.png
  • ~/.config/themes/MyTheme/wallpaper.webp
The wallpaper file must be named exactly wallpaper.(jpg|png|webp) for the theme switcher to detect it. The script checks for these extensions in order: jpg, png, webp.

​
6. (Optional) Custom Rofi Palette

For full control over Rofi colors, create ~/.config/themes/MyTheme/rofi-style/_core/palette.rasi: 
/* Rofi color palette - MyTheme */

* {
    font:                  "JetBrains Mono Nerd Font 14";
    background:            #1e1e2e;
    background-alt:        #45475a;
    foreground:            #cdd6f4;
    selected:              #89b4fa;
    active:                #89b4fa;
    urgent:                #89b4fa;
}

​
Command-Line Usage

You can apply themes from the command line: 
# Apply a theme by name
~/.config/rofi/scripts/theme-switcher.sh "MyTheme"

# Open interactive theme selector
~/.config/rofi/scripts/theme-switcher.sh

​
Automatic Rofi Palette Generation

If your theme doesn’t include a custom Rofi palette, the theme switcher automatically generates one from your Sway theme colors: 
# Colors extracted from sway/theme.conf:
$bg       → background
$fg       → foreground
$active   → selected/active/urgent
$inactive → background-alt

# Font extracted from:
font pango:JetBrains Mono Nerd Font 14
Auto-generated Rofi palettes ensure visual consistency even if you don’t manually create Rofi styles for your theme.

​
Troubleshooting

​
Theme Not Appearing in Menu

Ensure your theme directory exists in ~/.config/themes/ and contains at minimum:
  • A sway/theme.conf file
  • A wallpaper file named wallpaper.(jpg|png|webp)

​
Waybar Not Updating

Manually restart Waybar: 
killall waybar
waybar -c ~/.config/waybar/config-sway.jsonc &

​
Colors Not Applying

Reload Sway configuration: 
swaymsg reload

​
Wallpaper Not Changing

Check the wallpaper file path: 
cat ~/.config/sway/wallpaper
Manually set wallpaper: 
killall swaybg
swaybg -i /path/to/wallpaper.jpg -m fill &

​
Theme Backups

The theme switcher creates automatic backups with timestamps. To restore a previous configuration: 
# List available backups
ls -la ~/.config/kitty.bak-*
ls -la ~/.config/waybar.bak-*
ls -la ~/.config/sway/theme.conf.bak-*

# Restore a backup
cp -r ~/.config/kitty.bak-20260305-143022 ~/.config/kitty
Backups are created every time you switch themes, which can accumulate over time. Consider periodically cleaning old backups to save disk space.

Build docs developers (and LLMs) love

Get started for freeTalk to us