Themes
aiTerm ships with 10 built-in themes and supports fully custom themes.
Built-in Themes
- Tokyo Night (default)
- Dracula
- Solarized Dark
- Solarized Light
- Nord
- Gruvbox Dark
- Monokai
- Catppuccin Mocha
- One Dark
- macOS Pro
Custom Themes
Create and edit custom themes via the theme editor in Preferences. Each theme has two parts:
UI Colors
CSS variables that control the application interface:
| Variable | Purpose |
|---|---|
--bg-dark | Main background |
--bg-medium | Elevated surfaces |
--bg-light | Borders, hover states |
--fg | Primary text |
--fg-dim | Secondary text |
--accent | Interactive elements |
Terminal Colors
Full ANSI 16-color palette plus cursor and selection colors. These are applied directly to the xterm.js terminal instance.
How Themes Work
Themes are defined in src/lib/themes/index.ts. When applied:
- UI colors are set as CSS custom properties on
document.documentElement - Terminal colors are applied to each xterm.js instance
- The CodeMirror editor uses a matching Tokyo Night theme