Themes

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

Mit OpenCode können Sie aus mehreren integrierten Themes auswä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-Voraussetzungen

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 Terminalemulator 24-Bit-Farbe unterstützt (die meisten modernen Terminals wie iTerm2, Alacritty, Kitty, Windows Terminal und aktuelle Versionen von GNOME Terminal tun dies)

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

Integrierte Themes

OpenCode wird mit mehreren integrierten Themes ausgeliefert.

Name	Beschreibung
`system`	Passt sich an die Hintergrundfarbe Ihres Terminals an
`tokyonight`	Basierend auf dem Tokyonight (opens in a new tab)-Theme
`everforest`	Basierend auf dem Everforest (opens in a new tab)-Theme
`ayu`	Basierend auf dem Ayu (opens in a new tab)-Dark-Theme
`catppuccin`	Basierend auf dem Catppuccin (opens in a new tab)-Theme
`catppuccin-macchiato`	Basierend auf dem Catppuccin (opens in a new tab)-Theme
`gruvbox`	Basierend auf dem Gruvbox (opens in a new tab)-Theme
`kanagawa`	Basierend auf dem Kanagawa (opens in a new tab)-Theme
`nord`	Basierend auf dem Nord (opens in a new tab)-Theme
`matrix`	Theme im Hacker-Stil, grün auf schwarz
`one-dark`	Basierend 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 darauf ausgelegt, sich automatisch an das Farbschema Ihres Terminals anzupassen. Im Gegensatz zu herkömmlichen Themes, die feste Farben verwenden, tut das system-Theme Folgendes:

Generiert eine Graustufenskala : Erstellt eine benutzerdefinierte Graustufenskala basierend auf der Hintergrundfarbe Ihres Terminals und sorgt so für optimalen Kontrast.
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 dem Erscheinungsbild ihres Terminals entspricht
Benutzerdefinierte Terminal-Farbschemata verwenden
Ein einheitliches Erscheinungsbild über alle Terminalanwendungen hinweg bevorzugen

Ein Theme verwenden

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

tui.json

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

Benutzerdefinierte Themes

OpenCode unterstützt ein flexibles JSON-basiertes Theme-System, mit dem Benutzer Themes einfach erstellen und anpassen können.

Hierarchie

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

Integrierte Themes - Diese sind in das Binary eingebettet
Benutzer-Konfigurationsverzeichnis - Definiert in ~/.config/opencode/themes/*.json oder $XDG_CONFIG_HOME/opencode/themes/*.json
Projektstammverzeichnis - 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, legen Sie eine JSON-Datei in einem der Theme-Verzeichnisse an.

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
Dark-/Light-Varianten : {"dark": "#000", "light": "#fff"}
Keine Farbe : "none" - Verwendet die Standardfarbe des Terminals oder transparent

Farbdefinitionen

Der Abschnitt defs ist optional und ermöglicht es Ihnen, wiederverwendbare Farben zu definieren, auf die im Theme verwiesen werden kann.

Terminal-Standardwerte

Der spezielle Wert "none" kann für jede Farbe verwendet werden, um die Standardfarbe des Terminals zu erben. Dies ist besonders nützlich, um Themes zu erstellen, die sich nahtlos in das Farbschema Ihres Terminals einfügen:

"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