YouTip LogoYouTip

Opencode Theme

OpenCode supports multiple theme systems. You can choose built-in themes, automatically adapt to terminal themes, or fully customize themes to achieve a consistent and comfortable terminal experience. The simplest way is to enter the `/themes` command in the TUI input box: /themes !(#) Then select your favorite theme in the popup window: !(#) * * * ## Terminal Requirements To ensure themes display full colors correctly, your terminal must support **true color (24-bit color)**. * **Check support:** echo $COLORTERM Output should be: truecolor or24bit * **Enable true color:** export COLORTERM=truecolor * **Common supported terminals:** * iTerm2 * Alacritty * Kitty * Windows Terminal * GNOME Terminal (newer versions) If the terminal does not support true color, themes will fall back to 256 colors, which may cause color distortion. * * * ## Built-in Themes OpenCode includes multiple built-in themes ready to use: | Theme Name | Description | | --- | --- | | system | Automatically adapt to terminal theme | | tokyonight | Tokyonight style | | everforest | Everforest style | | ayu | Ayu dark theme | | catppuccin | Catppuccin theme | | catppuccin-macchiato | Catppuccin variant | | gruvbox | Gruvbox style | | kanagawa | Kanagawa style | | nord | Nord style | | matrix | Hacker style (black background, green text) | | one-dark | Atom One Dark | * * * ## system Theme (Recommended) The **system** theme automatically adapts to your terminal color scheme: * Generates grayscale levels based on terminal background * Uses ANSI standard colors * Maintains terminal default text and background Suitable for: * Users with custom terminal themes * Users who want unified styling across all terminal tools * * * ## Using Themes Method 1: Select theme in TUI /themes !(#) Method 2: Set via configuration file **tui.json** { "$schema": "https://opencode.ai/tui.json", "theme": "tokyonight"} * * * ## Custom Themes OpenCode supports fully custom themes defined via JSON. ### Theme Loading Priority * Built-in themes * User directory: ~/.config/opencode/themes/ * Project directory: .opencode/themes/ * Current directory: ./.opencode/themes/ Later loaded themes will override previous ones. * * * ## Creating Themes User-level theme: mkdir -p ~/.config/opencode/themes vim ~/.config/opencode/themes/my-theme.json Project-level theme: mkdir -p .opencode/themes vim .opencode/themes/my-theme.json * * * ## Theme Format Description Supports the following formats: * Hex color: #ffffff * ANSI color: 0-255 * Color reference: primary * Dark/light mode: { "dark": "#000000", "light": "#ffffff"} * Inherit terminal default: "text": "none" * * * ## Complete Example **my-theme.json** { "$schema": "https://opencode.ai/theme.json", "defs": { "bg": "#1e1e2e", "fg": "#cdd6f4", "primary": "#89b4fa", "accent": "#f38ba8", "success": "#a6e3a1", "warning": "#f9e2af" }, "theme": { "primary": { "dark": "primary", "light": "#005f87" }, "accent": { "dark": "accent", "light": "#d7005f" }, "background": { "dark": "bg", "light": "#ffffff" }, "text": { "dark": "fg", "light": "#000000" }, "border": { "dark": "#313244", "light": "#cccccc" }, "syntaxKeyword": { "dark": "primary", "light": "#0000ff" }, "syntaxString": { "dark": "success", "light": "#008000" }, "syntaxComment": { "dark": "#6c7086", "light": "#999999" } }} * * * ## Summary The OpenCode theme system has the following features: * Supports built-in themes, ready to use out of the box * Supports system automatic adaptation to terminal * Supports JSON custom themes * Supports multi-level override mechanism If you pursue the ultimate experience, it is recommended to: * Enable truecolor in terminal * Prioritize using system theme or custom theme
← Opencode CommandsOpencode Agents Md β†’