Add VSCode themes plugin with 30+ popular themes (#336)

Co-authored-by: Claude <noreply@anthropic.com>
2026-07-07 21:35:18 +02:00 · 2025-12-31 10:05:55 -08:00
parent 6b9b207e1c
commit cd65ef8dbe
38 changed files with 2487 additions and 786 deletions
@@ -0,0 +1,165 @@
+import type { Theme } from '@yaakapp/api';
+
+export const catppuccinFrappe: Theme = {
+  id: 'catppuccin-frappe',
+  label: 'Catppuccin Frappé',
+  dark: true,
+  base: {
+    surface: 'hsl(231,19%,20%)',
+    text: 'hsl(227,70%,87%)',
+    textSubtle: 'hsl(228,29%,73%)',
+    textSubtlest: 'hsl(227,17%,58%)',
+    primary: 'hsl(277,59%,76%)',
+    secondary: 'hsl(228,39%,80%)',
+    info: 'hsl(222,74%,74%)',
+    success: 'hsl(96,44%,68%)',
+    notice: 'hsl(40,62%,73%)',
+    warning: 'hsl(20,79%,70%)',
+    danger: 'hsl(359,68%,71%)',
+  },
+  components: {
+    dialog: {
+      surface: 'hsl(240,21%,12%)',
+    },
+    sidebar: {
+      surface: 'hsl(229,19%,23%)',
+      border: 'hsl(229,19%,27%)',
+    },
+    appHeader: {
+      surface: 'hsl(229,20%,17%)',
+      border: 'hsl(229,20%,25%)',
+    },
+    responsePane: {
+      surface: 'hsl(229,19%,23%)',
+      border: 'hsl(229,19%,27%)',
+    },
+    button: {
+      primary: 'hsl(277,59%,68%)',
+      secondary: 'hsl(228,39%,72%)',
+      info: 'hsl(222,74%,67%)',
+      success: 'hsl(96,44%,61%)',
+      notice: 'hsl(40,62%,66%)',
+      warning: 'hsl(20,79%,63%)',
+      danger: 'hsl(359,68%,64%)',
+    },
+  },
+};
+
+export const catppuccinMacchiato: Theme = {
+  id: 'catppuccin-macchiato',
+  label: 'Catppuccin Macchiato',
+  dark: true,
+  base: {
+    surface: 'hsl(233,23%,15%)',
+    text: 'hsl(227,68%,88%)',
+    textSubtle: 'hsl(227,27%,72%)',
+    textSubtlest: 'hsl(228,15%,57%)',
+    primary: 'hsl(267,83%,80%)',
+    secondary: 'hsl(228,39%,80%)',
+    info: 'hsl(220,83%,75%)',
+    success: 'hsl(105,48%,72%)',
+    notice: 'hsl(40,70%,78%)',
+    warning: 'hsl(21,86%,73%)',
+    danger: 'hsl(351,74%,73%)',
+  },
+  components: {
+    dialog: {
+      surface: 'hsl(240,21%,12%)',
+    },
+    sidebar: {
+      surface: 'hsl(232,23%,18%)',
+      border: 'hsl(231,23%,22%)',
+    },
+    appHeader: {
+      surface: 'hsl(236,23%,12%)',
+      border: 'hsl(236,23%,21%)',
+    },
+    responsePane: {
+      surface: 'hsl(232,23%,18%)',
+      border: 'hsl(231,23%,22%)',
+    },
+    button: {
+      primary: 'hsl(267,82%,72%)',
+      secondary: 'hsl(228,39%,72%)',
+      info: 'hsl(220,83%,68%)',
+      success: 'hsl(105,48%,65%)',
+      notice: 'hsl(40,70%,70%)',
+      warning: 'hsl(21,86%,66%)',
+      danger: 'hsl(351,74%,66%)',
+    },
+  },
+};
+
+export const catppuccinMocha: Theme = {
+  id: 'catppuccin-mocha',
+  label: 'Catppuccin Mocha',
+  dark: true,
+  base: {
+    surface: 'hsl(240,21%,12%)',
+    text: 'hsl(226,64%,88%)',
+    textSubtle: 'hsl(228,24%,72%)',
+    textSubtlest: 'hsl(230,13%,55%)',
+    primary: 'hsl(267,83%,80%)',
+    secondary: 'hsl(227,35%,80%)',
+    info: 'hsl(217,92%,76%)',
+    success: 'hsl(115,54%,76%)',
+    notice: 'hsl(41,86%,83%)',
+    warning: 'hsl(23,92%,75%)',
+    danger: 'hsl(343,81%,75%)',
+  },
+  components: {
+    dialog: {
+      surface: 'hsl(240,21%,12%)',
+    },
+    sidebar: {
+      surface: 'hsl(240,21%,15%)',
+      border: 'hsl(240,21%,19%)',
+    },
+    appHeader: {
+      surface: 'hsl(240,23%,9%)',
+      border: 'hsl(240,22%,18%)',
+    },
+    responsePane: {
+      surface: 'hsl(240,21%,15%)',
+      border: 'hsl(240,21%,19%)',
+    },
+    button: {
+      primary: 'hsl(267,67%,65%)',
+      secondary: 'hsl(227,28%,64%)',
+      info: 'hsl(217,74%,61%)',
+      success: 'hsl(115,43%,61%)',
+      notice: 'hsl(41,69%,66%)',
+      warning: 'hsl(23,74%,60%)',
+      danger: 'hsl(343,65%,60%)',
+    },
+  },
+};
+
+export const catppuccinLatte: Theme = {
+  id: 'catppuccin-latte',
+  label: 'Catppuccin Latte',
+  dark: false,
+  base: {
+    surface: 'hsl(220,23%,95%)',
+    text: 'hsl(234,16%,35%)',
+    textSubtle: 'hsl(233,10%,47%)',
+    textSubtlest: 'hsl(231,10%,59%)',
+    primary: 'hsl(266,85%,58%)',
+    secondary: 'hsl(233,10%,47%)',
+    info: 'hsl(231,97%,72%)',
+    success: 'hsl(183,74%,35%)',
+    notice: 'hsl(35,77%,49%)',
+    warning: 'hsl(22,99%,52%)',
+    danger: 'hsl(355,76%,59%)',
+  },
+  components: {
+    sidebar: {
+      surface: 'hsl(220,22%,92%)',
+      border: 'hsl(220,22%,87%)',
+    },
+    appHeader: {
+      surface: 'hsl(220,21%,89%)',
+      border: 'hsl(220,22%,87%)',
+    },
+  },
+};