Initial commit

skills/zellij-config/references/api_reference.md

@@ -0,0 +1,34 @@
+# Reference Documentation for Zellij Config
+
+This is a placeholder for detailed reference documentation.
+Replace with actual reference content or delete if not needed.
+
+Example real reference docs from other skills:
+- product-management/references/communication.md - Comprehensive guide for status updates
+- product-management/references/context_building.md - Deep-dive on gathering context
+- bigquery/references/ - API references and query examples
+
+## When Reference Docs Are Useful
+
+Reference docs are ideal for:
+- Comprehensive API documentation
+- Detailed workflow guides
+- Complex multi-step processes
+- Information too lengthy for main SKILL.md
+- Content that's only needed for specific use cases
+
+## Structure Suggestions
+
+### API Reference Example
+- Overview
+- Authentication
+- Endpoints with examples
+- Error codes
+- Rate limits
+
+### Workflow Guide Example
+- Prerequisites
+- Step-by-step instructions
+- Common patterns
+- Troubleshooting
+- Best practices

skills/zellij-config/references/configuration_options.md

@@ -0,0 +1,421 @@
+# Zellij Configuration Options Reference
+
+Complete reference of all Zellij configuration options with examples.
+
+## Core Configuration
+
+### `theme`
+Sets the color theme to use. The theme must be defined in the configuration's 'themes' section or loaded from the themes folder.
+
+**Type:** String
+**Default:** "default"
+
+```kdl
+theme "nord"
+theme "dracula"
+theme "custom_theme"
+```
+
+### `default_layout`
+Specifies the name of the layout file to load when Zellij starts. The layout must exist in the layouts folder.
+
+**Type:** String
+**Default:** "default"
+
+```kdl
+default_layout "compact"
+default_layout "development"
+```
+
+### `default_mode`
+Determines the mode Zellij starts in.
+
+**Type:** String
+**Values:** "normal", "locked"
+**Default:** "normal"
+
+```kdl
+default_mode "locked"
+```
+
+### `layout_dir`
+Sets the directory where Zellij searches for layout files.
+
+**Type:** String
+**Default:** Subdirectory of config dir
+
+```kdl
+layout_dir "/path/to/my/layout_dir"
+```
+
+### `theme_dir`
+Sets the directory where Zellij searches for theme files.
+
+**Type:** String
+**Default:** Subdirectory of config dir
+
+```kdl
+theme_dir "/path/to/my/theme_dir"
+```
+
+## Session Management
+
+### `session_serialization`
+Enables or disables Zellij session serialization.
+
+**Type:** Boolean
+**Default:** true
+
+```kdl
+session_serialization true
+session_serialization false
+```
+
+### `pane_viewport_serialization`
+When session serialization is enabled, allows serializing the pane viewport (visible terminal content).
+
+**Type:** Boolean
+**Default:** false
+
+```kdl
+pane_viewport_serialization true
+```
+
+### `scrollback_lines_to_serialize`
+Number of scrollback lines to serialize when pane viewport serialization is enabled. Setting to 0 serializes all scrollback.
+
+**Type:** Integer
+**Default:** 1000
+
+```kdl
+scrollback_lines_to_serialize 0
+scrollback_lines_to_serialize 500
+```
+
+## UI Configuration
+
+### `ui` block
+Contains UI-related settings.
+
+#### `pane_frames`
+Controls pane frame display settings.
+
+##### `rounded_corners`
+Determines whether pane frames should have rounded corners.
+
+**Type:** Boolean
+**Default:** true
+
+```kdl
+ui {
+    pane_frames {
+        rounded_corners true
+    }
+}
+```
+
+### Mouse Configuration
+
+### `mouse_mode`
+Sets handling of mouse events.
+
+**Type:** Boolean
+**Default:** true
+
+```kdl
+mouse_mode true
+mouse_mode false
+```
+
+### `copy_on_select`
+Automatically copy text when selecting.
+
+**Type:** Boolean
+**Default:** false
+
+```kdl
+copy_on_select true
+```
+
+## Environment Variables
+
+### `env` block
+Defines environment variables to be set for each terminal pane.
+
+**Type:** Map of String to String/Integer
+
+```kdl
+env {
+    RUST_BACKTRACE 1
+    EDITOR "nvim"
+    FOO "bar"
+    PATH "/usr/local/bin:/usr/bin"
+}
+```
+
+## Plugin Configuration
+
+### `load_plugins` block
+Plugins to load automatically when session starts.
+
+**Type:** List of URLs or aliases
+
+```kdl
+load_plugins {
+    https://example.com/plugin.wasm
+    file:/path/to/local/plugin.wasm
+    plugin-alias
+}
+```
+
+### `plugins` block
+Plugin aliases with optional configurations.
+
+**Type:** Plugin configuration map
+
+```kdl
+plugins {
+    tab-bar location="zellij:tab-bar"
+    status-bar location="zellij:status-bar"
+    custom-plugin location="file:/path/to/plugin.wasm" {
+        option1 "value1"
+        option2 42
+    }
+}
+```
+
+## Web Server Configuration
+
+### `web_server`
+Enable/disable web server startup.
+
+**Type:** Boolean
+**Default:** false
+
+```kdl
+web_server true
+```
+
+### `web_server_ip`
+IP address for web server to listen on.
+
+**Type:** String
+**Default:** "127.0.0.1"
+
+```kdl
+web_server_ip "0.0.0.0"
+```
+
+### `web_server_port`
+Port for web server to listen on.
+
+**Type:** Integer
+**Default:** 8082
+
+```kdl
+web_server_port 443
+web_server_port 8083
+```
+
+### `web_server_cert`
+Path to SSL certificate for HTTPS.
+
+**Type:** String
+**Default:** None
+
+```kdl
+web_server_cert "/path/to/cert.pem"
+```
+
+### `web_server_key`
+Path to SSL private key for HTTPS.
+
+**Type:** String
+**Default:** None
+
+```kdl
+web_server_key "/path/to/key.pem"
+```
+
+### `enforce_https_on_localhost`
+Enforce HTTPS certificate requirement even on localhost.
+
+**Type:** Boolean
+**Default:** false
+
+```kdl
+enforce_https_on_localhost true
+```
+
+## Web Client Configuration
+
+### `web_client` block
+Settings for browser-based terminal client.
+
+#### `font`
+Font for web client terminal.
+
+**Type:** String
+**Default:** "monospace"
+
+```kdl
+web_client {
+  font "Iosevka Term"
+}
+```
+
+#### `cursor_blink`
+Enable cursor blinking.
+
+**Type:** Boolean
+**Default:** false
+
+```kdl
+web_client {
+  cursor_blink true
+}
+```
+
+#### `cursor_style`
+Cursor style.
+
+**Type:** String
+**Values:** "block", "bar", "underline"
+**Default:** "block"
+
+```kdl
+web_client {
+  cursor_style "underline"
+}
+```
+
+#### `cursor_inactive_style`
+Inactive cursor style.
+
+**Type:** String
+**Values:** "outline", "block", "bar", "underline"
+**Default:** "block"
+
+```kdl
+web_client {
+  cursor_inactive_style "outline"
+}
+```
+
+#### `mac_option_is_meta`
+Treat Option key as Meta on macOS.
+
+**Type:** Boolean
+**Default:** true
+
+```kdl
+web_client {
+  mac_option_is_meta false
+}
+```
+
+#### `theme` block
+Web client terminal theme (separate from Zellij theme).
+
+**Type:** Color definitions in RGB format
+
+```kdl
+web_client {
+  theme {
+    background 10 20 30
+    foreground 248 248 242
+    // ... more colors
+  }
+}
+```
+
+## Multiplayer Configuration
+
+### `multiplayer_user_colors`
+Colors for users in multiplayer sessions.
+
+**Type:** Map of player numbers to RGB values
+
+```kdl
+multiplayer_user_colors {
+    player_1 255 0 255
+    player_2 0 217 227
+    // ... up to player_10
+}
+```
+
+## Auto Layout Configuration
+
+### `auto_layout`
+Controls automatic pane arrangement.
+
+**Type:** Boolean
+**Default:** true
+
+```kdl
+auto_layout true
+```
+
+## Command Line Options
+
+All configuration options can be overridden via command line:
+
+```bash
+# Override theme
+zellij --theme nord
+
+# Override layout
+zellij --layout development
+
+# Override config file
+zellij --config /custom/path/config.kdl
+
+# Override default mode
+zellij --default-mode locked
+
+# Set session name
+zellij --session-name my-workspace
+
+# Disable mouse
+zellij --disable-mouse-mode
+
+# Set custom shell
+zellij --default-shell fish
+```
+
+## Configuration Validation
+
+Use built-in validation:
+
+```bash
+# Check configuration syntax
+zellij setup --check
+
+# Dump default configuration
+zellij setup --dump-config
+
+# Dump default layout
+zellij setup --dump-layout default
+```
+
+## File Locations
+
+- **Config Directory:** `~/.config/zellij/`
+- **Layouts Directory:** `~/.config/zellij/layouts/`
+- **Themes Directory:** `~/.config/zellij/themes/`
+- **Default Config:** `~/.config/zellij/config.kdl`
+
+## Migration from YAML
+
+Convert legacy YAML configuration:
+
+```bash
+# Convert config
+zellij convert-config /path/to/config.yaml > /path/to/config.kdl
+
+# Convert theme
+zellij convert-theme /path/to/theme.yaml > /path/to/theme.kdl
+
+# Convert layout
+zellij convert-layout /path/to/layout.yaml > /path/to/layout.kdl
+```

skills/zellij-config/references/layout_examples.md

@@ -0,0 +1,411 @@
+# Zellij Layout Examples
+
+Collection of layout templates for different use cases and workflows.
+
+## Basic Layouts
+
+### Single Terminal
+Simple terminal with full screen:
+
+```kdl
+layout {
+    pane command="bash"
+}
+```
+
+### Two Pane Horizontal
+Two panes side by side:
+
+```kdl
+layout {
+    pane split_direction="horizontal" {
+        pane size="50%" command="bash"
+        pane size="50%" command="bash"
+    }
+}
+```
+
+### Two Pane Vertical
+Two panes stacked vertically:
+
+```kdl
+layout {
+    pane split_direction="vertical" {
+        pane size="50%" command="bash"
+        pane size="50%" command="bash"
+    }
+}
+```
+
+## Development Layouts
+
+### Development Workspace
+Editor with git and terminal panes:
+
+```kdl
+layout {
+    default_tab_template {
+        pane size=1 borderless=true {
+            plugin location="zellij:tab-bar"
+        }
+        children
+        pane size=2 borderless=true {
+            plugin location="zellij:status-bar"
+        }
+    }
+    tab name="code" cwd="~/project" focus=true {
+        pane command="nvim" size="80%"
+        pane size="20%" split_direction="vertical" {
+            pane command="git" {
+                args "status"
+                size="50%"
+            }
+            pane command="htop"
+        }
+    }
+    tab name="terminal" {
+        pane command="bash"
+    }
+}
+```
+
+### Full Development Setup
+Complete development environment with monitoring:
+
+```kdl
+layout {
+    default_tab_template {
+        pane size=1 borderless=true {
+            plugin location="zellij:tab-bar"
+        }
+        children
+        pane size=2 borderless=true {
+            plugin location="zellij:status-bar"
+        }
+    }
+    tab name="editor" cwd="~/project" focus=true {
+        pane command="nvim" size="70%"
+        pane split_direction="horizontal" {
+            pane size="50%" split_direction="vertical" {
+                pane command="git" {
+                    args "status"
+                        cwd "~/project"
+                }
+                pane command="cargo" {
+                    args "test"
+                        cwd "~/project"
+                }
+            }
+            pane command="htop"
+        }
+    }
+    tab name="server" cwd="~/server" {
+        pane command="nvim" size="60%"
+        pane split_direction="vertical" {
+            pane command="tail" {
+                args "-f" "log/production.log"
+                    cwd "~/server"
+                size="40%"
+            }
+            pane command="btop" size="40%"
+        }
+    }
+    tab name="database" {
+        pane command="psql" {
+            args "-U" "postgres"
+                cwd "~/server"
+        }
+    }
+}
+```
+
+## Monitoring Layouts
+
+### System Monitoring
+Multiple monitoring tools:
+
+```kdl
+layout {
+    tab name="monitoring" split_direction="horizontal" {
+        pane command="htop"
+        pane command="btop"
+        pane command="iotop"
+        pane command="nethogs"
+    }
+}
+```
+
+### Resource Monitoring
+CPU, memory, disk, and network monitoring:
+
+```kdl
+layout {
+    tab name="resources" split_direction="horizontal" {
+        pane split_direction="vertical" {
+            pane command="htop"
+            pane command="df" "-h"
+        }
+        pane split_direction="vertical" {
+            pane command="btop"
+            pane command="iotop"
+        }
+        pane command="nethogs"
+    }
+}
+```
+
+### Log Monitoring
+Monitor multiple log files:
+
+```kdl
+layout {
+    tab name="logs" split_direction="horizontal" {
+        pane command="tail" {
+            args "-f" "/var/log/syslog"
+        }
+        pane command="tail" {
+            args "-f" "/var/log/nginx/access.log"
+        }
+        pane command="journalctl" {
+            args "-f"
+        }
+    }
+}
+```
+
+## Tab Templates
+
+### Default Tab Template with Plugins
+Standard tab bar and status bar:
+
+```kdl
+layout {
+    default_tab_template {
+        pane size=1 borderless=true {
+            plugin location="zellij:tab-bar"
+        }
+        children
+        pane size=2 borderless=true {
+            plugin location="zellij:status-bar"
+        }
+    }
+    // All tabs will use this template unless overridden
+}
+```
+
+### Compact Tab Template
+Minimal UI with compact bar:
+
+```kdl
+layout {
+    default_tab_template {
+        pane size=1 borderless=true {
+            plugin location="zellij:compact-bar"
+        }
+        children
+    }
+}
+```
+
+## Floating Layouts
+
+### Swap Floating Layout
+Different arrangements based on pane count:
+
+```kdl
+layout {
+    swap_floating_layout {
+        floating_panes max_panes=1 {
+            pane x="25%" y="25%" width="50%" height="50%"
+        }
+        floating_panes max_panes=2 {
+            pane x="10%" y="25%" width="35%" height="50%"
+            pane x="55%" y="25%" width="35%" height="50%"
+        }
+        floating_panes max_panes=3 {
+            pane x="0%" y="0%" width="33%" height="50%"
+            pane x="33%" y="0%" width="33%" height="50%"
+            pane x="66%" y="0%" width="33%" height="50%"
+        }
+    }
+}
+```
+
+### Specific Floating Layout
+Predefined floating pane positions:
+
+```kdl
+layout {
+    pane {
+        x="10%"
+        y="20%"
+        width="80%"
+        height="60%"
+        focus=true
+        command="nvim"
+    }
+    pane {
+        x="15%"
+        y="70%"
+        width="70%"
+        height="25%"
+        command="htop"
+    }
+}
+```
+
+## Advanced Layouts
+
+### Multi-Project Setup
+Work on multiple projects simultaneously:
+
+```kdl
+layout {
+    tab name="frontend" cwd="~/projects/frontend" {
+        pane command="npm" {
+            args "start"
+            cwd "~/projects/frontend"
+        }
+        pane command="nvim" {
+            cwd "~/projects/frontend"
+        }
+    }
+    tab name="backend" cwd="~/projects/backend" {
+        pane command="npm" {
+            args "start"
+            cwd "~/projects/backend"
+        }
+        pane command="nvim" {
+            cwd "~/projects/backend"
+        }
+    }
+    tab name="docs" cwd="~/projects/docs" {
+        pane command="mkdocs" {
+            args "serve"
+            cwd "~/projects/docs"
+        }
+    }
+}
+```
+
+### Database Layout
+Development with database management:
+
+```kdl
+layout {
+    tab name="app" cwd="~/project" {
+        pane command="npm" {
+            args "start"
+            size="60%"
+        }
+        pane split_direction="vertical" {
+            pane command="nvim" {
+                size="40%"
+            }
+            pane command="psql" {
+                args "-U" "postgres"
+                size="60%"
+            }
+        }
+    }
+    tab name="database-tools" {
+        pane command="pgadmin" {
+            size="50%"
+        }
+        pane command="dbeaver" {
+            size="50%"
+        }
+    }
+}
+```
+
+## Special Purpose Layouts
+
+### Git Workflow
+Git operations with diff viewer:
+
+```kdl
+layout {
+    tab name="git" cwd="~/project" {
+        pane command="git" {
+            args "status"
+            size="30%"
+        }
+        pane command="git" {
+            args "log" "--oneline" "-10"
+            size="30%"
+        }
+        pane split_direction="horizontal" {
+            pane command="git" {
+                args "diff" "--cached"
+                size="40%"
+            }
+            pane command="git" {
+                args "diff" "--cached" "HEAD~1"
+                size="40%"
+            }
+        }
+    }
+}
+```
+
+### Container Development
+Docker and development tools:
+
+```kdl
+layout {
+    tab name="containers" {
+        pane command="docker" {
+            args "ps"
+            size="40%"
+        }
+        pane command="docker-compose" {
+            args "ps"
+            size="30%"
+        }
+        pane split_direction="vertical" {
+            pane command="docker" {
+                args "stats"
+                size="50%"
+            }
+            pane command="lazydocker"
+                size="50%"
+            }
+        }
+    }
+    tab name="k8s" {
+        pane command="kubectl" {
+            args "get" "pods" "--watch"
+            size="50%"
+        }
+        pane command="k9s" {
+            size="50%"
+        }
+    }
+}
+```
+
+## Layout Tips
+
+### Size Specifications
+- **Fixed sizes:** `size=10` (exact lines/columns)
+- **Percentage sizes:** `size="50%"` (relative to container)
+- **Mixed sizing:** Use fixed and percentage as needed
+
+### Split Directions
+- **Vertical:** `split_direction="vertical"` (stack top to bottom)
+- **Horizontal:** `split_direction="horizontal"` (side by side)
+
+### Common Patterns
+1. **Focus on startup:** Add `focus=true` to important panes
+2. **Set working directories:** Use `cwd="/path"` for project-specific panes
+3. **Naming:** Use descriptive tab names for organization
+4. **Templates:** Use `default_tab_template` for consistent UI
+5. **Plugins:** Integrate tab-bar and status-bar for better UX
+
+### Best Practices
+- Keep layouts readable with proper indentation
+- Use consistent naming conventions
+- Test layouts before deploying
+- Document custom layouts for team sharing
+- Consider different screen sizes when designing layouts

skills/zellij-config/references/theme_examples.md

@@ -0,0 +1,399 @@
+# Zellij Theme Examples
+
+Collection of custom themes and theme creation guidelines.
+
+## Built-in Themes
+
+### Default Theme
+Standard light theme:
+
+```kdl
+theme "default"
+```
+
+### Nord Theme
+Popular dark theme based on Nordic colors:
+
+```kdl
+themes {
+    nord {
+        fg "#D8DEE9"
+        bg "#2E3440"
+        black "#3B4252"
+        red "#BF616A"
+        green "#A3BE8C"
+        yellow "#EBCB8B"
+        blue "#81A1C1"
+        magenta "#B48EAD"
+        cyan "#88C0D0"
+        white "#E5E9F0"
+        orange "#D08770"
+    }
+}
+```
+
+### Dracula Theme
+Popular dark theme:
+
+```kdl
+themes {
+    dracula {
+        fg 248 248 242
+        bg 40 42 54
+        black 0 0 0
+        red 255 85 85
+        green 80 250 123
+        yellow 241 250 140
+        blue 98 114 164
+        magenta 255 121 198
+        cyan 139 233 253
+        white 255 255 255
+        orange 255 184 108
+    }
+}
+```
+
+## Custom Themes
+
+### Custom RGB Theme
+Theme using RGB color values:
+
+```kdl
+themes {
+    my_custom_theme {
+        fg 200 200 200
+        bg 30 30 30
+        black 40 40 40
+        red 255 100 100
+        green 100 255 100
+        yellow 255 255 100
+        blue 100 100 255
+        magenta 255 100 255
+        cyan 100 255 255
+        white 255 255 255
+        orange 255 200 100
+    }
+}
+```
+
+### Custom Hex Theme
+Theme using hexadecimal color codes:
+
+```kdl
+themes {
+    cyberpunk {
+        fg "#00ff00"
+        bg "#0a0a0a"
+        black "#1a1a1a"
+        red "#ff0000"
+        green "#00ff00"
+        yellow "#ffff00"
+        blue "#0080ff"
+        magenta "#ff00ff"
+        cyan "#00ffff"
+        white "#ffffff"
+        orange "#ff8000"
+    }
+}
+```
+
+### Solarized Dark
+Classic solarized color scheme:
+
+```kdl
+themes {
+    solarized_dark {
+        fg "#839496"
+        bg "#002b36"
+        black "#073642"
+        red "#dc322f"
+        green "#859900"
+        yellow "#b58900"
+        blue "#268bd2"
+        magenta "#d33682"
+        cyan "#2aa198"
+        white "#eee8d5"
+        orange "#cb4b16"
+    }
+}
+```
+
+### Gruvbox Dark
+Popular dark theme for developers:
+
+```kdl
+themes {
+    gruvbox_dark {
+        fg "#ebdbb2"
+        bg "#282828"
+        black "#1d2021"
+        red "#cc241d"
+        green "#98971a"
+        yellow "#d79921"
+        blue "#83a598"
+        magenta "#d3869b"
+        cyan "#8ec07c"
+        white "#ebdbb2"
+        orange "#fe8019"
+    }
+}
+```
+
+### Monokai
+Clean, minimal dark theme:
+
+```kdl
+themes {
+    monokai {
+        fg "#ffffff"
+        bg "#272822"
+        black "#272822"
+        red "#ff5555"
+        green "#50fa7b"
+        yellow "#f1fa8c"
+        blue "#8be9fd"
+        magenta "#bd93f9"
+        cyan "#8fa8c0"
+        white "#f8f8f2"
+        orange "#ff6b6b"
+    }
+}
+```
+
+### Tokyo Night
+Modern dark theme with blue tones:
+
+```kdl
+themes {
+    tokyo_night {
+        fg "#c0caf5"
+        bg "#1a1b26"
+        black "#393939"
+        red "#f7768e"
+        green "#9ece6a"
+        yellow "#e0af68"
+        blue "#7aa2f7"
+        magenta "#bb9af7"
+        cyan "#89dceb"
+        white "#d9d7d8"
+        orange "#e06c75"
+    }
+}
+```
+
+## Theme Component Colors
+
+### Ribbon UI Colors
+Some themes support detailed ribbon component colors:
+
+```kdl
+themes {
+    detailed_theme {
+        ribbon_unselected {
+            base 10 10 10
+            background 50 50 50
+            emphasis_0 200 200 200
+            emphasis_1 220 220 220
+            emphasis_2 240 240 240
+            emphasis_3 255 255 255
+        }
+        ribbon_selected {
+            base 20 20 20
+            background 60 60 60
+            emphasis_0 210 210 210
+            emphasis_1 230 230 230
+            emphasis_2 250 250 250
+            emphasis_3 255 255 255
+        }
+    }
+}
+```
+
+### Multiplayer Colors
+Configure colors for multiplayer sessions:
+
+```kdl
+multiplayer_user_colors {
+    player_1 255 0 255    // Magenta
+    player_2 0 255 255      // Blue
+    player_3 0 0 0          // Black
+    player_4 255 255 0      // Red
+    player_5 0 255 0          // Black
+    player_6 255 255 255    // White
+    player_7 255 0 255      // Magenta
+    player_8 0 255 0          // Black
+    player_9 0 200 0          // Green
+    player_10 0 0 255          // Blue
+}
+```
+
+## Theme Creation Guidelines
+
+### Color Format Options
+
+#### RGB Format
+Use three space-separated values (0-255):
+
+```kdl
+color_name 200 150 100  // R=200, G=150, B=100
+```
+
+#### Hexadecimal Format
+Use standard hex color codes with # prefix:
+
+```kdl
+color_name "#ff6b6b"  // Orange-red
+```
+
+#### Mixed Format
+You can mix formats in the same theme:
+
+```kdl
+themes {
+    mixed_theme {
+        fg "#ffffff"           // Hex for foreground
+        bg 40 42 54          // RGB for background
+        red "#cc241d"           // Hex for accent
+        green 80 250 123        // RGB for success
+        yellow 241 250 140      // RGB for warning
+    }
+}
+```
+
+### Theme Design Best Practices
+
+1. **Contrast is Key**
+   - Ensure text remains readable against background
+   - Test with different terminal profiles
+   - Consider accessibility (WCAG contrast ratios)
+
+2. **Consistent Color Palette**
+   - Limit to 8-12 colors for consistency
+   - Use semantic naming (success, warning, error, etc.)
+   - Maintain harmony across color choices
+
+3. **Test Across Applications**
+   - Verify colors work in nvim, vim, tmux, etc.
+   - Test with syntax highlighting themes
+   - Check compatibility with common tools
+
+4. **Consider Environment**
+   - Account for different lighting conditions
+   - Support both dark and light variants
+   - Provide high contrast options
+
+### Common Color Values
+
+#### Standard Colors
+```kdl
+// Pure colors
+black   0 0 0       // #000000
+white   255 255 255 // #ffffff
+red     255 0 0       // #ff0000
+green   0 255 0       // #00ff00
+blue    0 0 255       // #0000ff
+yellow  255 255 0   // #ffff00
+magenta 255 0 255   // #ff00ff
+cyan    0 255 255   // #00ffff
+```
+
+#### Gray Scale
+```kdl
+// Gray variations
+gray_25  25  25  25
+gray_50  50  50  50
+gray_75  75  75  75
+gray_100 100 100 100
+gray_125 125 125 125
+gray_150 150 150 150
+gray_175 175 175 175
+gray_200 200 200 200
+```
+
+#### Popular Theme Colors
+```kdl
+// Nord theme palette
+nord_frost  "#D8DEE9"  // Light blue
+nord_snow   "#E5E9F0"  // Pure white
+nord_polar  "#2E3440"  // Dark blue-gray
+nord_night  "#3B4252"  // Dark gray-blue
+nord_aurora "#88C0D0"  // Cyan
+
+// Dracula theme palette
+dracula_bg     "#282a36"  // Dark purple
+dracula_fg     "#f8f8f2"  // Light gray
+dracula_pink   "#ff79c6"  // Bright pink
+dracula_cyan   "#8be9fd"  // Bright cyan
+dracula_green  "#50fa7b"  // Bright green
+dracula_orange "#ffb86c"  // Bright orange
+```
+
+## Theme Testing
+
+### Validate Theme Colors
+Check theme works properly:
+
+```bash
+# Test theme in new session
+zellij --theme your_theme --session-name test-theme
+
+# Keep session open for inspection
+```
+
+### Preview Multiple Themes
+Quickly switch between themes for testing:
+
+```bash
+# Test multiple themes
+for theme in nord dracula tokyo_night; do
+    zellij --theme "$theme" --session-name "test-$theme"
+    echo "Theme $theme ready for testing"
+done
+```
+
+### Create Theme Variants
+Generate light/dark variants of base theme:
+
+```kdl
+themes {
+    my_theme_dark {
+        fg "#e0e0e0"
+        bg "#000000"
+        // ... other colors
+    }
+    my_theme_light {
+        fg "#000000"
+        bg "#ffffff"
+        // ... other colors (inverted/light versions)
+    }
+}
+```
+
+## Integration with Editors
+
+### Vim Integration
+Theme compatibility with vim color schemes:
+
+```kdl
+themes {
+    vim_compatible {
+        // Use colors that match popular vim themes
+        fg "#abb2bf"           // Similar to 'morning' vim theme
+        bg "#1a1b26"           // Similar to 'morning' vim theme background
+        // Match other colors accordingly
+    }
+}
+```
+
+### Neovim Integration
+Modern editor theme compatibility:
+
+```kdl
+themes {
+    nvim_compatible {
+        fg "#b0e1e6"           // Similar to 'tokyonight' nvim theme
+        bg "#16161d"           // Similar to 'tokyonight' nvim theme background
+        // Match other accent colors
+    }
+}
+```