Themes

Wählen Sie ein integriertes Theme oder definieren Sie Ihr eigenes.

Mit OpenCode können Sie aus mehreren integrierten Themes wählen, ein Theme verwenden, das sich an Ihr Terminal-Theme anpasst, oder Ihr eigenes benutzerdefiniertes Theme definieren.

Standardmäßig verwendet OpenCode unser eigenes opencode Theme.

Terminal-Anforderungen

Damit Themes mit ihrer vollständigen Farbpalette korrekt angezeigt werden, muss Ihr Terminal Truecolor (24-Bit-Farbe) unterstützen. Die meisten modernen Terminals unterstützen dies standardmäßig, aber möglicherweise müssen Sie es aktivieren:

Unterstützung prüfen: Führen Sie echo $COLORTERM aus - es sollte truecolor oder 24bit ausgeben
Truecolor aktivieren: Setzen Sie die Umgebungsvariable COLORTERM=truecolor in Ihrem Shell-Profil
Terminal-Kompatibilität: Stellen Sie sicher, dass Ihr Terminal-Emulator 24-Bit-Farbe unterstützt (die meisten modernen Terminals wie iTerm2, Alacritty, Kitty, Windows Terminal und neuere Versionen von GNOME Terminal tun dies)

Ohne Truecolor-Unterstützung können Themes mit reduzierter Farbgenauigkeit erscheinen oder auf die nächste 256-Farben-Approximation zurückfallen.

Integrierte Themes

OpenCode wird mit mehreren integrierten Themes geliefert.

Name	Beschreibung
`system`	Passt sich der Hintergrundfarbe Ihres Terminals an
`tokyonight`	Basiert auf dem Tokyonight (opens in a new tab) Theme
`everforest`	Basiert auf dem Everforest (opens in a new tab) Theme
`ayu`	Basiert auf dem Ayu (opens in a new tab) Dark Theme
`catppuccin`	Basiert auf dem Catppuccin (opens in a new tab) Theme
`catppuccin-macchiato`	Basiert auf dem Catppuccin (opens in a new tab) Theme
`gruvbox`	Basiert auf dem Gruvbox (opens in a new tab) Theme
`kanagawa`	Basiert auf dem Kanagawa (opens in a new tab) Theme
`nord`	Basiert auf dem Nord (opens in a new tab) Theme
`matrix`	Hacker-Stil grün auf schwarz Theme
`one-dark`	Basiert auf dem Atom One (opens in a new tab) Dark Theme

Und mehr, wir fügen ständig neue Themes hinzu.

System Theme

Das system Theme ist so konzipiert, dass es sich automatisch an das Farbschema Ihres Terminals anpasst. Im Gegensatz zu traditionellen Themes, die feste Farben verwenden, bietet das system Theme:

Generiert Graustufen: Erstellt eine benutzerdefinierte Grauskala basierend auf der Hintergrundfarbe Ihres Terminals, um optimalen Kontrast zu gewährleisten.
Verwendet ANSI-Farben: Nutzt Standard-ANSI-Farben (0-15) für Syntaxhervorhebung und UI-Elemente, die die Farbpalette Ihres Terminals respektieren.
Bewahrt Terminal-Standardwerte: Verwendet none für Text- und Hintergrundfarben, um das native Erscheinungsbild Ihres Terminals beizubehalten.

Das System Theme ist für Benutzer, die:

Möchten, dass OpenCode zum Erscheinungsbild ihres Terminals passt
Benutzerdefinierte Terminal-Farbschemata verwenden
Ein einheitliches Aussehen über alle Terminal-Anwendungen hinweg bevorzugen

Ein Theme verwenden

Sie können ein Theme auswählen, indem Sie die Theme-Auswahl mit dem /theme Befehl aufrufen. Oder Sie können es in Ihrer Konfiguration angeben.

opencode.json

{
  "$schema": "https://opencode.ai/config.json",
  "theme": "tokyonight"
}

Benutzerdefinierte Themes

OpenCode unterstützt ein flexibles JSON-basiertes Theme-System, das es Benutzern ermöglicht, Themes einfach zu erstellen und anzupassen.

Hierarchie

Themes werden aus mehreren Verzeichnissen in der folgenden Reihenfolge geladen, wobei spätere Verzeichnisse frühere überschreiben:

Integrierte Themes - Diese sind in die Binärdatei eingebettet
Benutzer-Konfigurationsverzeichnis - Definiert in ~/.config/opencode/themes/*.json oder $XDG_CONFIG_HOME/opencode/themes/*.json
Projekt-Stammverzeichnis - Definiert in <project-root>/.opencode/themes/*.json
Aktuelles Arbeitsverzeichnis - Definiert in ./.opencode/themes/*.json

Wenn mehrere Verzeichnisse ein Theme mit demselben Namen enthalten, wird das Theme aus dem Verzeichnis mit höherer Priorität verwendet.

Ein Theme erstellen

Um ein benutzerdefiniertes Theme zu erstellen, erstellen Sie eine JSON-Datei in einem der Theme-Verzeichnisse.

Für benutzerweite Themes:

mkdir -p ~/.config/opencode/themes
vim ~/.config/opencode/themes/my-theme.json

Und für projektspezifische Themes.

mkdir -p .opencode/themes
vim .opencode/themes/my-theme.json

JSON-Format

Themes verwenden ein flexibles JSON-Format mit Unterstützung für:

Hex-Farben: "#ffffff"
ANSI-Farben: 3 (0-255)
Farbreferenzen: "primary" oder benutzerdefinierte Definitionen
Dunkel/Hell-Varianten: {"dark": "#000", "light": "#fff"}
Keine Farbe: "none" - Verwendet die Standardfarbe des Terminals oder transparent

Farbdefinitionen

Der defs Abschnitt ist optional und ermöglicht es Ihnen, wiederverwendbare Farben zu definieren, die im Theme referenziert werden können.

Terminal-Standardwerte

Der spezielle Wert "none" kann für jede Farbe verwendet werden, um die Standardfarbe des Terminals zu übernehmen. Dies ist besonders nützlich für die Erstellung von Themes, die nahtlos mit dem Farbschema Ihres Terminals verschmelzen:

"text": "none" - Verwendet die Standard-Vordergrundfarbe des Terminals
"background": "none" - Verwendet die Standard-Hintergrundfarbe des Terminals

Beispiel

Hier ist ein Beispiel für ein benutzerdefiniertes Theme:

my-theme.json

{
  "$schema": "https://opencode.ai/theme.json",
  "defs": {
    "nord0": "#2E3440",
    "nord1": "#3B4252",
    "nord2": "#434C5E",
    "nord3": "#4C566A",
    "nord4": "#D8DEE9",
    "nord5": "#E5E9F0",
    "nord6": "#ECEFF4",
    "nord7": "#8FBCBB",
    "nord8": "#88C0D0",
    "nord9": "#81A1C1",
    "nord10": "#5E81AC",
    "nord11": "#BF616A",
    "nord12": "#D08770",
    "nord13": "#EBCB8B",
    "nord14": "#A3BE8C",
    "nord15": "#B48EAD"
  },
  "theme": {
    "primary": {
      "dark": "nord8",
      "light": "nord10"
    },
    "secondary": {
      "dark": "nord9",
      "light": "nord9"
    },
    "accent": {
      "dark": "nord7",
      "light": "nord7"
    },
    "error": {
      "dark": "nord11",
      "light": "nord11"
    },
    "warning": {
      "dark": "nord12",
      "light": "nord12"
    },
    "success": {
      "dark": "nord14",
      "light": "nord14"
    },
    "info": {
      "dark": "nord8",
      "light": "nord10"
    },
    "text": {
      "dark": "nord4",
      "light": "nord0"
    },
    "textMuted": {
      "dark": "nord3",
      "light": "nord1"
    },
    "background": {
      "dark": "nord0",
      "light": "nord6"
    },
    "backgroundPanel": {
      "dark": "nord1",
      "light": "nord5"
    },
    "backgroundElement": {
      "dark": "nord1",
      "light": "nord4"
    },
    "border": {
      "dark": "nord2",
      "light": "nord3"
    },
    "borderActive": {
      "dark": "nord3",
      "light": "nord2"
    },
    "borderSubtle": {
      "dark": "nord2",
      "light": "nord3"
    },
    "diffAdded": {
      "dark": "nord14",
      "light": "nord14"
    },
    "diffRemoved": {
      "dark": "nord11",
      "light": "nord11"
    },
    "diffContext": {
      "dark": "nord3",
      "light": "nord3"
    },
    "diffHunkHeader": {
      "dark": "nord3",
      "light": "nord3"
    },
    "diffHighlightAdded": {
      "dark": "nord14",
      "light": "nord14"
    },
    "diffHighlightRemoved": {
      "dark": "nord11",
      "light": "nord11"
    },
    "diffAddedBg": {
      "dark": "#3B4252",
      "light": "#E5E9F0"
    },
    "diffRemovedBg": {
      "dark": "#3B4252",
      "light": "#E5E9F0"
    },
    "diffContextBg": {
      "dark": "nord1",
      "light": "nord5"
    },
    "diffLineNumber": {
      "dark": "nord2",
      "light": "nord4"
    },
    "diffAddedLineNumberBg": {
      "dark": "#3B4252",
      "light": "#E5E9F0"
    },
    "diffRemovedLineNumberBg": {
      "dark": "#3B4252",
      "light": "#E5E9F0"
    },
    "markdownText": {
      "dark": "nord4",
      "light": "nord0"
    },
    "markdownHeading": {
      "dark": "nord8",
      "light": "nord10"
    },
    "markdownLink": {
      "dark": "nord9",
      "light": "nord9"
    },
    "markdownLinkText": {
      "dark": "nord7",
      "light": "nord7"
    },
    "markdownCode": {
      "dark": "nord14",
      "light": "nord14"
    },
    "markdownBlockQuote": {
      "dark": "nord3",
      "light": "nord3"
    },
    "markdownEmph": {
      "dark": "nord12",
      "light": "nord12"
    },
    "markdownStrong": {
      "dark": "nord13",
      "light": "nord13"
    },
    "markdownHorizontalRule": {
      "dark": "nord3",
      "light": "nord3"
    },
    "markdownListItem": {
      "dark": "nord8",
      "light": "nord10"
    },
    "markdownListEnumeration": {
      "dark": "nord7",
      "light": "nord7"
    },
    "markdownImage": {
      "dark": "nord9",
      "light": "nord9"
    },
    "markdownImageText": {
      "dark": "nord7",
      "light": "nord7"
    },
    "markdownCodeBlock": {
      "dark": "nord4",
      "light": "nord0"
    },
    "syntaxComment": {
      "dark": "nord3",
      "light": "nord3"
    },
    "syntaxKeyword": {
      "dark": "nord9",
      "light": "nord9"
    },
    "syntaxFunction": {
      "dark": "nord8",
      "light": "nord8"
    },
    "syntaxVariable": {
      "dark": "nord7",
      "light": "nord7"
    },
    "syntaxString": {
      "dark": "nord14",
      "light": "nord14"
    },
    "syntaxNumber": {
      "dark": "nord15",
      "light": "nord15"
    },
    "syntaxType": {
      "dark": "nord7",
      "light": "nord7"
    },
    "syntaxOperator": {
      "dark": "nord9",
      "light": "nord9"
    },
    "syntaxPunctuation": {
      "dark": "nord4",
      "light": "nord0"
    }
  }
}

Modelle Tastenkürzel