diff --git a/package-lock.json b/package-lock.json
index 4e0faf4d..a66a297a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -19348,6 +19348,11 @@
"xpath": "^0.0.34"
}
},
+ "plugins/themes-vscode": {
+ "name": "@yaak/themes-vscode",
+ "version": "0.1.0",
+ "extraneous": true
+ },
"plugins/themes-yaak": {
"name": "@yaak/themes-yaak",
"version": "0.1.0"
diff --git a/plugins/themes-yaak/src/index.ts b/plugins/themes-yaak/src/index.ts
index 5236b4a4..7a9f5388 100644
--- a/plugins/themes-yaak/src/index.ts
+++ b/plugins/themes-yaak/src/index.ts
@@ -1,791 +1,116 @@
import type { PluginDefinition } from '@yaakapp/api';
+// Yaak themes
+import { highContrast, highContrastDark } from './themes/high-contrast';
+import {
+ catppuccinFrappe,
+ catppuccinMacchiato,
+ catppuccinMocha,
+ catppuccinLatte,
+} from './themes/catppuccin';
+import { dracula } from './themes/dracula';
+import { githubDark, githubLight } from './themes/github';
+import { gruvbox } from './themes/gruvbox';
+import { hotdogStand } from './themes/hotdog-stand';
+import {
+ monokaiPro,
+ monokaiProClassic,
+ monokaiProMachine,
+ monokaiProOctagon,
+ monokaiProRistretto,
+ monokaiProSpectrum,
+} from './themes/monokai-pro';
+import { moonlight } from './themes/moonlight';
+import { nord } from './themes/nord';
+import { relaxing } from './themes/relaxing';
+import { rosePine, rosePineMoon, rosePineDawn } from './themes/rose-pine';
+import { triangle } from './themes/triangle';
+
+// VSCode themes
+import { oneDarkPro } from './themes/one-dark-pro';
+import { materialPalenight } from './themes/material-palenight';
+import { materialOcean } from './themes/material-ocean';
+import { materialDarker } from './themes/material-darker';
+import { nightOwl, lightOwl } from './themes/night-owl';
+import { tokyoNight, tokyoNightStorm, tokyoNightDay } from './themes/tokyo-night';
+import { solarizedDark, solarizedLight } from './themes/solarized';
+import { ayuDark, ayuMirage, ayuLight } from './themes/ayu';
+import { synthwave84 } from './themes/synthwave-84';
+import { shadesOfPurple, shadesOfPurpleSuperDark } from './themes/shades-of-purple';
+import { cobalt2 } from './themes/cobalt2';
+import { horizon } from './themes/horizon';
+import { pandaSyntax } from './themes/panda';
+import { andromeda } from './themes/andromeda';
+import { winterIsComing } from './themes/winter-is-coming';
+import { atomOneDark } from './themes/atom-one-dark';
+import { vitesseDark, vitesseLight } from './themes/vitesse';
+import { everforestDark, everforestLight } from './themes/everforest';
+import { githubDarkDimmed } from './themes/github-dimmed';
+import { slackAubergine } from './themes/slack';
+import { noctisAzureus } from './themes/noctis';
+import { blulocoDark, blulocoLight } from './themes/bluloco';
+import { fleetLight, fleetDarkPurple, fleetDark } from './themes/fleet';
+
export const plugin: PluginDefinition = {
themes: [
- {
- id: 'high-contrast',
- label: 'High Contrast Light',
- dark: false,
- base: {
- surface: 'white',
- surfaceHighlight: 'hsl(218,24%,93%)',
- text: 'black',
- textSubtle: 'hsl(217,24%,40%)',
- textSubtlest: 'hsl(217,24%,40%)',
- border: 'hsl(217,22%,50%)',
- borderSubtle: 'hsl(217,22%,60%)',
- primary: 'hsl(267,67%,47%)',
- secondary: 'hsl(218,18%,53%)',
- info: 'hsl(206,100%,36%)',
- success: 'hsl(155,100%,26%)',
- notice: 'hsl(45,100%,31%)',
- warning: 'hsl(30,99%,34%)',
- danger: 'hsl(334,100%,35%)',
- },
- },
- {
- id: 'high-contrast-dark',
- label: 'High Contrast Dark',
- dark: true,
- base: {
- surface: 'hsl(0,0%,0%)',
- surfaceHighlight: 'hsl(0,0%,20%)',
- text: 'hsl(0,0%,100%)',
- textSubtle: 'hsl(0,0%,90%)',
- textSubtlest: 'hsl(0,0%,80%)',
- selection: 'hsl(276,100%,30%)',
- surfaceActive: 'hsl(276,100%,30%)',
- border: 'hsl(0,0%,60%)',
- primary: 'hsl(266,100%,85%)',
- secondary: 'hsl(242,20%,72%)',
- info: 'hsl(208,100%,83%)',
- success: 'hsl(150,100%,63%)',
- notice: 'hsl(49,100%,77%)',
- warning: 'hsl(28,100%,73%)',
- danger: 'hsl(343,100%,79%)',
- },
- },
- {
- 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%)',
- },
- },
- },
- {
- 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%)',
- },
- },
- },
- {
- 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%)',
- },
- },
- },
- {
- 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%)',
- },
- },
- },
- {
- id: 'dracula',
- label: 'Dracula',
- dark: true,
- base: {
- surface: 'hsl(231,15%,18%)',
- surfaceHighlight: 'hsl(230,15%,24%)',
- text: 'hsl(60,30%,96%)',
- textSubtle: 'hsl(232,14%,65%)',
- textSubtlest: 'hsl(232,14%,50%)',
- primary: 'hsl(265,89%,78%)',
- secondary: 'hsl(225,27%,51%)',
- info: 'hsl(191,97%,77%)',
- success: 'hsl(135,94%,65%)',
- notice: 'hsl(65,92%,76%)',
- warning: 'hsl(31,100%,71%)',
- danger: 'hsl(0,100%,67%)',
- },
- components: {
- sidebar: {
- backdrop: 'hsl(230,15%,24%)',
- },
- appHeader: {
- backdrop: 'hsl(235,14%,15%)',
- },
- },
- },
- {
- id: 'github-dark',
- label: 'GitHub',
- dark: true,
- base: {
- surface: 'hsl(213,30%,7%)',
- surfaceHighlight: 'hsl(213,16%,13%)',
- text: 'hsl(212,27%,89%)',
- textSubtle: 'hsl(212,9%,57%)',
- textSubtlest: 'hsl(217,8%,45%)',
- border: 'hsl(215,21%,11%)',
- primary: 'hsl(262,78%,74%)',
- secondary: 'hsl(217,8%,50%)',
- info: 'hsl(215,84%,64%)',
- success: 'hsl(129,48%,52%)',
- notice: 'hsl(39,71%,58%)',
- warning: 'hsl(22,83%,60%)',
- danger: 'hsl(3,83%,65%)',
- },
- components: {
- button: {
- primary: 'hsl(262,79%,71%)',
- secondary: 'hsl(217,8%,45%)',
- info: 'hsl(215,84%,60%)',
- success: 'hsl(129,48%,47%)',
- notice: 'hsl(39,71%,53%)',
- warning: 'hsl(22,83%,56%)',
- danger: 'hsl(3,83%,61%)',
- },
- },
- },
- {
- id: 'github-light',
- label: 'GitHub',
- dark: false,
- base: {
- surface: 'hsl(0,0%,100%)',
- surfaceHighlight: 'hsl(210,29%,94%)',
- text: 'hsl(213,13%,14%)',
- textSubtle: 'hsl(212,9%,43%)',
- textSubtlest: 'hsl(203,8%,55%)',
- border: 'hsl(210,15%,92%)',
- borderSubtle: 'hsl(210,15%,92%)',
- primary: 'hsl(261,69%,59%)',
- secondary: 'hsl(212,8%,47%)',
- info: 'hsl(212,92%,48%)',
- success: 'hsl(137,66%,32%)',
- notice: 'hsl(40,100%,40%)',
- warning: 'hsl(24,100%,44%)',
- danger: 'hsl(356,71%,48%)',
- },
- },
- {
- id: 'gruvbox',
- label: 'Gruvbox',
- dark: true,
- base: {
- surface: 'hsl(0,0%,16%)',
- surfaceHighlight: 'hsl(20,3%,19%)',
- text: 'hsl(53,74%,91%)',
- textSubtle: 'hsl(39,24%,66%)',
- textSubtlest: 'hsl(30,12%,51%)',
- primary: 'hsl(344,47%,68%)',
- secondary: 'hsl(157,16%,58%)',
- info: 'hsl(104,35%,62%)',
- success: 'hsl(61,66%,44%)',
- notice: 'hsl(42,95%,58%)',
- warning: 'hsl(27,99%,55%)',
- danger: 'hsl(6,96%,59%)',
- },
- },
- {
- id: 'hotdog-stand',
- label: 'Hotdog Stand',
- dark: true,
- base: {
- surface: 'hsl(0,100%,50%)',
- surfaceHighlight: 'hsl(0,0%,0%)',
- text: 'hsl(0,0%,100%)',
- textSubtle: 'hsl(0,0%,100%)',
- textSubtlest: 'hsl(60,100%,50%)',
- border: 'hsl(0,0%,0%)',
- primary: 'hsl(60,100%,50%)',
- secondary: 'hsl(60,100%,50%)',
- info: 'hsl(60,100%,50%)',
- success: 'hsl(60,100%,50%)',
- notice: 'hsl(60,100%,50%)',
- warning: 'hsl(60,100%,50%)',
- danger: 'hsl(60,100%,50%)',
- },
- components: {
- appHeader: {
- surface: 'hsl(0,0%,0%)',
- text: 'hsl(0,0%,100%)',
- textSubtle: 'hsl(60,100%,50%)',
- textSubtlest: 'hsl(0,100%,50%)',
- },
- menu: {
- surface: 'hsl(0,0%,0%)',
- border: 'hsl(0,100%,50%)',
- surfaceHighlight: 'hsl(0,100%,50%)',
- text: 'hsl(0,0%,100%)',
- textSubtle: 'hsl(60,100%,50%)',
- textSubtlest: 'hsl(60,100%,50%)',
- },
- button: {
- surface: 'hsl(0,0%,0%)',
- text: 'hsl(0,0%,100%)',
- primary: 'hsl(0,0%,0%)',
- secondary: 'hsl(0,0%,100%)',
- info: 'hsl(0,0%,0%)',
- success: 'hsl(60,100%,50%)',
- notice: 'hsl(60,100%,50%)',
- warning: 'hsl(0,0%,0%)',
- danger: 'hsl(0,100%,50%)',
- },
- editor: {
- primary: 'hsl(0,0%,100%)',
- secondary: 'hsl(0,0%,100%)',
- info: 'hsl(0,0%,100%)',
- success: 'hsl(0,0%,100%)',
- notice: 'hsl(60,100%,50%)',
- warning: 'hsl(0,0%,100%)',
- danger: 'hsl(0,0%,100%)',
- },
- },
- },
- {
- id: 'monokai-pro',
- label: 'Monokai Pro',
- dark: true,
- base: {
- surface: 'hsl(285,5%,17%)',
- text: 'hsl(60,25%,98%)',
- textSubtle: 'hsl(0,1%,75%)',
- textSubtlest: 'hsl(300,0%,57%)',
- primary: 'hsl(250,77%,78%)',
- secondary: 'hsl(0,1%,75%)',
- info: 'hsl(186,71%,69%)',
- success: 'hsl(90,59%,66%)',
- notice: 'hsl(45,100%,70%)',
- warning: 'hsl(20,96%,70%)',
- danger: 'hsl(345,100%,69%)',
- },
- components: {
- appHeader: {
- surface: 'hsl(300,5%,13%)',
- text: 'hsl(0,1%,75%)',
- textSubtle: 'hsl(300,0%,57%)',
- textSubtlest: 'hsl(300,1%,44%)',
- },
- button: {
- primary: 'hsl(250,77%,70%)',
- secondary: 'hsl(0,1%,68%)',
- info: 'hsl(186,71%,62%)',
- success: 'hsl(90,59%,59%)',
- notice: 'hsl(45,100%,63%)',
- warning: 'hsl(20,96%,63%)',
- danger: 'hsl(345,100%,62%)',
- },
- },
- },
- {
- id: 'monokai-pro-classic',
- label: 'Monokai Pro Classic',
- dark: true,
- base: {
- surface: 'hsl(70,8%,15%)',
- text: 'hsl(69,100%,97%)',
- textSubtle: 'hsl(65,9%,73%)',
- textSubtlest: 'hsl(66,4%,55%)',
- primary: 'hsl(261,100%,75%)',
- secondary: 'hsl(202,8%,72%)',
- info: 'hsl(190,81%,67%)',
- success: 'hsl(80,76%,53%)',
- notice: 'hsl(54,70%,68%)',
- warning: 'hsl(32,98%,56%)',
- danger: 'hsl(338,95%,56%)',
- },
- components: {
- appHeader: {
- surface: 'hsl(72,9%,11%)',
- text: 'hsl(202,8%,72%)',
- textSubtle: 'hsl(213,4%,48%)',
- textSubtlest: 'hsl(223,6%,44%)',
- },
- button: {
- primary: 'hsl(261,100%,68%)',
- secondary: 'hsl(202,8%,65%)',
- info: 'hsl(190,81%,60%)',
- success: 'hsl(80,76%,48%)',
- notice: 'hsl(54,71%,61%)',
- warning: 'hsl(32,98%,50%)',
- danger: 'hsl(338,95%,50%)',
- },
- },
- },
- {
- id: 'monokai-pro-machine',
- label: 'Monokai Pro Machine',
- dark: true,
- base: {
- surface: 'hsl(200,16%,18%)',
- text: 'hsl(173,24%,93%)',
- textSubtle: 'hsl(185,6%,57%)',
- textSubtlest: 'hsl(189,6%,45%)',
- primary: 'hsl(258,86%,80%)',
- secondary: 'hsl(175,9%,75%)',
- info: 'hsl(194,81%,72%)',
- success: 'hsl(98,67%,69%)',
- notice: 'hsl(52,100%,72%)',
- warning: 'hsl(28,100%,72%)',
- danger: 'hsl(353,100%,71%)',
- },
- components: {
- appHeader: {
- surface: 'hsl(196,16%,14%)',
- text: 'hsl(202,8%,72%)',
- textSubtle: 'hsl(213,4%,48%)',
- textSubtlest: 'hsl(223,6%,44%)',
- },
- button: {
- primary: 'hsl(258,86%,72%)',
- secondary: 'hsl(175,9%,68%)',
- info: 'hsl(194,80%,65%)',
- success: 'hsl(98,67%,62%)',
- notice: 'hsl(52,100%,65%)',
- warning: 'hsl(28,100%,65%)',
- danger: 'hsl(353,100%,64%)',
- },
- },
- },
- {
- id: 'monokai-pro-octagon',
- label: 'Monokai Pro Octagon',
- dark: true,
- base: {
- surface: 'hsl(233,18%,19%)',
- text: 'hsl(173,24%,93%)',
- textSubtle: 'hsl(202,8%,72%)',
- textSubtlest: 'hsl(213,4%,48%)',
- primary: 'hsl(292,30%,70%)',
- secondary: 'hsl(202,8%,72%)',
- info: 'hsl(155,37%,72%)',
- success: 'hsl(75,60%,61%)',
- notice: 'hsl(44,100%,71%)',
- warning: 'hsl(23,100%,68%)',
- danger: 'hsl(352,100%,70%)',
- },
- components: {
- appHeader: {
- surface: 'hsl(235,18%,14%)',
- text: 'hsl(202,8%,72%)',
- textSubtle: 'hsl(213,4%,48%)',
- textSubtlest: 'hsl(223,6%,44%)',
- },
- button: {
- primary: 'hsl(292,26%,63%)',
- secondary: 'hsl(201,7%,65%)',
- info: 'hsl(155,33%,65%)',
- success: 'hsl(75,54%,55%)',
- notice: 'hsl(44,90%,64%)',
- warning: 'hsl(23,90%,61%)',
- danger: 'hsl(352,90%,63%)',
- },
- },
- },
- {
- id: 'monokai-pro-ristretto',
- label: 'Monokai Pro Ristretto',
- dark: true,
- base: {
- surface: 'hsl(0,9%,16%)',
- text: 'hsl(351,100%,97%)',
- textSubtle: 'hsl(355,9%,74%)',
- textSubtlest: 'hsl(354,4%,56%)',
- primary: 'hsl(239,63%,79%)',
- secondary: 'hsl(355,9%,74%)',
- info: 'hsl(170,53%,69%)',
- success: 'hsl(88,57%,66%)',
- notice: 'hsl(41,92%,70%)',
- warning: 'hsl(13,85%,70%)',
- danger: 'hsl(349,97%,70%)',
- },
- components: {
- appHeader: {
- surface: 'hsl(0,8%,12%)',
- text: 'hsl(355,9%,74%)',
- textSubtle: 'hsl(354,4%,56%)',
- textSubtlest: 'hsl(353,4%,43%)',
- },
- button: {
- primary: 'hsl(239,63%,71%)',
- secondary: 'hsl(355,9%,67%)',
- info: 'hsl(170,53%,62%)',
- success: 'hsl(88,57%,59%)',
- notice: 'hsl(41,92%,63%)',
- warning: 'hsl(13,86%,63%)',
- danger: 'hsl(349,97%,63%)',
- },
- },
- },
- {
- id: 'monokai-pro-spectrum',
- label: 'Monokai Pro Spectrum',
- dark: true,
- base: {
- surface: 'hsl(0,0%,13%)',
- text: 'hsl(266,100%,97%)',
- textSubtle: 'hsl(264,7%,73%)',
- textSubtlest: 'hsl(266,3%,55%)',
- primary: 'hsl(247,61%,72%)',
- secondary: 'hsl(264,7%,73%)',
- info: 'hsl(188,74%,63%)',
- success: 'hsl(133,54%,66%)',
- notice: 'hsl(51,96%,69%)',
- warning: 'hsl(23,98%,66%)',
- danger: 'hsl(343,96%,68%)',
- },
- components: {
- appHeader: {
- surface: 'hsl(0,0%,10%)',
- text: 'hsl(264,7%,73%)',
- textSubtle: 'hsl(266,3%,55%)',
- textSubtlest: 'hsl(264,2%,41%)',
- },
- button: {
- primary: 'hsl(247,61%,65%)',
- secondary: 'hsl(264,7%,66%)',
- info: 'hsl(188,74%,57%)',
- success: 'hsl(133,54%,59%)',
- notice: 'hsl(51,96%,62%)',
- warning: 'hsl(23,98%,59%)',
- danger: 'hsl(343,96%,61%)',
- },
- },
- },
- {
- id: 'moonlight',
- label: 'Moonlight',
- dark: true,
- base: {
- surface: 'hsl(234,23%,17%)',
- text: 'hsl(225,71%,90%)',
- textSubtle: 'hsl(230,28%,62%)',
- textSubtlest: 'hsl(232,26%,43%)',
- primary: 'hsl(262,100%,82%)',
- secondary: 'hsl(232,18%,65%)',
- info: 'hsl(217,100%,74%)',
- success: 'hsl(174,66%,54%)',
- notice: 'hsl(35,100%,73%)',
- warning: 'hsl(17,100%,71%)',
- danger: 'hsl(356,100%,73%)',
- },
- components: {
- appHeader: {
- surface: 'hsl(233,23%,15%)',
- },
- sidebar: {
- surface: 'hsl(233,23%,15%)',
- },
- },
- },
- {
- id: 'nord',
- label: 'Nord',
- dark: true,
- base: {
- surface: 'hsl(220,16%,22%)',
- surfaceHighlight: 'hsl(220,14%,28%)',
- text: 'hsl(220,28%,93%)',
- textSubtle: 'hsl(220,26%,90%)',
- textSubtlest: 'hsl(220,24%,86%)',
- primary: 'hsl(193,38%,68%)',
- secondary: 'hsl(210,34%,63%)',
- info: 'hsl(174,25%,69%)',
- success: 'hsl(89,26%,66%)',
- notice: 'hsl(40,66%,73%)',
- warning: 'hsl(17,48%,64%)',
- danger: 'hsl(353,43%,56%)',
- },
- components: {
- sidebar: {
- backdrop: 'hsl(220,16%,22%)',
- },
- appHeader: {
- backdrop: 'hsl(220,14%,28%)',
- },
- },
- },
- {
- id: 'relaxing',
- label: 'Relaxing',
- dark: true,
- base: {
- surface: 'hsl(267,33%,17%)',
- text: 'hsl(275,49%,92%)',
- primary: 'hsl(267,84%,81%)',
- 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%)',
- },
- },
- {
- id: 'rose-pine',
- label: 'Rosé Pine',
- dark: true,
- base: {
- surface: 'hsl(249,22%,12%)',
- text: 'hsl(245,50%,91%)',
- textSubtle: 'hsl(248,15%,61%)',
- textSubtlest: 'hsl(249,12%,47%)',
- primary: 'hsl(267,57%,78%)',
- secondary: 'hsl(249,12%,47%)',
- info: 'hsl(199,49%,60%)',
- success: 'hsl(180,43%,73%)',
- notice: 'hsl(35,88%,72%)',
- warning: 'hsl(1,74%,79%)',
- danger: 'hsl(343,76%,68%)',
- },
- components: {
- responsePane: {
- surface: 'hsl(247,23%,15%)',
- },
- sidebar: {
- surface: 'hsl(247,23%,15%)',
- },
- menu: {
- surface: 'hsl(248,21%,26%)',
- textSubtle: 'hsl(248,15%,66%)',
- textSubtlest: 'hsl(249,12%,52%)',
- border: 'hsl(248,21%,35%)',
- borderSubtle: 'hsl(248,21%,33%)',
- },
- },
- },
- {
- id: 'rose-pine-moon',
- label: 'Rosé Pine Moon',
- dark: true,
- base: {
- surface: 'hsl(246,24%,17%)',
- text: 'hsl(245,50%,91%)',
- textSubtle: 'hsl(248,15%,61%)',
- textSubtlest: 'hsl(249,12%,47%)',
- primary: 'hsl(267,57%,78%)',
- secondary: 'hsl(248,15%,61%)',
- info: 'hsl(197,48%,60%)',
- success: 'hsl(197,48%,60%)',
- notice: 'hsl(35,88%,72%)',
- warning: 'hsl(2,66%,75%)',
- danger: 'hsl(343,76%,68%)',
- },
- components: {
- responsePane: {
- surface: 'hsl(247,24%,20%)',
- },
- sidebar: {
- surface: 'hsl(247,24%,20%)',
- },
- menu: {
- surface: 'hsl(248,21%,26%)',
- textSubtle: 'hsl(248,15%,61%)',
- textSubtlest: 'hsl(249,12%,55%)',
- border: 'hsl(248,21%,35%)',
- borderSubtle: 'hsl(248,21%,31%)',
- },
- },
- },
- {
- id: 'rose-pine-dawn',
- label: 'Rosé Pine Dawn',
- dark: false,
- base: {
- surface: 'hsl(32,57%,95%)',
- border: 'hsl(10,9%,86%)',
- surfaceHighlight: 'hsl(25,35%,93%)',
- text: 'hsl(248,19%,40%)',
- textSubtle: 'hsl(248,12%,52%)',
- textSubtlest: 'hsl(257,9%,61%)',
- primary: 'hsl(271,27%,56%)',
- secondary: 'hsl(249,12%,47%)',
- info: 'hsl(197,52%,36%)',
- success: 'hsl(188,31%,45%)',
- notice: 'hsl(34,64%,49%)',
- warning: 'hsl(2,47%,64%)',
- danger: 'hsl(343,35%,55%)',
- },
- components: {
- responsePane: {
- border: 'hsl(20,12%,90%)',
- },
- sidebar: {
- border: 'hsl(20,12%,90%)',
- },
- appHeader: {
- border: 'hsl(20,12%,90%)',
- },
- input: {
- border: 'hsl(10,9%,86%)',
- },
- dialog: {
- border: 'hsl(20,12%,90%)',
- },
- menu: {
- surface: 'hsl(28,40%,92%)',
- border: 'hsl(10,9%,86%)',
- },
- },
- },
- {
- id: 'triangle',
- dark: true,
- label: 'Triangle',
- base: {
- surface: 'rgb(0,0,0)',
- surfaceHighlight: 'rgb(21,21,21)',
- surfaceActive: 'rgb(31,31,31)',
- text: 'rgb(237,237,237)',
- textSubtle: 'rgb(161,161,161)',
- textSubtlest: 'rgb(115,115,115)',
- border: 'rgb(31,31,31)',
- primary: 'rgb(196,114,251)',
- secondary: 'rgb(161,161,161)',
- info: 'rgb(71,168,255)',
- success: 'rgb(0,202,81)',
- notice: 'rgb(255,175,0)',
- warning: '#FF4C8D',
- danger: '#fd495a',
- },
- components: {
- editor: {
- danger: '#FF4C8D',
- warning: '#fd495a',
- },
- dialog: {
- surface: 'rgb(10,10,10)',
- border: 'rgb(31,31,31)',
- },
- sidebar: {
- border: 'rgb(31,31,31)',
- },
- responsePane: {
- surface: 'rgb(10,10,10)',
- border: 'rgb(31,31,31)',
- },
- appHeader: {
- surface: 'rgb(10,10,10)',
- border: 'rgb(31,31,31)',
- },
- },
- },
+ andromeda,
+ atomOneDark,
+ ayuDark,
+ ayuLight,
+ ayuMirage,
+ blulocoDark,
+ blulocoLight,
+ catppuccinFrappe,
+ catppuccinLatte,
+ catppuccinMacchiato,
+ catppuccinMocha,
+ cobalt2,
+ dracula,
+ everforestDark,
+ everforestLight,
+ fleetDark,
+ fleetDarkPurple,
+ fleetLight,
+ githubDark,
+ githubDarkDimmed,
+ githubLight,
+ gruvbox,
+ highContrast,
+ highContrastDark,
+ horizon,
+ hotdogStand,
+ lightOwl,
+ materialDarker,
+ materialOcean,
+ materialPalenight,
+ monokaiPro,
+ monokaiProClassic,
+ monokaiProMachine,
+ monokaiProOctagon,
+ monokaiProRistretto,
+ monokaiProSpectrum,
+ moonlight,
+ nightOwl,
+ noctisAzureus,
+ nord,
+ oneDarkPro,
+ pandaSyntax,
+ relaxing,
+ rosePine,
+ rosePineDawn,
+ rosePineMoon,
+ shadesOfPurple,
+ shadesOfPurpleSuperDark,
+ slackAubergine,
+ solarizedDark,
+ solarizedLight,
+ synthwave84,
+ tokyoNight,
+ tokyoNightDay,
+ tokyoNightStorm,
+ triangle,
+ vitesseDark,
+ vitesseLight,
+ winterIsComing,
],
};
diff --git a/plugins/themes-yaak/src/themes/andromeda.ts b/plugins/themes-yaak/src/themes/andromeda.ts
new file mode 100644
index 00000000..5e0c4041
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/andromeda.ts
@@ -0,0 +1,47 @@
+import type { Theme } from '@yaakapp/api';
+
+export const andromeda: Theme = {
+ id: 'andromeda',
+ label: 'Andromeda',
+ dark: true,
+ base: {
+ surface: 'hsl(251, 25%, 15%)',
+ surfaceHighlight: 'hsl(251, 22%, 20%)',
+ text: 'hsl(220, 10%, 85%)',
+ textSubtle: 'hsl(220, 8%, 60%)',
+ textSubtlest: 'hsl(220, 6%, 45%)',
+ primary: 'hsl(293, 75%, 68%)',
+ secondary: 'hsl(220, 8%, 60%)',
+ info: 'hsl(180, 60%, 60%)',
+ success: 'hsl(85, 60%, 55%)',
+ notice: 'hsl(38, 100%, 65%)',
+ warning: 'hsl(25, 95%, 60%)',
+ danger: 'hsl(358, 80%, 60%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(251, 25%, 12%)',
+ },
+ sidebar: {
+ surface: 'hsl(251, 23%, 13%)',
+ border: 'hsl(251, 20%, 18%)',
+ },
+ appHeader: {
+ surface: 'hsl(251, 25%, 11%)',
+ border: 'hsl(251, 20%, 16%)',
+ },
+ responsePane: {
+ surface: 'hsl(251, 23%, 13%)',
+ border: 'hsl(251, 20%, 18%)',
+ },
+ button: {
+ primary: 'hsl(293, 75%, 61%)',
+ secondary: 'hsl(220, 8%, 53%)',
+ info: 'hsl(180, 60%, 53%)',
+ success: 'hsl(85, 60%, 48%)',
+ notice: 'hsl(38, 100%, 58%)',
+ warning: 'hsl(25, 95%, 53%)',
+ danger: 'hsl(358, 80%, 53%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/atom-one-dark.ts b/plugins/themes-yaak/src/themes/atom-one-dark.ts
new file mode 100644
index 00000000..226226b9
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/atom-one-dark.ts
@@ -0,0 +1,47 @@
+import type { Theme } from '@yaakapp/api';
+
+export const atomOneDark: Theme = {
+ id: 'atom-one-dark',
+ label: 'Atom One Dark',
+ dark: true,
+ base: {
+ surface: 'hsl(220, 13%, 18%)',
+ surfaceHighlight: 'hsl(219, 13%, 22%)',
+ text: 'hsl(219, 14%, 71%)',
+ textSubtle: 'hsl(220, 9%, 55%)',
+ textSubtlest: 'hsl(220, 8%, 45%)',
+ primary: 'hsl(286, 60%, 67%)',
+ secondary: 'hsl(220, 9%, 55%)',
+ info: 'hsl(207, 82%, 66%)',
+ success: 'hsl(95, 38%, 62%)',
+ notice: 'hsl(39, 67%, 69%)',
+ warning: 'hsl(29, 54%, 61%)',
+ danger: 'hsl(355, 65%, 65%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(220, 13%, 14%)',
+ },
+ sidebar: {
+ surface: 'hsl(220, 13%, 16%)',
+ border: 'hsl(220, 13%, 20%)',
+ },
+ appHeader: {
+ surface: 'hsl(220, 13%, 12%)',
+ border: 'hsl(220, 13%, 18%)',
+ },
+ responsePane: {
+ surface: 'hsl(220, 13%, 16%)',
+ border: 'hsl(220, 13%, 20%)',
+ },
+ button: {
+ primary: 'hsl(286, 60%, 60%)',
+ secondary: 'hsl(220, 9%, 48%)',
+ info: 'hsl(207, 82%, 59%)',
+ success: 'hsl(95, 38%, 55%)',
+ notice: 'hsl(39, 67%, 62%)',
+ warning: 'hsl(29, 54%, 54%)',
+ danger: 'hsl(355, 65%, 58%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/ayu.ts b/plugins/themes-yaak/src/themes/ayu.ts
new file mode 100644
index 00000000..4ab980d6
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/ayu.ts
@@ -0,0 +1,122 @@
+import type { Theme } from '@yaakapp/api';
+
+export const ayuDark: Theme = {
+ id: 'ayu-dark',
+ label: 'Ayu Dark',
+ dark: true,
+ base: {
+ surface: 'hsl(220, 25%, 10%)',
+ surfaceHighlight: 'hsl(220, 20%, 15%)',
+ text: 'hsl(210, 22%, 78%)',
+ textSubtle: 'hsl(40, 13%, 50%)',
+ textSubtlest: 'hsl(220, 10%, 40%)',
+ primary: 'hsl(38, 100%, 56%)',
+ secondary: 'hsl(210, 15%, 55%)',
+ info: 'hsl(200, 80%, 60%)',
+ success: 'hsl(100, 75%, 60%)',
+ notice: 'hsl(38, 100%, 56%)',
+ warning: 'hsl(25, 100%, 60%)',
+ danger: 'hsl(345, 80%, 60%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(220, 25%, 8%)',
+ },
+ sidebar: {
+ surface: 'hsl(220, 22%, 12%)',
+ border: 'hsl(220, 20%, 16%)',
+ },
+ appHeader: {
+ surface: 'hsl(220, 25%, 7%)',
+ border: 'hsl(220, 20%, 13%)',
+ },
+ responsePane: {
+ surface: 'hsl(220, 22%, 12%)',
+ border: 'hsl(220, 20%, 16%)',
+ },
+ button: {
+ primary: 'hsl(38, 100%, 50%)',
+ secondary: 'hsl(210, 15%, 48%)',
+ info: 'hsl(200, 80%, 53%)',
+ success: 'hsl(100, 75%, 53%)',
+ notice: 'hsl(38, 100%, 50%)',
+ warning: 'hsl(25, 100%, 53%)',
+ danger: 'hsl(345, 80%, 53%)',
+ },
+ },
+};
+
+export const ayuMirage: Theme = {
+ id: 'ayu-mirage',
+ label: 'Ayu Mirage',
+ dark: true,
+ base: {
+ surface: 'hsl(226, 23%, 17%)',
+ surfaceHighlight: 'hsl(226, 20%, 22%)',
+ text: 'hsl(212, 15%, 81%)',
+ textSubtle: 'hsl(212, 12%, 55%)',
+ textSubtlest: 'hsl(212, 10%, 45%)',
+ primary: 'hsl(38, 100%, 67%)',
+ secondary: 'hsl(212, 12%, 55%)',
+ info: 'hsl(200, 80%, 70%)',
+ success: 'hsl(100, 50%, 68%)',
+ notice: 'hsl(38, 100%, 67%)',
+ warning: 'hsl(25, 100%, 70%)',
+ danger: 'hsl(345, 80%, 70%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(226, 23%, 14%)',
+ },
+ sidebar: {
+ surface: 'hsl(226, 22%, 15%)',
+ border: 'hsl(226, 20%, 20%)',
+ },
+ appHeader: {
+ surface: 'hsl(226, 23%, 12%)',
+ border: 'hsl(226, 20%, 17%)',
+ },
+ responsePane: {
+ surface: 'hsl(226, 22%, 15%)',
+ border: 'hsl(226, 20%, 20%)',
+ },
+ button: {
+ primary: 'hsl(38, 100%, 60%)',
+ info: 'hsl(200, 80%, 63%)',
+ success: 'hsl(100, 50%, 61%)',
+ notice: 'hsl(38, 100%, 60%)',
+ warning: 'hsl(25, 100%, 63%)',
+ danger: 'hsl(345, 80%, 63%)',
+ },
+ },
+};
+
+export const ayuLight: Theme = {
+ id: 'ayu-light',
+ label: 'Ayu Light',
+ dark: false,
+ base: {
+ surface: 'hsl(40, 22%, 97%)',
+ surfaceHighlight: 'hsl(40, 20%, 93%)',
+ text: 'hsl(214, 10%, 35%)',
+ textSubtle: 'hsl(214, 8%, 50%)',
+ textSubtlest: 'hsl(214, 6%, 60%)',
+ primary: 'hsl(35, 100%, 45%)',
+ secondary: 'hsl(214, 8%, 50%)',
+ info: 'hsl(200, 75%, 45%)',
+ success: 'hsl(100, 60%, 40%)',
+ notice: 'hsl(35, 100%, 45%)',
+ warning: 'hsl(22, 100%, 50%)',
+ danger: 'hsl(345, 70%, 55%)',
+ },
+ components: {
+ sidebar: {
+ surface: 'hsl(40, 20%, 95%)',
+ border: 'hsl(40, 15%, 90%)',
+ },
+ appHeader: {
+ surface: 'hsl(40, 20%, 93%)',
+ border: 'hsl(40, 15%, 88%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/bluloco.ts b/plugins/themes-yaak/src/themes/bluloco.ts
new file mode 100644
index 00000000..846eff0a
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/bluloco.ts
@@ -0,0 +1,77 @@
+import type { Theme } from '@yaakapp/api';
+
+export const blulocoDark: Theme = {
+ id: 'bluloco-dark',
+ label: 'Bluloco Dark',
+ dark: true,
+ base: {
+ surface: 'hsl(230, 20%, 14%)',
+ surfaceHighlight: 'hsl(230, 17%, 19%)',
+ text: 'hsl(220, 15%, 80%)',
+ textSubtle: 'hsl(220, 10%, 55%)',
+ textSubtlest: 'hsl(220, 8%, 42%)',
+ primary: 'hsl(218, 85%, 65%)',
+ secondary: 'hsl(220, 10%, 55%)',
+ info: 'hsl(218, 85%, 65%)',
+ success: 'hsl(95, 55%, 55%)',
+ notice: 'hsl(37, 90%, 60%)',
+ warning: 'hsl(22, 85%, 55%)',
+ danger: 'hsl(355, 75%, 60%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(230, 20%, 11%)',
+ },
+ sidebar: {
+ surface: 'hsl(230, 18%, 12%)',
+ border: 'hsl(230, 16%, 17%)',
+ },
+ appHeader: {
+ surface: 'hsl(230, 20%, 10%)',
+ border: 'hsl(230, 16%, 15%)',
+ },
+ responsePane: {
+ surface: 'hsl(230, 18%, 12%)',
+ border: 'hsl(230, 16%, 17%)',
+ },
+ button: {
+ primary: 'hsl(218, 85%, 58%)',
+ secondary: 'hsl(220, 10%, 48%)',
+ info: 'hsl(218, 85%, 58%)',
+ success: 'hsl(95, 55%, 48%)',
+ notice: 'hsl(37, 90%, 53%)',
+ warning: 'hsl(22, 85%, 48%)',
+ danger: 'hsl(355, 75%, 53%)',
+ },
+ },
+};
+
+export const blulocoLight: Theme = {
+ id: 'bluloco-light',
+ label: 'Bluloco Light',
+ dark: false,
+ base: {
+ surface: 'hsl(0, 0%, 98%)',
+ surfaceHighlight: 'hsl(220, 15%, 94%)',
+ text: 'hsl(228, 18%, 30%)',
+ textSubtle: 'hsl(228, 10%, 48%)',
+ textSubtlest: 'hsl(228, 8%, 58%)',
+ primary: 'hsl(218, 80%, 48%)',
+ secondary: 'hsl(228, 10%, 48%)',
+ info: 'hsl(218, 80%, 48%)',
+ success: 'hsl(138, 55%, 40%)',
+ notice: 'hsl(35, 85%, 45%)',
+ warning: 'hsl(22, 80%, 48%)',
+ danger: 'hsl(355, 70%, 48%)',
+ },
+ components: {
+ sidebar: {
+ surface: 'hsl(220, 15%, 96%)',
+ border: 'hsl(220, 12%, 90%)',
+ },
+ appHeader: {
+ surface: 'hsl(220, 15%, 94%)',
+ border: 'hsl(220, 12%, 88%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/catppuccin.ts b/plugins/themes-yaak/src/themes/catppuccin.ts
new file mode 100644
index 00000000..062c400a
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/catppuccin.ts
@@ -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%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/cobalt2.ts b/plugins/themes-yaak/src/themes/cobalt2.ts
new file mode 100644
index 00000000..80d11f4b
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/cobalt2.ts
@@ -0,0 +1,47 @@
+import type { Theme } from '@yaakapp/api';
+
+export const cobalt2: Theme = {
+ id: 'cobalt2',
+ label: 'Cobalt2',
+ dark: true,
+ base: {
+ surface: '#193549',
+ surfaceHighlight: '#1f4662',
+ text: '#d2e1f1',
+ textSubtle: '#709ac8',
+ textSubtlest: '#55749e',
+ primary: '#ffc600',
+ secondary: '#819fc3',
+ info: '#0088FF',
+ success: '#3AD900',
+ notice: '#FFEE80',
+ warning: '#FF9D00',
+ danger: '#FF628C',
+ },
+ components: {
+ sidebar: {
+ surface: '#13283a',
+ border: '#102332',
+ },
+ input: {
+ border: '#1f4561',
+ },
+ appHeader: {
+ surface: '#13283a',
+ border: '#112636',
+ },
+ responsePane: {
+ surface: '#13283a',
+ border: '#112636',
+ },
+ button: {
+ primary: '#ffc600',
+ secondary: '#709ac8',
+ info: '#0088FF',
+ success: '#3AD900',
+ notice: '#ecdc6a',
+ warning: '#FF9D00',
+ danger: '#FF628C',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/dracula.ts b/plugins/themes-yaak/src/themes/dracula.ts
new file mode 100644
index 00000000..c5575b44
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/dracula.ts
@@ -0,0 +1,29 @@
+import type { Theme } from '@yaakapp/api';
+
+export const dracula: Theme = {
+ id: 'dracula',
+ label: 'Dracula',
+ dark: true,
+ base: {
+ surface: 'hsl(231,15%,18%)',
+ surfaceHighlight: 'hsl(230,15%,24%)',
+ text: 'hsl(60,30%,96%)',
+ textSubtle: 'hsl(232,14%,65%)',
+ textSubtlest: 'hsl(232,14%,50%)',
+ primary: 'hsl(265,89%,78%)',
+ secondary: 'hsl(225,27%,51%)',
+ info: 'hsl(191,97%,77%)',
+ success: 'hsl(135,94%,65%)',
+ notice: 'hsl(65,92%,76%)',
+ warning: 'hsl(31,100%,71%)',
+ danger: 'hsl(0,100%,67%)',
+ },
+ components: {
+ sidebar: {
+ backdrop: 'hsl(230,15%,24%)',
+ },
+ appHeader: {
+ backdrop: 'hsl(235,14%,15%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/everforest.ts b/plugins/themes-yaak/src/themes/everforest.ts
new file mode 100644
index 00000000..41b6f574
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/everforest.ts
@@ -0,0 +1,77 @@
+import type { Theme } from '@yaakapp/api';
+
+export const everforestDark: Theme = {
+ id: 'everforest-dark',
+ label: 'Everforest Dark',
+ dark: true,
+ base: {
+ surface: 'hsl(150, 8%, 18%)',
+ surfaceHighlight: 'hsl(150, 7%, 22%)',
+ text: 'hsl(45, 30%, 78%)',
+ textSubtle: 'hsl(145, 8%, 55%)',
+ textSubtlest: 'hsl(145, 6%, 42%)',
+ primary: 'hsl(142, 35%, 60%)',
+ secondary: 'hsl(145, 8%, 55%)',
+ info: 'hsl(200, 35%, 65%)',
+ success: 'hsl(142, 35%, 60%)',
+ notice: 'hsl(46, 55%, 68%)',
+ warning: 'hsl(24, 55%, 65%)',
+ danger: 'hsl(358, 50%, 68%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(150, 8%, 15%)',
+ },
+ sidebar: {
+ surface: 'hsl(150, 7%, 16%)',
+ border: 'hsl(150, 6%, 20%)',
+ },
+ appHeader: {
+ surface: 'hsl(150, 8%, 14%)',
+ border: 'hsl(150, 6%, 18%)',
+ },
+ responsePane: {
+ surface: 'hsl(150, 7%, 16%)',
+ border: 'hsl(150, 6%, 20%)',
+ },
+ button: {
+ primary: 'hsl(142, 35%, 53%)',
+ secondary: 'hsl(145, 8%, 48%)',
+ info: 'hsl(200, 35%, 58%)',
+ success: 'hsl(142, 35%, 53%)',
+ notice: 'hsl(46, 55%, 61%)',
+ warning: 'hsl(24, 55%, 58%)',
+ danger: 'hsl(358, 50%, 61%)',
+ },
+ },
+};
+
+export const everforestLight: Theme = {
+ id: 'everforest-light',
+ label: 'Everforest Light',
+ dark: false,
+ base: {
+ surface: 'hsl(40, 32%, 93%)',
+ surfaceHighlight: 'hsl(40, 28%, 89%)',
+ text: 'hsl(135, 8%, 35%)',
+ textSubtle: 'hsl(135, 6%, 45%)',
+ textSubtlest: 'hsl(135, 4%, 55%)',
+ primary: 'hsl(128, 30%, 45%)',
+ secondary: 'hsl(135, 6%, 45%)',
+ info: 'hsl(200, 35%, 45%)',
+ success: 'hsl(128, 30%, 45%)',
+ notice: 'hsl(45, 70%, 40%)',
+ warning: 'hsl(22, 60%, 48%)',
+ danger: 'hsl(355, 55%, 50%)',
+ },
+ components: {
+ sidebar: {
+ surface: 'hsl(40, 30%, 91%)',
+ border: 'hsl(40, 25%, 86%)',
+ },
+ appHeader: {
+ surface: 'hsl(40, 30%, 89%)',
+ border: 'hsl(40, 25%, 84%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/fleet.ts b/plugins/themes-yaak/src/themes/fleet.ts
new file mode 100644
index 00000000..422b958e
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/fleet.ts
@@ -0,0 +1,173 @@
+import type { Theme } from '@yaakapp/api';
+
+export const fleetLight: Theme = {
+ id: 'fleet-light',
+ label: 'Fleet Light',
+ dark: false,
+ base: {
+ surface: '#FFFFFF',
+ surfaceHighlight: '#F8F8F9',
+ surfaceActive: '#EEEFF0',
+ border: '#18191B33',
+ text: '#090909',
+ textSubtle: '#6E747B',
+ textSubtlest: '#898E94',
+ primary: '#1D61BA',
+ secondary: '#6E747B',
+ info: '#4B8DEC',
+ success: '#169068',
+ notice: '#B07203',
+ warning: '#B07203',
+ danger: '#E1465E',
+ },
+ components: {
+ sidebar: {
+ surface: '#EEEFF0',
+ border: '#18191B33',
+ },
+ appHeader: {
+ surface: '#EEEFF0',
+ border: '#18191B33',
+ },
+ responsePane: {
+ surface: '#FFFFFF',
+ border: '#18191B33',
+ },
+ dialog: {
+ surface: '#FFFFFF',
+ border: '#18191B33',
+ },
+ button: {
+ surface: '#F8F8F9',
+ text: '#090909',
+ primary: '#2A7DEB',
+ secondary: '#6E747B',
+ info: '#4B8DEC',
+ success: '#169068',
+ notice: '#B07203',
+ warning: '#B07203',
+ danger: '#E1465E',
+ },
+ editor: {
+ primary: '#5511BF',
+ secondary: '#A31D8D',
+ info: '#14646E',
+ success: '#086E14',
+ notice: '#616605',
+ warning: '#747576',
+ danger: '#1749BD',
+ },
+ },
+};
+
+export const fleetDarkPurple: Theme = {
+ id: 'fleet-dark-purple',
+ label: 'Fleet Dark Purple',
+ dark: true,
+ base: {
+ surface: '#1C1827',
+ surfaceHighlight: '#262136',
+ surfaceActive: '#3E3852',
+ border: '#3E3852',
+ text: '#E0E1E4',
+ textSubtle: '#E0E1E480',
+ textSubtlest: '#E0E1E44D',
+ primary: '#B174D9',
+ secondary: '#E0E1E480',
+ info: '#4B8DEC',
+ success: '#169068',
+ notice: '#B07203',
+ warning: '#B07203',
+ danger: '#E1465E',
+ },
+ components: {
+ appHeader: {
+ surface: '#13101B',
+ border: '#3E3852',
+ },
+ responsePane: {
+ surface: '#1C1827',
+ border: '#3E3852',
+ },
+ dialog: {
+ surface: '#262136',
+ border: '#3E3852',
+ },
+ button: {
+ surface: '#262136',
+ text: '#E0E1E4',
+ primary: '#A660D4',
+ secondary: '#E0E1E480',
+ info: '#4B8DEC',
+ success: '#169068',
+ notice: '#B07203',
+ warning: '#B07203',
+ danger: '#E1465E',
+ },
+ editor: {
+ primary: '#C7A65D',
+ secondary: '#93A6F5',
+ info: '#E09B70',
+ success: '#62A362',
+ notice: '#85A658',
+ warning: '#7e7d86',
+ danger: '#4DACF0',
+ },
+ },
+};
+
+export const fleetDark: Theme = {
+ id: 'fleet-dark',
+ label: 'Fleet Dark',
+ dark: true,
+ base: {
+ surface: '#18191B',
+ surfaceHighlight: '#252629',
+ surfaceActive: '#3E4147',
+ border: '#3E4147',
+ text: '#E0E1E4',
+ textSubtle: '#898E94',
+ textSubtlest: '#646B71',
+ primary: '#4B8DEC',
+ secondary: '#898E94',
+ info: '#4B8DEC',
+ success: '#169068',
+ notice: '#B07203',
+ warning: '#B07203',
+ danger: '#E1465E',
+ },
+ components: {
+ appHeader: {
+ surface: '#090909',
+ border: '#3E4147',
+ },
+ responsePane: {
+ surface: '#18191B',
+ border: '#3E4147',
+ },
+ dialog: {
+ surface: '#252629',
+ border: '#3E4147',
+ },
+ button: {
+ surface: '#252629',
+ text: '#E0E1E4',
+ primary: '#2A7DEB',
+ secondary: '#898E94',
+ info: '#4B8DEC',
+ success: '#169068',
+ notice: '#B07203',
+ warning: '#B07203',
+ danger: '#E1465E',
+ },
+ editor: {
+ primary: '#EBC88D',
+ secondary: '#AF9CFF',
+ info: '#82D2CE',
+ success: '#A8C5A0',
+ notice: '#C7A65D',
+ warning: '#909194',
+ danger: '#87C3FF',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/github-dimmed.ts b/plugins/themes-yaak/src/themes/github-dimmed.ts
new file mode 100644
index 00000000..92a12a5a
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/github-dimmed.ts
@@ -0,0 +1,46 @@
+import type { Theme } from '@yaakapp/api';
+
+export const githubDarkDimmed: Theme = {
+ id: 'github-dark-dimmed',
+ label: 'GitHub Dark Dimmed',
+ dark: true,
+ base: {
+ surface: 'hsl(215, 15%, 16%)',
+ surfaceHighlight: 'hsl(215, 13%, 20%)',
+ text: 'hsl(212, 15%, 78%)',
+ textSubtle: 'hsl(212, 10%, 55%)',
+ textSubtlest: 'hsl(212, 8%, 42%)',
+ primary: 'hsl(212, 80%, 65%)',
+ secondary: 'hsl(212, 10%, 55%)',
+ info: 'hsl(212, 80%, 65%)',
+ success: 'hsl(140, 50%, 50%)',
+ notice: 'hsl(42, 75%, 55%)',
+ warning: 'hsl(27, 80%, 55%)',
+ danger: 'hsl(355, 70%, 55%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(215, 15%, 13%)',
+ },
+ sidebar: {
+ surface: 'hsl(215, 14%, 14%)',
+ border: 'hsl(215, 12%, 19%)',
+ },
+ appHeader: {
+ surface: 'hsl(215, 15%, 12%)',
+ border: 'hsl(215, 12%, 17%)',
+ },
+ responsePane: {
+ surface: 'hsl(215, 14%, 14%)',
+ border: 'hsl(215, 12%, 19%)',
+ },
+ button: {
+ primary: 'hsl(212, 80%, 58%)',
+ info: 'hsl(212, 80%, 58%)',
+ success: 'hsl(140, 50%, 45%)',
+ notice: 'hsl(42, 75%, 48%)',
+ warning: 'hsl(27, 80%, 48%)',
+ danger: 'hsl(355, 70%, 48%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/github.ts b/plugins/themes-yaak/src/themes/github.ts
new file mode 100644
index 00000000..93cdf811
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/github.ts
@@ -0,0 +1,55 @@
+import type { Theme } from '@yaakapp/api';
+
+export const githubDark: Theme = {
+ id: 'github-dark',
+ label: 'GitHub',
+ dark: true,
+ base: {
+ surface: 'hsl(213,30%,7%)',
+ surfaceHighlight: 'hsl(213,16%,13%)',
+ text: 'hsl(212,27%,89%)',
+ textSubtle: 'hsl(212,9%,57%)',
+ textSubtlest: 'hsl(217,8%,45%)',
+ border: 'hsl(215,21%,11%)',
+ primary: 'hsl(262,78%,74%)',
+ secondary: 'hsl(217,8%,50%)',
+ info: 'hsl(215,84%,64%)',
+ success: 'hsl(129,48%,52%)',
+ notice: 'hsl(39,71%,58%)',
+ warning: 'hsl(22,83%,60%)',
+ danger: 'hsl(3,83%,65%)',
+ },
+ components: {
+ button: {
+ primary: 'hsl(262,79%,71%)',
+ secondary: 'hsl(217,8%,45%)',
+ info: 'hsl(215,84%,60%)',
+ success: 'hsl(129,48%,47%)',
+ notice: 'hsl(39,71%,53%)',
+ warning: 'hsl(22,83%,56%)',
+ danger: 'hsl(3,83%,61%)',
+ },
+ },
+};
+
+export const githubLight: Theme = {
+ id: 'github-light',
+ label: 'GitHub',
+ dark: false,
+ base: {
+ surface: 'hsl(0,0%,100%)',
+ surfaceHighlight: 'hsl(210,29%,94%)',
+ text: 'hsl(213,13%,14%)',
+ textSubtle: 'hsl(212,9%,43%)',
+ textSubtlest: 'hsl(203,8%,55%)',
+ border: 'hsl(210,15%,92%)',
+ borderSubtle: 'hsl(210,15%,92%)',
+ primary: 'hsl(261,69%,59%)',
+ secondary: 'hsl(212,8%,47%)',
+ info: 'hsl(212,92%,48%)',
+ success: 'hsl(137,66%,32%)',
+ notice: 'hsl(40,100%,40%)',
+ warning: 'hsl(24,100%,44%)',
+ danger: 'hsl(356,71%,48%)',
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/gruvbox.ts b/plugins/themes-yaak/src/themes/gruvbox.ts
new file mode 100644
index 00000000..b5074a24
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/gruvbox.ts
@@ -0,0 +1,21 @@
+import type { Theme } from '@yaakapp/api';
+
+export const gruvbox: Theme = {
+ id: 'gruvbox',
+ label: 'Gruvbox',
+ dark: true,
+ base: {
+ surface: 'hsl(0,0%,16%)',
+ surfaceHighlight: 'hsl(20,3%,19%)',
+ text: 'hsl(53,74%,91%)',
+ textSubtle: 'hsl(39,24%,66%)',
+ textSubtlest: 'hsl(30,12%,51%)',
+ primary: 'hsl(344,47%,68%)',
+ secondary: 'hsl(157,16%,58%)',
+ info: 'hsl(104,35%,62%)',
+ success: 'hsl(61,66%,44%)',
+ notice: 'hsl(42,95%,58%)',
+ warning: 'hsl(27,99%,55%)',
+ danger: 'hsl(6,96%,59%)',
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/high-contrast.ts b/plugins/themes-yaak/src/themes/high-contrast.ts
new file mode 100644
index 00000000..1b97d81f
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/high-contrast.ts
@@ -0,0 +1,46 @@
+import type { Theme } from '@yaakapp/api';
+
+export const highContrast: Theme = {
+ id: 'high-contrast',
+ label: 'High Contrast Light',
+ dark: false,
+ base: {
+ surface: 'white',
+ surfaceHighlight: 'hsl(218,24%,93%)',
+ text: 'black',
+ textSubtle: 'hsl(217,24%,40%)',
+ textSubtlest: 'hsl(217,24%,40%)',
+ border: 'hsl(217,22%,50%)',
+ borderSubtle: 'hsl(217,22%,60%)',
+ primary: 'hsl(267,67%,47%)',
+ secondary: 'hsl(218,18%,53%)',
+ info: 'hsl(206,100%,36%)',
+ success: 'hsl(155,100%,26%)',
+ notice: 'hsl(45,100%,31%)',
+ warning: 'hsl(30,99%,34%)',
+ danger: 'hsl(334,100%,35%)',
+ },
+};
+
+export const highContrastDark: Theme = {
+ id: 'high-contrast-dark',
+ label: 'High Contrast Dark',
+ dark: true,
+ base: {
+ surface: 'hsl(0,0%,0%)',
+ surfaceHighlight: 'hsl(0,0%,20%)',
+ text: 'hsl(0,0%,100%)',
+ textSubtle: 'hsl(0,0%,90%)',
+ textSubtlest: 'hsl(0,0%,80%)',
+ selection: 'hsl(276,100%,30%)',
+ surfaceActive: 'hsl(276,100%,30%)',
+ border: 'hsl(0,0%,60%)',
+ primary: 'hsl(266,100%,85%)',
+ secondary: 'hsl(242,20%,72%)',
+ info: 'hsl(208,100%,83%)',
+ success: 'hsl(150,100%,63%)',
+ notice: 'hsl(49,100%,77%)',
+ warning: 'hsl(28,100%,73%)',
+ danger: 'hsl(343,100%,79%)',
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/horizon.ts b/plugins/themes-yaak/src/themes/horizon.ts
new file mode 100644
index 00000000..9f153f3e
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/horizon.ts
@@ -0,0 +1,47 @@
+import type { Theme } from '@yaakapp/api';
+
+export const horizon: Theme = {
+ id: 'horizon',
+ label: 'Horizon',
+ dark: true,
+ base: {
+ surface: 'hsl(220, 16%, 13%)',
+ surfaceHighlight: 'hsl(220, 14%, 18%)',
+ text: 'hsl(220, 15%, 85%)',
+ textSubtle: 'hsl(220, 10%, 55%)',
+ textSubtlest: 'hsl(220, 8%, 45%)',
+ primary: 'hsl(5, 85%, 68%)',
+ secondary: 'hsl(220, 10%, 55%)',
+ info: 'hsl(217, 70%, 68%)',
+ success: 'hsl(92, 50%, 60%)',
+ notice: 'hsl(34, 92%, 70%)',
+ warning: 'hsl(20, 90%, 65%)',
+ danger: 'hsl(355, 80%, 65%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(220, 16%, 10%)',
+ },
+ sidebar: {
+ surface: 'hsl(220, 14%, 15%)',
+ border: 'hsl(220, 14%, 19%)',
+ },
+ appHeader: {
+ surface: 'hsl(220, 16%, 11%)',
+ border: 'hsl(220, 14%, 17%)',
+ },
+ responsePane: {
+ surface: 'hsl(220, 14%, 15%)',
+ border: 'hsl(220, 14%, 19%)',
+ },
+ button: {
+ primary: 'hsl(5, 85%, 61%)',
+ secondary: 'hsl(224,8%,53%)',
+ info: 'hsl(217, 70%, 61%)',
+ success: 'hsl(92, 50%, 53%)',
+ notice: 'hsl(34, 92%, 63%)',
+ warning: 'hsl(20, 90%, 58%)',
+ danger: 'hsl(355, 80%, 58%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/hotdog-stand.ts b/plugins/themes-yaak/src/themes/hotdog-stand.ts
new file mode 100644
index 00000000..9729bc3b
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/hotdog-stand.ts
@@ -0,0 +1,58 @@
+import type { Theme } from '@yaakapp/api';
+
+export const hotdogStand: Theme = {
+ id: 'hotdog-stand',
+ label: 'Hotdog Stand',
+ dark: true,
+ base: {
+ surface: 'hsl(0,100%,50%)',
+ surfaceHighlight: 'hsl(0,0%,0%)',
+ text: 'hsl(0,0%,100%)',
+ textSubtle: 'hsl(0,0%,100%)',
+ textSubtlest: 'hsl(60,100%,50%)',
+ border: 'hsl(0,0%,0%)',
+ primary: 'hsl(60,100%,50%)',
+ secondary: 'hsl(60,100%,50%)',
+ info: 'hsl(60,100%,50%)',
+ success: 'hsl(60,100%,50%)',
+ notice: 'hsl(60,100%,50%)',
+ warning: 'hsl(60,100%,50%)',
+ danger: 'hsl(60,100%,50%)',
+ },
+ components: {
+ appHeader: {
+ surface: 'hsl(0,0%,0%)',
+ text: 'hsl(0,0%,100%)',
+ textSubtle: 'hsl(60,100%,50%)',
+ textSubtlest: 'hsl(0,100%,50%)',
+ },
+ menu: {
+ surface: 'hsl(0,0%,0%)',
+ border: 'hsl(0,100%,50%)',
+ surfaceHighlight: 'hsl(0,100%,50%)',
+ text: 'hsl(0,0%,100%)',
+ textSubtle: 'hsl(60,100%,50%)',
+ textSubtlest: 'hsl(60,100%,50%)',
+ },
+ button: {
+ surface: 'hsl(0,0%,0%)',
+ text: 'hsl(0,0%,100%)',
+ primary: 'hsl(0,0%,0%)',
+ secondary: 'hsl(0,0%,100%)',
+ info: 'hsl(0,0%,0%)',
+ success: 'hsl(60,100%,50%)',
+ notice: 'hsl(60,100%,50%)',
+ warning: 'hsl(0,0%,0%)',
+ danger: 'hsl(0,100%,50%)',
+ },
+ editor: {
+ primary: 'hsl(0,0%,100%)',
+ secondary: 'hsl(0,0%,100%)',
+ info: 'hsl(0,0%,100%)',
+ success: 'hsl(0,0%,100%)',
+ notice: 'hsl(60,100%,50%)',
+ warning: 'hsl(0,0%,100%)',
+ danger: 'hsl(0,0%,100%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/material-darker.ts b/plugins/themes-yaak/src/themes/material-darker.ts
new file mode 100644
index 00000000..4a138b59
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/material-darker.ts
@@ -0,0 +1,39 @@
+import type { Theme } from '@yaakapp/api';
+
+export const materialDarker: Theme = {
+ id: 'material-darker',
+ label: 'Material Darker',
+ dark: true,
+ base: {
+ surface: 'hsl(0, 0%, 13%)',
+ surfaceHighlight: 'hsl(0, 0%, 18%)',
+ text: 'hsl(0, 0%, 93%)',
+ textSubtle: 'hsl(0, 0%, 65%)',
+ textSubtlest: 'hsl(0, 0%, 50%)',
+ primary: 'hsl(262, 100%, 75%)',
+ secondary: 'hsl(0, 0%, 60%)',
+ info: 'hsl(224, 100%, 75%)',
+ success: 'hsl(84, 60%, 73%)',
+ notice: 'hsl(43, 100%, 70%)',
+ warning: 'hsl(14, 85%, 70%)',
+ danger: 'hsl(1, 77%, 59%)',
+ },
+ components: {
+ sidebar: {
+ surface: 'hsl(0, 0%, 11%)',
+ border: 'hsl(0, 0%, 16%)',
+ },
+ appHeader: {
+ surface: 'hsl(0, 0%, 9%)',
+ border: 'hsl(0, 0%, 14%)',
+ },
+ button: {
+ primary: 'hsl(262, 100%, 68%)',
+ info: 'hsl(224, 100%, 68%)',
+ success: 'hsl(84, 60%, 66%)',
+ notice: 'hsl(43, 100%, 63%)',
+ warning: 'hsl(14, 85%, 63%)',
+ danger: 'hsl(1, 77%, 52%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/material-ocean.ts b/plugins/themes-yaak/src/themes/material-ocean.ts
new file mode 100644
index 00000000..9bad876a
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/material-ocean.ts
@@ -0,0 +1,43 @@
+import type { Theme } from '@yaakapp/api';
+
+export const materialOcean: Theme = {
+ id: 'material-ocean',
+ label: 'Material Ocean',
+ dark: true,
+ base: {
+ surface: 'hsl(230, 25%, 14%)',
+ surfaceHighlight: 'hsl(230, 20%, 18%)',
+ text: 'hsl(220, 53%, 85%)',
+ textSubtle: 'hsl(228, 12%, 54%)',
+ textSubtlest: 'hsl(228, 12%, 42%)',
+ primary: 'hsl(262, 100%, 75%)',
+ secondary: 'hsl(228, 12%, 60%)',
+ info: 'hsl(224, 100%, 75%)',
+ success: 'hsl(84, 60%, 73%)',
+ notice: 'hsl(43, 100%, 70%)',
+ warning: 'hsl(14, 85%, 70%)',
+ danger: 'hsl(1, 77%, 59%)',
+ },
+ components: {
+ sidebar: {
+ surface: 'hsl(230, 25%, 12%)',
+ border: 'hsl(230, 20%, 18%)',
+ },
+ appHeader: {
+ surface: 'hsl(230, 25%, 10%)',
+ border: 'hsl(230, 20%, 16%)',
+ },
+ responsePane: {
+ surface: 'hsl(230, 25%, 12%)',
+ border: 'hsl(230, 20%, 18%)',
+ },
+ button: {
+ primary: 'hsl(262, 100%, 68%)',
+ info: 'hsl(224, 100%, 68%)',
+ success: 'hsl(84, 60%, 66%)',
+ notice: 'hsl(43, 100%, 63%)',
+ warning: 'hsl(14, 85%, 63%)',
+ danger: 'hsl(1, 77%, 52%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/material-palenight.ts b/plugins/themes-yaak/src/themes/material-palenight.ts
new file mode 100644
index 00000000..fbd3bdad
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/material-palenight.ts
@@ -0,0 +1,45 @@
+import type { Theme } from '@yaakapp/api';
+
+export const materialPalenight: Theme = {
+ id: 'material-palenight',
+ label: 'Material Palenight',
+ dark: true,
+ base: {
+ surface: '#292D3E',
+ surfaceHighlight: '#313850',
+ text: '#BFC7D5',
+ textSubtle: '#697098',
+ textSubtlest: '#4E5579',
+ primary: '#c792ea',
+ secondary: '#697098',
+ info: '#82AAFF',
+ success: '#C3E88D',
+ notice: '#FFCB6B',
+ warning: '#F78C6C',
+ danger: '#ff5572',
+ },
+ components: {
+ dialog: {
+ surface: '#232635',
+ },
+ sidebar: {
+ surface: '#292D3E',
+ },
+ appHeader: {
+ surface: '#282C3D',
+ },
+ responsePane: {
+ surface: '#313850',
+ border: '#3a3f58',
+ },
+ button: {
+ primary: '#c792ea',
+ secondary: '#697098',
+ info: '#82AAFF',
+ success: '#C3E88D',
+ notice: '#FFCB6B',
+ warning: '#F78C6C',
+ danger: '#ff5572',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/monokai-pro.ts b/plugins/themes-yaak/src/themes/monokai-pro.ts
new file mode 100644
index 00000000..5656cef0
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/monokai-pro.ts
@@ -0,0 +1,217 @@
+import type { Theme } from '@yaakapp/api';
+
+export const monokaiPro: Theme = {
+ id: 'monokai-pro',
+ label: 'Monokai Pro',
+ dark: true,
+ base: {
+ surface: 'hsl(285,5%,17%)',
+ text: 'hsl(60,25%,98%)',
+ textSubtle: 'hsl(0,1%,75%)',
+ textSubtlest: 'hsl(300,0%,57%)',
+ primary: 'hsl(250,77%,78%)',
+ secondary: 'hsl(0,1%,75%)',
+ info: 'hsl(186,71%,69%)',
+ success: 'hsl(90,59%,66%)',
+ notice: 'hsl(45,100%,70%)',
+ warning: 'hsl(20,96%,70%)',
+ danger: 'hsl(345,100%,69%)',
+ },
+ components: {
+ appHeader: {
+ surface: 'hsl(300,5%,13%)',
+ text: 'hsl(0,1%,75%)',
+ textSubtle: 'hsl(300,0%,57%)',
+ textSubtlest: 'hsl(300,1%,44%)',
+ },
+ button: {
+ primary: 'hsl(250,77%,70%)',
+ secondary: 'hsl(0,1%,68%)',
+ info: 'hsl(186,71%,62%)',
+ success: 'hsl(90,59%,59%)',
+ notice: 'hsl(45,100%,63%)',
+ warning: 'hsl(20,96%,63%)',
+ danger: 'hsl(345,100%,62%)',
+ },
+ },
+};
+
+export const monokaiProClassic: Theme = {
+ id: 'monokai-pro-classic',
+ label: 'Monokai Pro Classic',
+ dark: true,
+ base: {
+ surface: 'hsl(70,8%,15%)',
+ text: 'hsl(69,100%,97%)',
+ textSubtle: 'hsl(65,9%,73%)',
+ textSubtlest: 'hsl(66,4%,55%)',
+ primary: 'hsl(261,100%,75%)',
+ secondary: 'hsl(202,8%,72%)',
+ info: 'hsl(190,81%,67%)',
+ success: 'hsl(80,76%,53%)',
+ notice: 'hsl(54,70%,68%)',
+ warning: 'hsl(32,98%,56%)',
+ danger: 'hsl(338,95%,56%)',
+ },
+ components: {
+ appHeader: {
+ surface: 'hsl(72,9%,11%)',
+ text: 'hsl(202,8%,72%)',
+ textSubtle: 'hsl(213,4%,48%)',
+ textSubtlest: 'hsl(223,6%,44%)',
+ },
+ button: {
+ primary: 'hsl(261,100%,68%)',
+ secondary: 'hsl(202,8%,65%)',
+ info: 'hsl(190,81%,60%)',
+ success: 'hsl(80,76%,48%)',
+ notice: 'hsl(54,71%,61%)',
+ warning: 'hsl(32,98%,50%)',
+ danger: 'hsl(338,95%,50%)',
+ },
+ },
+};
+
+export const monokaiProMachine: Theme = {
+ id: 'monokai-pro-machine',
+ label: 'Monokai Pro Machine',
+ dark: true,
+ base: {
+ surface: 'hsl(200,16%,18%)',
+ text: 'hsl(173,24%,93%)',
+ textSubtle: 'hsl(185,6%,57%)',
+ textSubtlest: 'hsl(189,6%,45%)',
+ primary: 'hsl(258,86%,80%)',
+ secondary: 'hsl(175,9%,75%)',
+ info: 'hsl(194,81%,72%)',
+ success: 'hsl(98,67%,69%)',
+ notice: 'hsl(52,100%,72%)',
+ warning: 'hsl(28,100%,72%)',
+ danger: 'hsl(353,100%,71%)',
+ },
+ components: {
+ appHeader: {
+ surface: 'hsl(196,16%,14%)',
+ text: 'hsl(202,8%,72%)',
+ textSubtle: 'hsl(213,4%,48%)',
+ textSubtlest: 'hsl(223,6%,44%)',
+ },
+ button: {
+ primary: 'hsl(258,86%,72%)',
+ secondary: 'hsl(175,9%,68%)',
+ info: 'hsl(194,80%,65%)',
+ success: 'hsl(98,67%,62%)',
+ notice: 'hsl(52,100%,65%)',
+ warning: 'hsl(28,100%,65%)',
+ danger: 'hsl(353,100%,64%)',
+ },
+ },
+};
+
+export const monokaiProOctagon: Theme = {
+ id: 'monokai-pro-octagon',
+ label: 'Monokai Pro Octagon',
+ dark: true,
+ base: {
+ surface: 'hsl(233,18%,19%)',
+ text: 'hsl(173,24%,93%)',
+ textSubtle: 'hsl(202,8%,72%)',
+ textSubtlest: 'hsl(213,4%,48%)',
+ primary: 'hsl(292,30%,70%)',
+ secondary: 'hsl(202,8%,72%)',
+ info: 'hsl(155,37%,72%)',
+ success: 'hsl(75,60%,61%)',
+ notice: 'hsl(44,100%,71%)',
+ warning: 'hsl(23,100%,68%)',
+ danger: 'hsl(352,100%,70%)',
+ },
+ components: {
+ appHeader: {
+ surface: 'hsl(235,18%,14%)',
+ text: 'hsl(202,8%,72%)',
+ textSubtle: 'hsl(213,4%,48%)',
+ textSubtlest: 'hsl(223,6%,44%)',
+ },
+ button: {
+ primary: 'hsl(292,26%,63%)',
+ secondary: 'hsl(201,7%,65%)',
+ info: 'hsl(155,33%,65%)',
+ success: 'hsl(75,54%,55%)',
+ notice: 'hsl(44,90%,64%)',
+ warning: 'hsl(23,90%,61%)',
+ danger: 'hsl(352,90%,63%)',
+ },
+ },
+};
+
+export const monokaiProRistretto: Theme = {
+ id: 'monokai-pro-ristretto',
+ label: 'Monokai Pro Ristretto',
+ dark: true,
+ base: {
+ surface: 'hsl(0,9%,16%)',
+ text: 'hsl(351,100%,97%)',
+ textSubtle: 'hsl(355,9%,74%)',
+ textSubtlest: 'hsl(354,4%,56%)',
+ primary: 'hsl(239,63%,79%)',
+ secondary: 'hsl(355,9%,74%)',
+ info: 'hsl(170,53%,69%)',
+ success: 'hsl(88,57%,66%)',
+ notice: 'hsl(41,92%,70%)',
+ warning: 'hsl(13,85%,70%)',
+ danger: 'hsl(349,97%,70%)',
+ },
+ components: {
+ appHeader: {
+ surface: 'hsl(0,8%,12%)',
+ text: 'hsl(355,9%,74%)',
+ textSubtle: 'hsl(354,4%,56%)',
+ textSubtlest: 'hsl(353,4%,43%)',
+ },
+ button: {
+ primary: 'hsl(239,63%,71%)',
+ secondary: 'hsl(355,9%,67%)',
+ info: 'hsl(170,53%,62%)',
+ success: 'hsl(88,57%,59%)',
+ notice: 'hsl(41,92%,63%)',
+ warning: 'hsl(13,86%,63%)',
+ danger: 'hsl(349,97%,63%)',
+ },
+ },
+};
+
+export const monokaiProSpectrum: Theme = {
+ id: 'monokai-pro-spectrum',
+ label: 'Monokai Pro Spectrum',
+ dark: true,
+ base: {
+ surface: 'hsl(0,0%,13%)',
+ text: 'hsl(266,100%,97%)',
+ textSubtle: 'hsl(264,7%,73%)',
+ textSubtlest: 'hsl(266,3%,55%)',
+ primary: 'hsl(247,61%,72%)',
+ secondary: 'hsl(264,7%,73%)',
+ info: 'hsl(188,74%,63%)',
+ success: 'hsl(133,54%,66%)',
+ notice: 'hsl(51,96%,69%)',
+ warning: 'hsl(23,98%,66%)',
+ danger: 'hsl(343,96%,68%)',
+ },
+ components: {
+ appHeader: {
+ surface: 'hsl(0,0%,10%)',
+ text: 'hsl(264,7%,73%)',
+ textSubtle: 'hsl(266,3%,55%)',
+ textSubtlest: 'hsl(264,2%,41%)',
+ },
+ button: {
+ primary: 'hsl(247,61%,65%)',
+ secondary: 'hsl(264,7%,66%)',
+ info: 'hsl(188,74%,57%)',
+ success: 'hsl(133,54%,59%)',
+ notice: 'hsl(51,96%,62%)',
+ warning: 'hsl(23,98%,59%)',
+ danger: 'hsl(343,96%,61%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/moonlight.ts b/plugins/themes-yaak/src/themes/moonlight.ts
new file mode 100644
index 00000000..29a9c884
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/moonlight.ts
@@ -0,0 +1,28 @@
+import type { Theme } from '@yaakapp/api';
+
+export const moonlight: Theme = {
+ id: 'moonlight',
+ label: 'Moonlight',
+ dark: true,
+ base: {
+ surface: 'hsl(234,23%,17%)',
+ text: 'hsl(225,71%,90%)',
+ textSubtle: 'hsl(230,28%,62%)',
+ textSubtlest: 'hsl(232,26%,43%)',
+ primary: 'hsl(262,100%,82%)',
+ secondary: 'hsl(232,18%,65%)',
+ info: 'hsl(217,100%,74%)',
+ success: 'hsl(174,66%,54%)',
+ notice: 'hsl(35,100%,73%)',
+ warning: 'hsl(17,100%,71%)',
+ danger: 'hsl(356,100%,73%)',
+ },
+ components: {
+ appHeader: {
+ surface: 'hsl(233,23%,15%)',
+ },
+ sidebar: {
+ surface: 'hsl(233,23%,15%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/night-owl.ts b/plugins/themes-yaak/src/themes/night-owl.ts
new file mode 100644
index 00000000..28c7f302
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/night-owl.ts
@@ -0,0 +1,78 @@
+import type { Theme } from '@yaakapp/api';
+
+export const nightOwl: Theme = {
+ id: 'night-owl',
+ label: 'Night Owl',
+ dark: true,
+ base: {
+ surface: 'hsl(207, 95%, 8%)',
+ surfaceHighlight: 'hsl(207, 50%, 14%)',
+ text: 'hsl(213, 50%, 90%)',
+ textSubtle: 'hsl(213, 30%, 70%)',
+ textSubtlest: 'hsl(213, 20%, 50%)',
+ border: 'hsl(207, 50%, 14%)',
+ primary: 'hsl(261, 51%, 51%)',
+ secondary: 'hsl(213, 30%, 60%)',
+ info: 'hsl(220, 100%, 75%)',
+ success: 'hsl(145, 100%, 43%)',
+ notice: 'hsl(62, 61%, 71%)',
+ warning: 'hsl(4, 90%, 58%)',
+ danger: 'hsl(4, 90%, 58%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(207, 95%, 6%)',
+ },
+ sidebar: {
+ surface: 'hsl(207, 95%, 8%)',
+ border: 'hsl(207, 50%, 14%)',
+ },
+ appHeader: {
+ surface: 'hsl(207, 95%, 5%)',
+ border: 'hsl(207, 50%, 12%)',
+ },
+ responsePane: {
+ surface: 'hsl(207, 70%, 10%)',
+ border: 'hsl(207, 50%, 14%)',
+ },
+ button: {
+ primary: 'hsl(261, 51%, 45%)',
+ secondary: 'hsl(213, 30%, 60%)',
+ info: 'hsl(220, 100%, 68%)',
+ success: 'hsl(145, 100%, 38%)',
+ notice: 'hsl(62, 61%, 64%)',
+ warning: 'hsl(4, 90%, 52%)',
+ danger: 'hsl(4, 90%, 52%)',
+ },
+ },
+};
+
+export const lightOwl: Theme = {
+ id: 'light-owl',
+ label: 'Light Owl',
+ dark: false,
+ base: {
+ surface: 'hsl(0, 0%, 98%)',
+ surfaceHighlight: 'hsl(210, 18%, 94%)',
+ text: 'hsl(224, 26%, 27%)',
+ textSubtle: 'hsl(224, 15%, 45%)',
+ textSubtlest: 'hsl(224, 10%, 55%)',
+ primary: 'hsl(283, 100%, 41%)',
+ secondary: 'hsl(224, 15%, 50%)',
+ info: 'hsl(219, 75%, 40%)',
+ success: 'hsl(145, 70%, 35%)',
+ notice: 'hsl(36, 95%, 40%)',
+ warning: 'hsl(0, 55%, 55%)',
+ danger: 'hsl(0, 55%, 50%)',
+ },
+ components: {
+ sidebar: {
+ surface: 'hsl(210, 20%, 96%)',
+ border: 'hsl(210, 15%, 90%)',
+ },
+ appHeader: {
+ surface: 'hsl(210, 20%, 94%)',
+ border: 'hsl(210, 15%, 88%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/noctis.ts b/plugins/themes-yaak/src/themes/noctis.ts
new file mode 100644
index 00000000..03c30ca2
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/noctis.ts
@@ -0,0 +1,47 @@
+import type { Theme } from '@yaakapp/api';
+
+export const noctisAzureus: Theme = {
+ id: 'noctis-azureus',
+ label: 'Noctis Azureus',
+ dark: true,
+ base: {
+ surface: 'hsl(210, 35%, 14%)',
+ surfaceHighlight: 'hsl(210, 30%, 19%)',
+ text: 'hsl(180, 45%, 85%)',
+ textSubtle: 'hsl(180, 25%, 60%)',
+ textSubtlest: 'hsl(180, 18%, 45%)',
+ primary: 'hsl(175, 60%, 55%)',
+ secondary: 'hsl(200, 70%, 65%)',
+ info: 'hsl(200, 70%, 65%)',
+ success: 'hsl(85, 55%, 60%)',
+ notice: 'hsl(45, 90%, 60%)',
+ warning: 'hsl(25, 85%, 58%)',
+ danger: 'hsl(355, 75%, 62%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(210, 35%, 11%)',
+ },
+ sidebar: {
+ surface: 'hsl(210, 33%, 12%)',
+ border: 'hsl(210, 30%, 17%)',
+ },
+ appHeader: {
+ surface: 'hsl(210, 35%, 10%)',
+ border: 'hsl(210, 30%, 15%)',
+ },
+ responsePane: {
+ surface: 'hsl(210, 33%, 12%)',
+ border: 'hsl(210, 30%, 17%)',
+ },
+ button: {
+ primary: 'hsl(175, 60%, 48%)',
+ secondary: 'hsl(200, 70%, 58%)',
+ info: 'hsl(200, 70%, 58%)',
+ success: 'hsl(85, 55%, 53%)',
+ notice: 'hsl(45, 90%, 53%)',
+ warning: 'hsl(25, 85%, 51%)',
+ danger: 'hsl(355, 75%, 55%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/nord.ts b/plugins/themes-yaak/src/themes/nord.ts
new file mode 100644
index 00000000..df875042
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/nord.ts
@@ -0,0 +1,29 @@
+import type { Theme } from '@yaakapp/api';
+
+export const nord: Theme = {
+ id: 'nord',
+ label: 'Nord',
+ dark: true,
+ base: {
+ surface: 'hsl(220,16%,22%)',
+ surfaceHighlight: 'hsl(220,14%,28%)',
+ text: 'hsl(220,28%,93%)',
+ textSubtle: 'hsl(220,26%,90%)',
+ textSubtlest: 'hsl(220,24%,86%)',
+ primary: 'hsl(193,38%,68%)',
+ secondary: 'hsl(210,34%,63%)',
+ info: 'hsl(174,25%,69%)',
+ success: 'hsl(89,26%,66%)',
+ notice: 'hsl(40,66%,73%)',
+ warning: 'hsl(17,48%,64%)',
+ danger: 'hsl(353,43%,56%)',
+ },
+ components: {
+ sidebar: {
+ backdrop: 'hsl(220,16%,22%)',
+ },
+ appHeader: {
+ backdrop: 'hsl(220,14%,28%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/one-dark-pro.ts b/plugins/themes-yaak/src/themes/one-dark-pro.ts
new file mode 100644
index 00000000..0be776c0
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/one-dark-pro.ts
@@ -0,0 +1,44 @@
+import type { Theme } from '@yaakapp/api';
+
+export const oneDarkPro: Theme = {
+ id: 'one-dark-pro',
+ label: 'One Dark Pro',
+ dark: true,
+ base: {
+ surface: 'hsl(220, 13%, 18%)',
+ surfaceHighlight: 'hsl(220, 13%, 22%)',
+ text: 'hsl(219, 14%, 71%)',
+ textSubtle: 'hsl(219, 10%, 53%)',
+ textSubtlest: 'hsl(220, 9%, 45%)',
+ primary: 'hsl(286, 60%, 67%)',
+ secondary: 'hsl(219, 14%, 60%)',
+ info: 'hsl(207, 82%, 66%)',
+ success: 'hsl(95, 38%, 62%)',
+ notice: 'hsl(39, 67%, 69%)',
+ warning: 'hsl(29, 54%, 61%)',
+ danger: 'hsl(355, 65%, 65%)',
+ },
+ components: {
+ sidebar: {
+ surface: 'hsl(220, 13%, 16%)',
+ border: 'hsl(220, 13%, 20%)',
+ },
+ appHeader: {
+ surface: 'hsl(220, 13%, 14%)',
+ border: 'hsl(220, 13%, 20%)',
+ },
+ responsePane: {
+ surface: 'hsl(220, 13%, 16%)',
+ border: 'hsl(220, 13%, 20%)',
+ },
+ button: {
+ primary: 'hsl(286, 60%, 60%)',
+ secondary: 'hsl(219, 14%, 53%)',
+ info: 'hsl(207, 82%, 59%)',
+ success: 'hsl(95, 38%, 55%)',
+ notice: 'hsl(39, 67%, 62%)',
+ warning: 'hsl(29, 54%, 54%)',
+ danger: 'hsl(355, 65%, 58%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/panda.ts b/plugins/themes-yaak/src/themes/panda.ts
new file mode 100644
index 00000000..c95ff485
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/panda.ts
@@ -0,0 +1,47 @@
+import type { Theme } from '@yaakapp/api';
+
+export const pandaSyntax: Theme = {
+ id: 'panda',
+ label: 'Panda Syntax',
+ dark: true,
+ base: {
+ surface: 'hsl(225, 15%, 15%)',
+ surfaceHighlight: 'hsl(225, 12%, 20%)',
+ text: 'hsl(0, 0%, 90%)',
+ textSubtle: 'hsl(0, 0%, 65%)',
+ textSubtlest: 'hsl(0, 0%, 50%)',
+ primary: 'hsl(353, 95%, 70%)',
+ secondary: 'hsl(0, 0%, 65%)',
+ info: 'hsl(200, 85%, 65%)',
+ success: 'hsl(175, 90%, 65%)',
+ notice: 'hsl(40, 100%, 65%)',
+ warning: 'hsl(40, 100%, 65%)',
+ danger: 'hsl(0, 90%, 65%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(225, 15%, 12%)',
+ },
+ sidebar: {
+ surface: 'hsl(225, 14%, 13%)',
+ border: 'hsl(225, 12%, 18%)',
+ },
+ appHeader: {
+ surface: 'hsl(225, 15%, 11%)',
+ border: 'hsl(225, 12%, 16%)',
+ },
+ responsePane: {
+ surface: 'hsl(225, 14%, 13%)',
+ border: 'hsl(225, 12%, 18%)',
+ },
+ button: {
+ primary: 'hsl(353, 95%, 63%)',
+ secondary: 'hsl(0, 0%, 58%)',
+ info: 'hsl(200, 85%, 58%)',
+ success: 'hsl(175, 90%, 58%)',
+ notice: 'hsl(40, 100%, 58%)',
+ warning: 'hsl(40, 100%, 58%)',
+ danger: 'hsl(0, 90%, 58%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/relaxing.ts b/plugins/themes-yaak/src/themes/relaxing.ts
new file mode 100644
index 00000000..80025b64
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/relaxing.ts
@@ -0,0 +1,18 @@
+import type { Theme } from '@yaakapp/api';
+
+export const relaxing: Theme = {
+ id: 'relaxing',
+ label: 'Relaxing',
+ dark: true,
+ base: {
+ surface: 'hsl(267,33%,17%)',
+ text: 'hsl(275,49%,92%)',
+ primary: 'hsl(267,84%,81%)',
+ 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%)',
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/rose-pine.ts b/plugins/themes-yaak/src/themes/rose-pine.ts
new file mode 100644
index 00000000..47113dfb
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/rose-pine.ts
@@ -0,0 +1,111 @@
+import type { Theme } from '@yaakapp/api';
+
+export const rosePine: Theme = {
+ id: 'rose-pine',
+ label: 'Rosé Pine',
+ dark: true,
+ base: {
+ surface: 'hsl(249,22%,12%)',
+ text: 'hsl(245,50%,91%)',
+ textSubtle: 'hsl(248,15%,61%)',
+ textSubtlest: 'hsl(249,12%,47%)',
+ primary: 'hsl(267,57%,78%)',
+ secondary: 'hsl(249,12%,47%)',
+ info: 'hsl(199,49%,60%)',
+ success: 'hsl(180,43%,73%)',
+ notice: 'hsl(35,88%,72%)',
+ warning: 'hsl(1,74%,79%)',
+ danger: 'hsl(343,76%,68%)',
+ },
+ components: {
+ responsePane: {
+ surface: 'hsl(247,23%,15%)',
+ },
+ sidebar: {
+ surface: 'hsl(247,23%,15%)',
+ },
+ menu: {
+ surface: 'hsl(248,21%,26%)',
+ textSubtle: 'hsl(248,15%,66%)',
+ textSubtlest: 'hsl(249,12%,52%)',
+ border: 'hsl(248,21%,35%)',
+ borderSubtle: 'hsl(248,21%,33%)',
+ },
+ },
+};
+
+export const rosePineMoon: Theme = {
+ id: 'rose-pine-moon',
+ label: 'Rosé Pine Moon',
+ dark: true,
+ base: {
+ surface: 'hsl(246,24%,17%)',
+ text: 'hsl(245,50%,91%)',
+ textSubtle: 'hsl(248,15%,61%)',
+ textSubtlest: 'hsl(249,12%,47%)',
+ primary: 'hsl(267,57%,78%)',
+ secondary: 'hsl(248,15%,61%)',
+ info: 'hsl(197,48%,60%)',
+ success: 'hsl(197,48%,60%)',
+ notice: 'hsl(35,88%,72%)',
+ warning: 'hsl(2,66%,75%)',
+ danger: 'hsl(343,76%,68%)',
+ },
+ components: {
+ responsePane: {
+ surface: 'hsl(247,24%,20%)',
+ },
+ sidebar: {
+ surface: 'hsl(247,24%,20%)',
+ },
+ menu: {
+ surface: 'hsl(248,21%,26%)',
+ textSubtle: 'hsl(248,15%,61%)',
+ textSubtlest: 'hsl(249,12%,55%)',
+ border: 'hsl(248,21%,35%)',
+ borderSubtle: 'hsl(248,21%,31%)',
+ },
+ },
+};
+
+export const rosePineDawn: Theme = {
+ id: 'rose-pine-dawn',
+ label: 'Rosé Pine Dawn',
+ dark: false,
+ base: {
+ surface: 'hsl(32,57%,95%)',
+ border: 'hsl(10,9%,86%)',
+ surfaceHighlight: 'hsl(25,35%,93%)',
+ text: 'hsl(248,19%,40%)',
+ textSubtle: 'hsl(248,12%,52%)',
+ textSubtlest: 'hsl(257,9%,61%)',
+ primary: 'hsl(271,27%,56%)',
+ secondary: 'hsl(249,12%,47%)',
+ info: 'hsl(197,52%,36%)',
+ success: 'hsl(188,31%,45%)',
+ notice: 'hsl(34,64%,49%)',
+ warning: 'hsl(2,47%,64%)',
+ danger: 'hsl(343,35%,55%)',
+ },
+ components: {
+ responsePane: {
+ border: 'hsl(20,12%,90%)',
+ },
+ sidebar: {
+ border: 'hsl(20,12%,90%)',
+ },
+ appHeader: {
+ border: 'hsl(20,12%,90%)',
+ },
+ input: {
+ border: 'hsl(10,9%,86%)',
+ },
+ dialog: {
+ border: 'hsl(20,12%,90%)',
+ },
+ menu: {
+ surface: 'hsl(28,40%,92%)',
+ border: 'hsl(10,9%,86%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/shades-of-purple.ts b/plugins/themes-yaak/src/themes/shades-of-purple.ts
new file mode 100644
index 00000000..ca9e66a9
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/shades-of-purple.ts
@@ -0,0 +1,99 @@
+import type { Theme } from '@yaakapp/api';
+
+export const shadesOfPurple: Theme = {
+ id: 'shades-of-purple',
+ label: 'Shades of Purple',
+ dark: true,
+ base: {
+ surface: '#2D2B55',
+ surfaceHighlight: '#1F1F41',
+ text: '#FFFFFF',
+ textSubtle: '#A599E9',
+ textSubtlest: '#7E72C4',
+ primary: '#FAD000',
+ secondary: '#A599E9',
+ info: '#80FFBB',
+ success: '#3AD900',
+ notice: '#FAD000',
+ warning: '#FF9D00',
+ danger: '#EC3A37F5',
+ },
+ components: {
+ dialog: {
+ surface: '#1E1E3F',
+ },
+ sidebar: {
+ surface: '#222244',
+ border: '#1E1E3F',
+ },
+ input: {
+ border: '#7E72C4',
+ },
+ appHeader: {
+ surface: '#1E1E3F',
+ border: '#1E1E3F',
+ },
+ responsePane: {
+ surface: 'hsl(240,33%,20%)',
+ border: 'hsl(240,33%,20%)',
+ },
+ button: {
+ primary: '#FAD000',
+ secondary: '#A599E9',
+ info: '#80FFBB',
+ success: '#3AD900',
+ notice: '#FAD000',
+ warning: '#FF9D00',
+ danger: '#EC3A37F5',
+ },
+ },
+};
+
+export const shadesOfPurpleSuperDark: Theme = {
+ id: 'shades-of-purple-super-dark',
+ label: 'Shades of Purple (Super Dark)',
+ dark: true,
+ base: {
+ surface: '#191830',
+ surfaceHighlight: '#1F1E3A',
+ text: '#FFFFFF',
+ textSubtle: '#A599E9',
+ textSubtlest: '#7E72C4',
+ primary: '#FAD000',
+ secondary: '#A599E9',
+ info: '#80FFBB',
+ success: '#3AD900',
+ notice: '#FAD000',
+ warning: '#FF9D00',
+ danger: '#EC3A37F5',
+ },
+ components: {
+ dialog: {
+ surface: '#15152b',
+ },
+ input: {
+ border: '#2D2B55',
+ },
+ sidebar: {
+ surface: '#131327',
+ border: '#131327',
+ },
+ appHeader: {
+ surface: '#15152a',
+ border: '#15152a',
+ },
+ responsePane: {
+ surface: '#131327',
+ border: '#131327',
+ },
+ button: {
+ primary: '#FAD000',
+ secondary: '#A599E9',
+ info: '#80FFBB',
+ success: '#3AD900',
+ notice: '#FAD000',
+ warning: '#FF9D00',
+ danger: '#EC3A37F5',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/slack.ts b/plugins/themes-yaak/src/themes/slack.ts
new file mode 100644
index 00000000..908fe00a
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/slack.ts
@@ -0,0 +1,47 @@
+import type { Theme } from '@yaakapp/api';
+
+export const slackAubergine: Theme = {
+ id: 'slack-aubergine',
+ label: 'Slack Aubergine',
+ dark: true,
+ base: {
+ surface: 'hsl(270, 25%, 18%)',
+ surfaceHighlight: 'hsl(270, 22%, 24%)',
+ text: 'hsl(0, 0%, 100%)',
+ textSubtle: 'hsl(270, 15%, 75%)',
+ textSubtlest: 'hsl(270, 12%, 58%)',
+ primary: 'hsl(165, 100%, 40%)',
+ secondary: 'hsl(270, 12%, 65%)',
+ info: 'hsl(195, 95%, 55%)',
+ success: 'hsl(145, 80%, 50%)',
+ notice: 'hsl(43, 100%, 55%)',
+ warning: 'hsl(43, 100%, 50%)',
+ danger: 'hsl(0, 80%, 55%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(270, 25%, 14%)',
+ },
+ sidebar: {
+ surface: 'hsl(270, 23%, 15%)',
+ border: 'hsl(270, 22%, 22%)',
+ },
+ appHeader: {
+ surface: 'hsl(270, 25%, 13%)',
+ border: 'hsl(270, 22%, 20%)',
+ },
+ responsePane: {
+ surface: 'hsl(270, 23%, 15%)',
+ border: 'hsl(270, 22%, 22%)',
+ },
+ button: {
+ primary: 'hsl(165, 100%, 35%)',
+ secondary: 'hsl(270, 12%, 58%)',
+ info: 'hsl(195, 95%, 48%)',
+ success: 'hsl(145, 80%, 45%)',
+ notice: 'hsl(43, 100%, 48%)',
+ warning: 'hsl(43, 100%, 45%)',
+ danger: 'hsl(0, 80%, 48%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/solarized.ts b/plugins/themes-yaak/src/themes/solarized.ts
new file mode 100644
index 00000000..84fad9f4
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/solarized.ts
@@ -0,0 +1,77 @@
+import type { Theme } from '@yaakapp/api';
+
+export const solarizedDark: Theme = {
+ id: 'solarized-dark',
+ label: 'Solarized Dark',
+ dark: true,
+ base: {
+ surface: '#002b36',
+ surfaceHighlight: '#073642',
+ text: '#839496',
+ textSubtle: '#657b83',
+ textSubtlest: '#586e75',
+ primary: '#268bd2',
+ secondary: '#657b83',
+ info: '#268bd2',
+ success: '#859900',
+ notice: '#b58900',
+ warning: '#cb4b16',
+ danger: '#dc322f',
+ },
+ components: {
+ dialog: {
+ surface: '#002b36',
+ },
+ sidebar: {
+ surface: '#073642',
+ border: 'hsl(192,81%,17%)',
+ },
+ appHeader: {
+ surface: '#002b36',
+ border: 'hsl(192,81%,16%)',
+ },
+ responsePane: {
+ surface: '#073642',
+ border: 'hsl(192,81%,17%)',
+ },
+ button: {
+ primary: '#268bd2',
+ secondary: '#657b83',
+ info: '#268bd2',
+ success: '#859900',
+ notice: '#b58900',
+ warning: '#cb4b16',
+ danger: '#dc322f',
+ },
+ },
+};
+
+export const solarizedLight: Theme = {
+ id: 'solarized-light',
+ label: 'Solarized Light',
+ dark: false,
+ base: {
+ surface: '#fdf6e3',
+ surfaceHighlight: '#eee8d5',
+ text: '#657b83',
+ textSubtle: '#839496',
+ textSubtlest: '#93a1a1',
+ primary: '#268bd2',
+ secondary: '#839496',
+ info: '#268bd2',
+ success: '#859900',
+ notice: '#b58900',
+ warning: '#cb4b16',
+ danger: '#dc322f',
+ },
+ components: {
+ sidebar: {
+ surface: '#eee8d5',
+ border: '#d3cbb7',
+ },
+ appHeader: {
+ surface: '#eee8d5',
+ border: '#d3cbb7',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/synthwave-84.ts b/plugins/themes-yaak/src/themes/synthwave-84.ts
new file mode 100644
index 00000000..4a2fb82c
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/synthwave-84.ts
@@ -0,0 +1,56 @@
+import type { Theme } from '@yaakapp/api';
+
+export const synthwave84: Theme = {
+ id: 'synthwave-84',
+ label: "SynthWave '84",
+ dark: true,
+ base: {
+ surface: 'hsl(253, 45%, 15%)',
+ surfaceHighlight: 'hsl(253, 40%, 20%)',
+ text: 'hsl(300, 50%, 90%)',
+ textSubtle: 'hsl(280, 25%, 65%)',
+ textSubtlest: 'hsl(280, 20%, 50%)',
+ primary: 'hsl(177, 100%, 55%)',
+ secondary: 'hsl(280, 20%, 60%)',
+ info: 'hsl(320, 100%, 75%)',
+ success: 'hsl(83, 100%, 60%)',
+ notice: 'hsl(57, 100%, 60%)',
+ warning: 'hsl(30, 100%, 60%)',
+ danger: 'hsl(340, 100%, 65%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(253, 45%, 12%)',
+ },
+ sidebar: {
+ surface: 'hsl(253, 42%, 18%)',
+ border: 'hsl(253, 40%, 22%)',
+ },
+ appHeader: {
+ surface: 'hsl(253, 45%, 11%)',
+ border: 'hsl(253, 40%, 18%)',
+ },
+ responsePane: {
+ surface: 'hsl(253, 42%, 18%)',
+ border: 'hsl(253, 40%, 22%)',
+ },
+ button: {
+ primary: 'hsl(177, 100%, 48%)',
+ secondary: 'hsl(280, 20%, 53%)',
+ info: 'hsl(320, 100%, 68%)',
+ success: 'hsl(83, 100%, 53%)',
+ notice: 'hsl(57, 100%, 53%)',
+ warning: 'hsl(30, 100%, 53%)',
+ danger: 'hsl(340, 100%, 58%)',
+ },
+ editor: {
+ primary: 'hsl(177, 100%, 55%)',
+ secondary: 'hsl(280, 20%, 60%)',
+ info: 'hsl(320, 100%, 75%)',
+ success: 'hsl(83, 100%, 60%)',
+ notice: 'hsl(57, 100%, 60%)',
+ warning: 'hsl(30, 100%, 60%)',
+ danger: 'hsl(340, 100%, 65%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/tokyo-night.ts b/plugins/themes-yaak/src/themes/tokyo-night.ts
new file mode 100644
index 00000000..1b01a9d1
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/tokyo-night.ts
@@ -0,0 +1,121 @@
+import type { Theme } from '@yaakapp/api';
+
+export const tokyoNight: Theme = {
+ id: 'tokyo-night',
+ label: 'Tokyo Night',
+ dark: true,
+ base: {
+ surface: 'hsl(235, 21%, 13%)',
+ surfaceHighlight: 'hsl(235, 18%, 18%)',
+ text: 'hsl(229, 28%, 76%)',
+ textSubtle: 'hsl(232, 18%, 52%)',
+ textSubtlest: 'hsl(234, 16%, 40%)',
+ primary: 'hsl(266, 100%, 78%)',
+ secondary: 'hsl(232, 18%, 52%)',
+ info: 'hsl(217, 100%, 73%)',
+ success: 'hsl(158, 57%, 63%)',
+ notice: 'hsl(40, 67%, 65%)',
+ warning: 'hsl(25, 75%, 58%)',
+ danger: 'hsl(358, 100%, 70%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(235, 21%, 11%)',
+ },
+ sidebar: {
+ surface: 'hsl(235, 21%, 11%)',
+ border: 'hsl(235, 18%, 16%)',
+ },
+ appHeader: {
+ surface: 'hsl(235, 21%, 9%)',
+ border: 'hsl(235, 18%, 14%)',
+ },
+ responsePane: {
+ surface: 'hsl(235, 21%, 11%)',
+ border: 'hsl(235, 18%, 16%)',
+ },
+ button: {
+ primary: 'hsl(266, 100%, 71%)',
+ info: 'hsl(217, 100%, 66%)',
+ success: 'hsl(158, 57%, 56%)',
+ notice: 'hsl(40, 67%, 58%)',
+ warning: 'hsl(25, 75%, 52%)',
+ danger: 'hsl(358, 100%, 63%)',
+ },
+ },
+};
+
+export const tokyoNightStorm: Theme = {
+ id: 'tokyo-night-storm',
+ label: 'Tokyo Night Storm',
+ dark: true,
+ base: {
+ surface: 'hsl(232, 25%, 17%)',
+ surfaceHighlight: 'hsl(232, 22%, 22%)',
+ text: 'hsl(229, 28%, 76%)',
+ textSubtle: 'hsl(232, 18%, 52%)',
+ textSubtlest: 'hsl(234, 16%, 40%)',
+ primary: 'hsl(266, 100%, 78%)',
+ secondary: 'hsl(232, 18%, 52%)',
+ info: 'hsl(217, 100%, 73%)',
+ success: 'hsl(158, 57%, 63%)',
+ notice: 'hsl(40, 67%, 65%)',
+ warning: 'hsl(25, 75%, 58%)',
+ danger: 'hsl(358, 100%, 70%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(232, 25%, 14%)',
+ },
+ sidebar: {
+ surface: 'hsl(232, 25%, 14%)',
+ border: 'hsl(232, 22%, 20%)',
+ },
+ appHeader: {
+ surface: 'hsl(232, 25%, 12%)',
+ border: 'hsl(232, 22%, 18%)',
+ },
+ responsePane: {
+ surface: 'hsl(232, 25%, 14%)',
+ border: 'hsl(232, 22%, 20%)',
+ },
+ button: {
+ primary: 'hsl(266, 100%, 71%)',
+ info: 'hsl(217, 100%, 66%)',
+ success: 'hsl(158, 57%, 56%)',
+ notice: 'hsl(40, 67%, 58%)',
+ warning: 'hsl(25, 75%, 52%)',
+ danger: 'hsl(358, 100%, 63%)',
+ },
+ },
+};
+
+export const tokyoNightDay: Theme = {
+ id: 'tokyo-night-day',
+ label: 'Tokyo Night Day',
+ dark: false,
+ base: {
+ surface: 'hsl(212, 100%, 98%)',
+ surfaceHighlight: 'hsl(212, 60%, 93%)',
+ text: 'hsl(233, 26%, 27%)',
+ textSubtle: 'hsl(232, 18%, 45%)',
+ textSubtlest: 'hsl(232, 12%, 55%)',
+ primary: 'hsl(290, 80%, 45%)',
+ secondary: 'hsl(232, 18%, 50%)',
+ info: 'hsl(217, 88%, 52%)',
+ success: 'hsl(160, 75%, 35%)',
+ notice: 'hsl(41, 80%, 40%)',
+ warning: 'hsl(20, 80%, 48%)',
+ danger: 'hsl(359, 65%, 48%)',
+ },
+ components: {
+ sidebar: {
+ surface: 'hsl(212, 60%, 95%)',
+ border: 'hsl(212, 40%, 88%)',
+ },
+ appHeader: {
+ surface: 'hsl(212, 60%, 93%)',
+ border: 'hsl(212, 40%, 86%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/triangle.ts b/plugins/themes-yaak/src/themes/triangle.ts
new file mode 100644
index 00000000..c3434d3a
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/triangle.ts
@@ -0,0 +1,44 @@
+import type { Theme } from '@yaakapp/api';
+
+export const triangle: Theme = {
+ id: 'triangle',
+ dark: true,
+ label: 'Triangle',
+ base: {
+ surface: 'rgb(0,0,0)',
+ surfaceHighlight: 'rgb(21,21,21)',
+ surfaceActive: 'rgb(31,31,31)',
+ text: 'rgb(237,237,237)',
+ textSubtle: 'rgb(161,161,161)',
+ textSubtlest: 'rgb(115,115,115)',
+ border: 'rgb(31,31,31)',
+ primary: 'rgb(196,114,251)',
+ secondary: 'rgb(161,161,161)',
+ info: 'rgb(71,168,255)',
+ success: 'rgb(0,202,81)',
+ notice: 'rgb(255,175,0)',
+ warning: '#FF4C8D',
+ danger: '#fd495a',
+ },
+ components: {
+ editor: {
+ danger: '#FF4C8D',
+ warning: '#fd495a',
+ },
+ dialog: {
+ surface: 'rgb(10,10,10)',
+ border: 'rgb(31,31,31)',
+ },
+ sidebar: {
+ border: 'rgb(31,31,31)',
+ },
+ responsePane: {
+ surface: 'rgb(10,10,10)',
+ border: 'rgb(31,31,31)',
+ },
+ appHeader: {
+ surface: 'rgb(10,10,10)',
+ border: 'rgb(31,31,31)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/vitesse.ts b/plugins/themes-yaak/src/themes/vitesse.ts
new file mode 100644
index 00000000..6f5b4391
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/vitesse.ts
@@ -0,0 +1,77 @@
+import type { Theme } from '@yaakapp/api';
+
+export const vitesseDark: Theme = {
+ id: 'vitesse-dark',
+ label: 'Vitesse Dark',
+ dark: true,
+ base: {
+ surface: 'hsl(220, 13%, 10%)',
+ surfaceHighlight: 'hsl(220, 12%, 15%)',
+ text: 'hsl(220, 10%, 80%)',
+ textSubtle: 'hsl(220, 8%, 55%)',
+ textSubtlest: 'hsl(220, 6%, 42%)',
+ primary: 'hsl(143, 50%, 55%)',
+ secondary: 'hsl(220, 8%, 55%)',
+ info: 'hsl(214, 60%, 65%)',
+ success: 'hsl(143, 50%, 55%)',
+ notice: 'hsl(45, 65%, 65%)',
+ warning: 'hsl(30, 60%, 60%)',
+ danger: 'hsl(355, 60%, 60%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(220, 13%, 7%)',
+ },
+ sidebar: {
+ surface: 'hsl(220, 12%, 8%)',
+ border: 'hsl(220, 10%, 14%)',
+ },
+ appHeader: {
+ surface: 'hsl(220, 13%, 6%)',
+ border: 'hsl(220, 10%, 12%)',
+ },
+ responsePane: {
+ surface: 'hsl(220, 12%, 8%)',
+ border: 'hsl(220, 10%, 14%)',
+ },
+ button: {
+ primary: 'hsl(143, 50%, 48%)',
+ secondary: 'hsl(220, 8%, 48%)',
+ info: 'hsl(214, 60%, 58%)',
+ success: 'hsl(143, 50%, 48%)',
+ notice: 'hsl(45, 65%, 58%)',
+ warning: 'hsl(30, 60%, 53%)',
+ danger: 'hsl(355, 60%, 53%)',
+ },
+ },
+};
+
+export const vitesseLight: Theme = {
+ id: 'vitesse-light',
+ label: 'Vitesse Light',
+ dark: false,
+ base: {
+ surface: 'hsl(0, 0%, 100%)',
+ surfaceHighlight: 'hsl(40, 20%, 96%)',
+ text: 'hsl(0, 0%, 24%)',
+ textSubtle: 'hsl(0, 0%, 45%)',
+ textSubtlest: 'hsl(0, 0%, 55%)',
+ primary: 'hsl(143, 40%, 40%)',
+ secondary: 'hsl(0, 0%, 45%)',
+ info: 'hsl(214, 50%, 48%)',
+ success: 'hsl(143, 40%, 40%)',
+ notice: 'hsl(40, 60%, 42%)',
+ warning: 'hsl(25, 60%, 48%)',
+ danger: 'hsl(345, 50%, 48%)',
+ },
+ components: {
+ sidebar: {
+ surface: 'hsl(40, 20%, 97%)',
+ border: 'hsl(40, 15%, 92%)',
+ },
+ appHeader: {
+ surface: 'hsl(40, 20%, 95%)',
+ border: 'hsl(40, 15%, 90%)',
+ },
+ },
+};
diff --git a/plugins/themes-yaak/src/themes/winter-is-coming.ts b/plugins/themes-yaak/src/themes/winter-is-coming.ts
new file mode 100644
index 00000000..91025041
--- /dev/null
+++ b/plugins/themes-yaak/src/themes/winter-is-coming.ts
@@ -0,0 +1,47 @@
+import type { Theme } from '@yaakapp/api';
+
+export const winterIsComing: Theme = {
+ id: 'winter-is-coming',
+ label: 'Winter is Coming',
+ dark: true,
+ base: {
+ surface: 'hsl(216, 50%, 10%)',
+ surfaceHighlight: 'hsl(216, 40%, 15%)',
+ text: 'hsl(210, 20%, 88%)',
+ textSubtle: 'hsl(210, 15%, 60%)',
+ textSubtlest: 'hsl(210, 10%, 45%)',
+ primary: 'hsl(176, 85%, 60%)',
+ secondary: 'hsl(210, 15%, 60%)',
+ info: 'hsl(210, 65%, 65%)',
+ success: 'hsl(100, 65%, 55%)',
+ notice: 'hsl(45, 100%, 65%)',
+ warning: 'hsl(30, 90%, 55%)',
+ danger: 'hsl(350, 100%, 65%)',
+ },
+ components: {
+ dialog: {
+ surface: 'hsl(216, 50%, 7%)',
+ },
+ sidebar: {
+ surface: 'hsl(216, 45%, 12%)',
+ border: 'hsl(216, 40%, 17%)',
+ },
+ appHeader: {
+ surface: 'hsl(216, 50%, 8%)',
+ border: 'hsl(216, 40%, 14%)',
+ },
+ responsePane: {
+ surface: 'hsl(216, 45%, 12%)',
+ border: 'hsl(216, 40%, 17%)',
+ },
+ button: {
+ primary: 'hsl(176, 85%, 53%)',
+ secondary: 'hsl(210, 15%, 53%)',
+ info: 'hsl(210, 65%, 58%)',
+ success: 'hsl(100, 65%, 48%)',
+ notice: 'hsl(45, 100%, 58%)',
+ warning: 'hsl(30, 90%, 48%)',
+ danger: 'hsl(350, 100%, 58%)',
+ },
+ },
+};
diff --git a/src-web/components/Workspace.tsx b/src-web/components/Workspace.tsx
index 196348ee..35b7286a 100644
--- a/src-web/components/Workspace.tsx
+++ b/src-web/components/Workspace.tsx
@@ -185,7 +185,7 @@ export function Workspace() {
/>