Themes

Selectionnez un theme integre ou definissez le votre.

Avec OpenCode, vous pouvez selectionner l’un des plusieurs themes integres, utiliser un theme qui s’adapte a votre theme de terminal, ou definir votre propre theme personnalise.

Par defaut, OpenCode utilise notre propre theme opencode.

Exigences du terminal

Pour que les themes s’affichent correctement avec leur palette de couleurs complete, votre terminal doit prendre en charge le truecolor (couleur 24 bits). La plupart des terminaux modernes prennent en charge cela par defaut, mais vous devrez peut-etre l’activer :

Verifier la prise en charge : Executez echo $COLORTERM - il devrait afficher truecolor ou 24bit
Activer le truecolor : Definissez la variable d’environnement COLORTERM=truecolor dans votre profil de shell
Compatibilite du terminal : Assurez-vous que votre emulateur de terminal prend en charge la couleur 24 bits (la plupart des terminaux modernes comme iTerm2, Alacritty, Kitty, Windows Terminal et les versions recentes de GNOME Terminal le font)

Sans la prise en charge du truecolor, les themes peuvent apparaitre avec une precision de couleur reduite ou revenir a l’approximation la plus proche de 256 couleurs.

Themes integres

OpenCode est fourni avec plusieurs themes integres.

Nom	Description
`system`	S’adapte a la couleur d’arriere-plan de votre terminal
`tokyonight`	Base sur le theme Tokyonight
`everforest`	Base sur le theme Everforest
`ayu`	Base sur le theme sombre Ayu
`catppuccin`	Base sur le theme Catppuccin
`catppuccin-macchiato`	Base sur le theme Catppuccin
`gruvbox`	Base sur le theme Gruvbox
`kanagawa`	Base sur le theme Kanagawa
`nord`	Base sur le theme Nord
`matrix`	Theme vert de style hacker sur fond noir
`one-dark`	Base sur le theme sombre Atom One

Et plus, nous ajoutons constamment de nouveaux themes.

Theme systeme

Le theme system est concu pour s’adapter automatiquement au schema de couleurs de votre terminal. Contrairement aux themes traditionnels qui utilisent des couleurs fixes, le theme system :

Genere une echelle de gris : Cree une echelle de gris personnalisee basee sur la couleur d’arriere-plan de votre terminal, garantissant un contraste optimal.
Utilise les couleurs ANSI : Exploite les couleurs ANSI standard (0-15) pour la coloration syntaxique et les elements de l’interface, qui respectent la palette de couleurs de votre terminal.
Preserve les valeurs par defaut du terminal : Utilise none pour les couleurs de texte et d’arriere-plan pour maintenir l’apparence native de votre terminal.

Le theme systeme est destine aux utilisateurs qui :

Souhaitent qu’OpenCode corresponde a l’apparence de leur terminal
Utilisent des schemas de couleurs de terminal personnalises
Preferent un aspect coherent dans toutes les applications terminales

Utilisation d’un theme

Vous pouvez selectionner un theme en faisant apparaitre la selection de theme avec la commande /theme. Ou vous pouvez le specifier dans votre configuration.

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

Themes personnalises

OpenCode prend en charge un systeme de theme flexible base sur JSON qui permet aux utilisateurs de creer et de personnaliser facilement des themes.

Hierarchie

Les themes sont charges a partir de plusieurs repertoires dans l’ordre suivant ou les repertoires ulterieurs remplacent les precedents :

Themes integres - Ceux-ci sont integres dans le binaire
Repertoire de configuration utilisateur - Defini dans ~/.config/opencode/themes/*.json ou $XDG_CONFIG_HOME/opencode/themes/*.json
Repertoire racine du projet - Defini dans <racine-du-projet>/.opencode/themes/*.json
Repertoire de travail actuel - Defini dans ./.opencode/themes/*.json

Si plusieurs repertoires contiennent un theme avec le meme nom, le theme du repertoire avec une priorite plus elevee sera utilise.

Creation d’un theme

Pour creer un theme personnalise, creez un fichier JSON dans l’un des repertoires de themes.

Pour les themes a l’echelle de l’utilisateur :

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

Et pour les themes specifiques au projet.

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

Format JSON

Les themes utilisent un format JSON flexible avec la prise en charge de :

Couleurs hexadecimales : "#ffffff"
Couleurs ANSI : 3 (0-255)
References de couleur : "primary" ou definitions personnalisees
Variantes sombres/clair : {"dark": "#000", "light": "#fff"}
Pas de couleur : "none" - Utilise la couleur par defaut du terminal ou transparent

Definitions de couleur

La section defs est facultative et elle vous permet de definir des couleurs reutilisables qui peuvent etre referencees dans le theme.

Valeurs par defaut du terminal

La valeur speciale "none" peut etre utilisee pour n’importe quelle couleur pour heriter de la couleur par defaut du terminal. C’est particulierement utile pour creer des themes qui se fondent parfaitement avec le schema de couleurs de votre terminal :

"text": "none" - Utilise la couleur de premier plan par defaut du terminal
"background": "none" - Utilise la couleur d’arriere-plan par defaut du terminal

Exemple

Voici un exemple de theme personnalise :

{
  "$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"
    }
  }
}