feat(desktop): add Vesper theme (#7331)

Co-authored-by: Anthony Huang <[email protected]>

3 files changed, 135 insertions, 0 deletions

diff --git a/packages/ui/src/theme/default-themes.ts b/packages/ui/src/theme/default-themes.ts
index 42e94b446..54c96251c 100644
--- a/packages/ui/src/theme/default-themes.ts
+++ b/packages/ui/src/theme/default-themes.ts
@@ -10,6 +10,7 @@ import ayuThemeJson from "./themes/ayu.json"
 import oneDarkProThemeJson from "./themes/onedarkpro.json"
 import shadesOfPurpleThemeJson from "./themes/shadesofpurple.json"
 import nightowlThemeJson from "./themes/nightowl.json"
+import vesperThemeJson from "./themes/vesper.json"
 
 export const oc1Theme = oc1ThemeJson as DesktopTheme
 export const tokyonightTheme = tokyoThemeJson as DesktopTheme
@@ -22,6 +23,7 @@ export const ayuTheme = ayuThemeJson as DesktopTheme
 export const oneDarkProTheme = oneDarkProThemeJson as DesktopTheme
 export const shadesOfPurpleTheme = shadesOfPurpleThemeJson as DesktopTheme
 export const nightowlTheme = nightowlThemeJson as DesktopTheme
+export const vesperTheme = vesperThemeJson as DesktopTheme
 
 export const DEFAULT_THEMES: Record<string, DesktopTheme> = {
   "oc-1": oc1Theme,
@@ -35,4 +37,5 @@ export const DEFAULT_THEMES: Record<string, DesktopTheme> = {
   onedarkpro: oneDarkProTheme,
   shadesofpurple: shadesOfPurpleTheme,
   nightowl: nightowlTheme,
+  vesper: vesperTheme,
 }
diff --git a/packages/ui/src/theme/index.ts b/packages/ui/src/theme/index.ts
index 1ec4dc682..e8d2fe79f 100644
--- a/packages/ui/src/theme/index.ts
+++ b/packages/ui/src/theme/index.ts
@@ -42,4 +42,5 @@ export {
   oneDarkProTheme,
   shadesOfPurpleTheme,
   nightowlTheme,
+  vesperTheme,
 } from "./default-themes"
diff --git a/packages/ui/src/theme/themes/vesper.json b/packages/ui/src/theme/themes/vesper.json
new file mode 100644
index 000000000..3c5e44cbd
--- /dev/null
+++ b/packages/ui/src/theme/themes/vesper.json
@@ -0,0 +1,131 @@
+{
+  "$schema": "https://opencode.ai/desktop-theme.json",
+  "name": "Vesper",
+  "id": "vesper",
+  "light": {
+    "seeds": {
+      "neutral": "#F0F0F0",
+      "primary": "#FFC799",
+      "success": "#99FFE4",
+      "warning": "#FFC799",
+      "error": "#FF8080",
+      "info": "#FFC799",
+      "interactive": "#FFC799",
+      "diffAdd": "#99FFE4",
+      "diffDelete": "#FF8080"
+    },
+    "overrides": {
+      "background-base": "#FFF",
+      "background-weak": "#F8F8F8",
+      "background-strong": "#F0F0F0",
+      "background-stronger": "#E8E8E8",
+      "border-weak-base": "#E8E8E8",
+      "border-weak-hover": "#E0E0E0",
+      "border-weak-active": "#D8D8D8",
+      "border-weak-selected": "#D0D0D0",
+      "border-weak-disabled": "#F0F0F0",
+      "border-weak-focus": "#D8D8D8",
+      "border-base": "#D0D0D0",
+      "border-hover": "#C8C8C8",
+      "border-active": "#C0C0C0",
+      "border-selected": "#B8B8B8",
+      "border-disabled": "#E8E8E8",
+      "border-focus": "#C0C0C0",
+      "border-strong-base": "#A0A0A0",
+      "border-strong-hover": "#989898",
+      "border-strong-active": "#909090",
+      "border-strong-selected": "#888888",
+      "border-strong-disabled": "#D0D0D0",
+      "border-strong-focus": "#909090",
+      "surface-diff-add-base": "#e8f5e8",
+      "surface-diff-delete-base": "#f5e8e8",
+      "surface-diff-hidden-base": "#F0F0F0",
+      "text-base": "#101010",
+      "text-weak": "#A0A0A0",
+      "text-strong": "#000000",
+      "syntax-string": "#99FFE4",
+      "syntax-primitive": "#FF8080",
+      "syntax-property": "#FFC799",
+      "syntax-type": "#FFC799",
+      "syntax-constant": "#A0A0A0",
+      "syntax-info": "#A0A0A0",
+      "markdown-heading": "#FFC799",
+      "markdown-text": "#101010",
+      "markdown-link": "#FFC799",
+      "markdown-link-text": "#A0A0A0",
+      "markdown-code": "#A0A0A0",
+      "markdown-block-quote": "#101010",
+      "markdown-emph": "#101010",
+      "markdown-strong": "#101010",
+      "markdown-horizontal-rule": "#65737E",
+      "markdown-list-item": "#101010",
+      "markdown-list-enumeration": "#101010",
+      "markdown-image": "#FFC799",
+      "markdown-image-text": "#A0A0A0",
+      "markdown-code-block": "#FFC799"
+    }
+  },
+  "dark": {
+    "seeds": {
+      "neutral": "#101010",
+      "primary": "#FFC799",
+      "success": "#99FFE4",
+      "warning": "#FFC799",
+      "error": "#FF8080",
+      "info": "#FFC799",
+      "interactive": "#FFC799",
+      "diffAdd": "#99FFE4",
+      "diffDelete": "#FF8080"
+    },
+    "overrides": {
+      "background-base": "#101010",
+      "background-weak": "#141414",
+      "background-strong": "#0C0C0C",
+      "background-stronger": "#080808",
+      "border-weak-base": "#1C1C1C",
+      "border-weak-hover": "#202020",
+      "border-weak-active": "#242424",
+      "border-weak-selected": "#282828",
+      "border-weak-disabled": "#141414",
+      "border-weak-focus": "#242424",
+      "border-base": "#282828",
+      "border-hover": "#303030",
+      "border-active": "#383838",
+      "border-selected": "#404040",
+      "border-disabled": "#181818",
+      "border-focus": "#383838",
+      "border-strong-base": "#505050",
+      "border-strong-hover": "#585858",
+      "border-strong-active": "#606060",
+      "border-strong-selected": "#686868",
+      "border-strong-disabled": "#202020",
+      "border-strong-focus": "#606060",
+      "surface-diff-add-base": "#0d2818",
+      "surface-diff-delete-base": "#281a1a",
+      "surface-diff-hidden-base": "#141414",
+      "text-base": "#FFF",
+      "text-weak": "#A0A0A0",
+      "text-strong": "#FFFFFF",
+      "syntax-string": "#99FFE4",
+      "syntax-primitive": "#FF8080",
+      "syntax-property": "#FFC799",
+      "syntax-type": "#FFC799",
+      "syntax-constant": "#A0A0A0",
+      "syntax-info": "#8b8b8b",
+      "markdown-heading": "#FFC799",
+      "markdown-text": "#FFF",
+      "markdown-link": "#FFC799",
+      "markdown-link-text": "#A0A0A0",
+      "markdown-code": "#A0A0A0",
+      "markdown-block-quote": "#FFF",
+      "markdown-emph": "#FFF",
+      "markdown-strong": "#FFF",
+      "markdown-horizontal-rule": "#65737E",
+      "markdown-list-item": "#FFF",
+      "markdown-list-enumeration": "#FFF",
+      "markdown-image": "#FFC799",
+      "markdown-image-text": "#A0A0A0",
+      "markdown-code-block": "#FFF"
+    }
+  }
+}