From 67cda2cbdf1dd077e5e9dfa44d9badf5bdc0a249 Mon Sep 17 00:00:00 2001 From: n24q02m Date: Fri, 20 Feb 2026 20:14:08 +0700 Subject: [PATCH] feat(tui): add default vscode themes collection --- .../src/cli/cmd/tui/context/theme.tsx | 6 ++ .../context/theme/tomorrow-night-blue.json | 70 +++++++++++++++++++ .../cmd/tui/context/theme/vscode-dark.json | 70 +++++++++++++++++++ .../cmd/tui/context/theme/vscode-light.json | 70 +++++++++++++++++++ 4 files changed, 216 insertions(+) create mode 100644 packages/opencode/src/cli/cmd/tui/context/theme/tomorrow-night-blue.json create mode 100644 packages/opencode/src/cli/cmd/tui/context/theme/vscode-dark.json create mode 100644 packages/opencode/src/cli/cmd/tui/context/theme/vscode-light.json diff --git a/packages/opencode/src/cli/cmd/tui/context/theme.tsx b/packages/opencode/src/cli/cmd/tui/context/theme.tsx index 465ed805ea17..64164a1cf3c5 100644 --- a/packages/opencode/src/cli/cmd/tui/context/theme.tsx +++ b/packages/opencode/src/cli/cmd/tui/context/theme.tsx @@ -15,6 +15,9 @@ import dracula from "./theme/dracula.json" with { type: "json" } import everforest from "./theme/everforest.json" with { type: "json" } import flexoki from "./theme/flexoki.json" with { type: "json" } import github from "./theme/github.json" with { type: "json" } +import tomorrowNightBlue from "./theme/tomorrow-night-blue.json" with { type: "json" } +import vscodeDark from "./theme/vscode-dark.json" with { type: "json" } +import vscodeLight from "./theme/vscode-light.json" with { type: "json" } import gruvbox from "./theme/gruvbox.json" with { type: "json" } import kanagawa from "./theme/kanagawa.json" with { type: "json" } import material from "./theme/material.json" with { type: "json" } @@ -150,6 +153,9 @@ export const DEFAULT_THEMES: Record = { everforest, flexoki, github, + "tomorrow-night-blue": tomorrowNightBlue, + "vscode-dark": vscodeDark, + "vscode-light": vscodeLight, gruvbox, kanagawa, material, diff --git a/packages/opencode/src/cli/cmd/tui/context/theme/tomorrow-night-blue.json b/packages/opencode/src/cli/cmd/tui/context/theme/tomorrow-night-blue.json new file mode 100644 index 000000000000..ae0a17272aef --- /dev/null +++ b/packages/opencode/src/cli/cmd/tui/context/theme/tomorrow-night-blue.json @@ -0,0 +1,70 @@ +{ + "$schema": "https://opencode.ai/theme.json", + "defs": { + "background": "#002451", + "currentLine": "#00346e", + "selection": "#003f8e", + "foreground": "#ffffff", + "comment": "#7285b7", + "cyan": "#99ffff", + "green": "#d1f1a9", + "orange": "#ffc58f", + "pink": "#ff9da4", + "purple": "#ebbbff", + "red": "#ff9da4", + "yellow": "#ffeead", + "blue": "#bbdaff" + }, + "theme": { + "primary": { "dark": "blue", "light": "blue" }, + "secondary": { "dark": "purple", "light": "purple" }, + "accent": { "dark": "cyan", "light": "cyan" }, + "error": { "dark": "red", "light": "red" }, + "warning": { "dark": "yellow", "light": "yellow" }, + "success": { "dark": "green", "light": "green" }, + "info": { "dark": "blue", "light": "blue" }, + "text": { "dark": "foreground", "light": "#002451" }, + "textMuted": { "dark": "comment", "light": "#7285b7" }, + "background": { "dark": "background", "light": "#ffffff" }, + "backgroundPanel": { "dark": "#001733", "light": "#e8e8e2" }, + "backgroundElement": { "dark": "currentLine", "light": "#d8d8d2" }, + "border": { "dark": "currentLine", "light": "#c8c8c2" }, + "borderActive": { "dark": "blue", "light": "blue" }, + "borderSubtle": { "dark": "#001026", "light": "#e0e0e0" }, + "diffAdded": { "dark": "green", "light": "green" }, + "diffRemoved": { "dark": "red", "light": "red" }, + "diffContext": { "dark": "comment", "light": "#7285b7" }, + "diffHunkHeader": { "dark": "comment", "light": "#7285b7" }, + "diffHighlightAdded": { "dark": "green", "light": "green" }, + "diffHighlightRemoved": { "dark": "red", "light": "red" }, + "diffAddedBg": { "dark": "#004020", "light": "#e0ffe0" }, + "diffRemovedBg": { "dark": "#400010", "light": "#ffe0e0" }, + "diffContextBg": { "dark": "#001733", "light": "#e8e8e2" }, + "diffLineNumber": { "dark": "currentLine", "light": "#c8c8c2" }, + "diffAddedLineNumberBg": { "dark": "#004020", "light": "#e0ffe0" }, + "diffRemovedLineNumberBg": { "dark": "#400010", "light": "#ffe0e0" }, + "markdownText": { "dark": "foreground", "light": "#002451" }, + "markdownHeading": { "dark": "blue", "light": "blue" }, + "markdownLink": { "dark": "cyan", "light": "cyan" }, + "markdownLinkText": { "dark": "purple", "light": "purple" }, + "markdownCode": { "dark": "green", "light": "green" }, + "markdownBlockQuote": { "dark": "comment", "light": "#7285b7" }, + "markdownEmph": { "dark": "yellow", "light": "yellow" }, + "markdownStrong": { "dark": "orange", "light": "orange" }, + "markdownHorizontalRule": { "dark": "comment", "light": "#7285b7" }, + "markdownListItem": { "dark": "blue", "light": "blue" }, + "markdownListEnumeration": { "dark": "cyan", "light": "cyan" }, + "markdownImage": { "dark": "cyan", "light": "cyan" }, + "markdownImageText": { "dark": "purple", "light": "purple" }, + "markdownCodeBlock": { "dark": "foreground", "light": "#002451" }, + "syntaxComment": { "dark": "comment", "light": "#7285b7" }, + "syntaxKeyword": { "dark": "purple", "light": "purple" }, + "syntaxFunction": { "dark": "blue", "light": "blue" }, + "syntaxVariable": { "dark": "red", "light": "red" }, + "syntaxString": { "dark": "green", "light": "green" }, + "syntaxNumber": { "dark": "orange", "light": "orange" }, + "syntaxType": { "dark": "yellow", "light": "yellow" }, + "syntaxOperator": { "dark": "cyan", "light": "cyan" }, + "syntaxPunctuation": { "dark": "foreground", "light": "#002451" } + } +} diff --git a/packages/opencode/src/cli/cmd/tui/context/theme/vscode-dark.json b/packages/opencode/src/cli/cmd/tui/context/theme/vscode-dark.json new file mode 100644 index 000000000000..a045f567239b --- /dev/null +++ b/packages/opencode/src/cli/cmd/tui/context/theme/vscode-dark.json @@ -0,0 +1,70 @@ +{ + "$schema": "https://opencode.ai/theme.json", + "defs": { + "background": "#1e1e1e", + "currentLine": "#2d2d2d", + "selection": "#264f78", + "foreground": "#d4d4d4", + "comment": "#6a9955", + "cyan": "#4ec9b0", + "green": "#b5cea8", + "orange": "#ce9178", + "pink": "#c586c0", + "purple": "#c586c0", + "red": "#f44747", + "yellow": "#dcdcaa", + "blue": "#569cd6" + }, + "theme": { + "primary": { "dark": "blue", "light": "blue" }, + "secondary": { "dark": "purple", "light": "purple" }, + "accent": { "dark": "cyan", "light": "cyan" }, + "error": { "dark": "red", "light": "red" }, + "warning": { "dark": "yellow", "light": "yellow" }, + "success": { "dark": "green", "light": "green" }, + "info": { "dark": "blue", "light": "blue" }, + "text": { "dark": "foreground", "light": "#1e1e1e" }, + "textMuted": { "dark": "comment", "light": "#6a9955" }, + "background": { "dark": "background", "light": "#ffffff" }, + "backgroundPanel": { "dark": "#252526", "light": "#f3f3f3" }, + "backgroundElement": { "dark": "currentLine", "light": "#e4e6f1" }, + "border": { "dark": "currentLine", "light": "#cccccc" }, + "borderActive": { "dark": "blue", "light": "blue" }, + "borderSubtle": { "dark": "#333333", "light": "#e4e4e4" }, + "diffAdded": { "dark": "green", "light": "green" }, + "diffRemoved": { "dark": "red", "light": "red" }, + "diffContext": { "dark": "comment", "light": "#6a9955" }, + "diffHunkHeader": { "dark": "comment", "light": "#6a9955" }, + "diffHighlightAdded": { "dark": "green", "light": "green" }, + "diffHighlightRemoved": { "dark": "red", "light": "red" }, + "diffAddedBg": { "dark": "#203820", "light": "#e0ffe0" }, + "diffRemovedBg": { "dark": "#4a2020", "light": "#ffe0e0" }, + "diffContextBg": { "dark": "#252526", "light": "#f3f3f3" }, + "diffLineNumber": { "dark": "currentLine", "light": "#cccccc" }, + "diffAddedLineNumberBg": { "dark": "#203820", "light": "#e0ffe0" }, + "diffRemovedLineNumberBg": { "dark": "#4a2020", "light": "#ffe0e0" }, + "markdownText": { "dark": "foreground", "light": "#1e1e1e" }, + "markdownHeading": { "dark": "blue", "light": "blue" }, + "markdownLink": { "dark": "cyan", "light": "cyan" }, + "markdownLinkText": { "dark": "purple", "light": "purple" }, + "markdownCode": { "dark": "green", "light": "green" }, + "markdownBlockQuote": { "dark": "comment", "light": "#6a9955" }, + "markdownEmph": { "dark": "yellow", "light": "yellow" }, + "markdownStrong": { "dark": "orange", "light": "orange" }, + "markdownHorizontalRule": { "dark": "comment", "light": "#6a9955" }, + "markdownListItem": { "dark": "blue", "light": "blue" }, + "markdownListEnumeration": { "dark": "cyan", "light": "cyan" }, + "markdownImage": { "dark": "cyan", "light": "cyan" }, + "markdownImageText": { "dark": "purple", "light": "purple" }, + "markdownCodeBlock": { "dark": "foreground", "light": "#1e1e1e" }, + "syntaxComment": { "dark": "comment", "light": "#6a9955" }, + "syntaxKeyword": { "dark": "blue", "light": "blue" }, + "syntaxFunction": { "dark": "yellow", "light": "yellow" }, + "syntaxVariable": { "dark": "cyan", "light": "cyan" }, + "syntaxString": { "dark": "orange", "light": "orange" }, + "syntaxNumber": { "dark": "green", "light": "green" }, + "syntaxType": { "dark": "cyan", "light": "cyan" }, + "syntaxOperator": { "dark": "foreground", "light": "#1e1e1e" }, + "syntaxPunctuation": { "dark": "foreground", "light": "#1e1e1e" } + } +} diff --git a/packages/opencode/src/cli/cmd/tui/context/theme/vscode-light.json b/packages/opencode/src/cli/cmd/tui/context/theme/vscode-light.json new file mode 100644 index 000000000000..86d4b2dc3f33 --- /dev/null +++ b/packages/opencode/src/cli/cmd/tui/context/theme/vscode-light.json @@ -0,0 +1,70 @@ +{ + "$schema": "https://opencode.ai/theme.json", + "defs": { + "background": "#ffffff", + "currentLine": "#f3f3f3", + "selection": "#add6ff", + "foreground": "#333333", + "comment": "#008000", + "cyan": "#0000ff", + "green": "#098658", + "orange": "#a31515", + "pink": "#af00db", + "purple": "#af00db", + "red": "#e51400", + "yellow": "#795e26", + "blue": "#0000ff" + }, + "theme": { + "primary": { "dark": "blue", "light": "blue" }, + "secondary": { "dark": "purple", "light": "purple" }, + "accent": { "dark": "cyan", "light": "cyan" }, + "error": { "dark": "red", "light": "red" }, + "warning": { "dark": "yellow", "light": "yellow" }, + "success": { "dark": "green", "light": "green" }, + "info": { "dark": "blue", "light": "blue" }, + "text": { "dark": "foreground", "light": "#333333" }, + "textMuted": { "dark": "comment", "light": "#008000" }, + "background": { "dark": "background", "light": "#ffffff" }, + "backgroundPanel": { "dark": "#f3f3f3", "light": "#f3f3f3" }, + "backgroundElement": { "dark": "currentLine", "light": "#e4e6f1" }, + "border": { "dark": "currentLine", "light": "#cccccc" }, + "borderActive": { "dark": "blue", "light": "blue" }, + "borderSubtle": { "dark": "#e4e4e4", "light": "#e4e4e4" }, + "diffAdded": { "dark": "green", "light": "green" }, + "diffRemoved": { "dark": "red", "light": "red" }, + "diffContext": { "dark": "comment", "light": "#008000" }, + "diffHunkHeader": { "dark": "comment", "light": "#008000" }, + "diffHighlightAdded": { "dark": "green", "light": "green" }, + "diffHighlightRemoved": { "dark": "red", "light": "red" }, + "diffAddedBg": { "dark": "#e0ffe0", "light": "#e0ffe0" }, + "diffRemovedBg": { "dark": "#ffe0e0", "light": "#ffe0e0" }, + "diffContextBg": { "dark": "#f3f3f3", "light": "#f3f3f3" }, + "diffLineNumber": { "dark": "currentLine", "light": "#cccccc" }, + "diffAddedLineNumberBg": { "dark": "#e0ffe0", "light": "#e0ffe0" }, + "diffRemovedLineNumberBg": { "dark": "#ffe0e0", "light": "#ffe0e0" }, + "markdownText": { "dark": "foreground", "light": "#333333" }, + "markdownHeading": { "dark": "blue", "light": "blue" }, + "markdownLink": { "dark": "cyan", "light": "cyan" }, + "markdownLinkText": { "dark": "purple", "light": "purple" }, + "markdownCode": { "dark": "green", "light": "green" }, + "markdownBlockQuote": { "dark": "comment", "light": "#008000" }, + "markdownEmph": { "dark": "yellow", "light": "yellow" }, + "markdownStrong": { "dark": "orange", "light": "orange" }, + "markdownHorizontalRule": { "dark": "comment", "light": "#008000" }, + "markdownListItem": { "dark": "blue", "light": "blue" }, + "markdownListEnumeration": { "dark": "cyan", "light": "cyan" }, + "markdownImage": { "dark": "cyan", "light": "cyan" }, + "markdownImageText": { "dark": "purple", "light": "purple" }, + "markdownCodeBlock": { "dark": "foreground", "light": "#333333" }, + "syntaxComment": { "dark": "comment", "light": "#008000" }, + "syntaxKeyword": { "dark": "blue", "light": "blue" }, + "syntaxFunction": { "dark": "yellow", "light": "yellow" }, + "syntaxVariable": { "dark": "cyan", "light": "cyan" }, + "syntaxString": { "dark": "orange", "light": "orange" }, + "syntaxNumber": { "dark": "green", "light": "green" }, + "syntaxType": { "dark": "cyan", "light": "cyan" }, + "syntaxOperator": { "dark": "foreground", "light": "#333333" }, + "syntaxPunctuation": { "dark": "foreground", "light": "#333333" } + } +}