yaak-mountain-loop/plugins/themes-yaak/src/themes/catppuccin.ts

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%)",
    },
  },
};