Added Catppuccin Themes (#30)

* Added Themes

* Added preview

* Delete previews/catppuccin-mocha_preview.png

* Delete previews/catppuccin-macchiato_preview.png

* Delete previews/catppuccin-frappe_preview.png

* Delete previews/catppuccin-latte_preview.png

* Added Preview

* Update manifest.json

* Update manifest.json

* [CI] Updated README.md.

* Delete previews/catppuccin-frappe.png

* Delete previews/catppuccin-latte.png

* Delete previews/catppuccin-macchiato.png

* Delete previews/catppuccin-mocha.png

* Update manifest.json

* Update manifest.json

* [CI] Updated README.md.

---------

Co-authored-by: Github Actions <>

10 files changed, 279 insertions, 45 deletions

diff --git a/README.md b/README.md
index 9414706..f19ded5 100644
--- a/README.md
+++ b/README.md
@@ -39,51 +39,55 @@ do not bother modifying it.*
 
 ## Dark
 
-| Theme                                                               | Preview                                                          |
-| ------------------------------------------------------------------- | ---------------------------------------------------------------- |
-| [`abyss`](colors/abyss.lua?raw=1)                                   | ![abyss_preview](previews/abyss.svg)                             |
-| [`ayu-dark`](https://github.com/juliardi/lite-xl-ayu-theme.git)\*   | ![ayu-dark_preview](previews/ayu-dark.svg)                       |
-| [`ayu-mirage`](https://github.com/juliardi/lite-xl-ayu-theme.git)\* | ![ayu-mirage_preview](previews/ayu-mirage.svg)                   |
-| [`betelgeuse`](colors/betelgeuse.lua?raw=1)                         | ![betelgeuse_preview](previews/betelgeuse.svg)                   |
-| [`c0mfy`](colors/c0mfy.lua?raw=1)                                   | ![c0mfy_preview](previews/c0mfy.svg)                             |
-| [`cold_lime`](colors/cold_lime.lua?raw=1)                           | ![cold_lime_preview](previews/cold_lime.svg)                     |
-| [`dracula`](colors/dracula.lua?raw=1)                               | ![dracula_preview](previews/dracula.svg)                         |
-| [`duorand`](colors/duorand.lua?raw=1)                               | ![duorand_preview](previews/duorand.svg)                         |
-| [`duotone`](colors/duotone.lua?raw=1)                               | ![duotone_preview](previews/duotone.svg)                         |
-| [`everforest`](colors/everforest.lua?raw=1)                         | ![everforest_preview](previews/everforest.svg)                   |
-| [`flexoki_dark`](colors/flexoki_dark.lua?raw=1)                     | ![flexoki_dark_preview](previews/flexoki_dark.svg)               |
-| [`github-dark-dimmed`](colors/github-dark-dimmed.lua?raw=1)         | ![github-dark-dimmed_preview](previews/github-dark-dimmed.svg)   |
-| [`github_dark`](colors/github_dark.lua?raw=1)                       | ![github_dark_preview](previews/github_dark.svg)                 |
-| [`gruvbox_dark`](colors/gruvbox_dark.lua?raw=1)                     | ![gruvbox_dark_preview](previews/gruvbox_dark.svg)               |
-| [`jb-fleet`](colors/jb-fleet.lua?raw=1)                             | ![jb-fleet_preview](previews/jb-fleet.svg)                       |
-| [`jellybeans`](colors/jellybeans.lua?raw=1)                         | ![jellybeans_preview](previews/jellybeans.svg)                   |
-| [`liqube`](colors/liqube.lua?raw=1)                                 | ![liqube_preview](previews/liqube.svg)                           |
-| [`mariana`](colors/mariana.lua?raw=1)                               | ![mariana_preview](previews/mariana.svg)                         |
-| [`monodark`](colors/monodark.lua?raw=1)                             | ![monodark_preview](previews/monodark.svg)                       |
-| [`monokai`](colors/monokai.lua?raw=1)                               | ![monokai_preview](previews/monokai.svg)                         |
-| [`monokai-pro-classic`](colors/monokai-pro-classic.lua?raw=1)       | ![monokai-pro-classic_preview](previews/monokai-pro-classic.svg) |
-| [`monokai-sublime`](colors/monokai-sublime.lua?raw=1)               | ![monokai-sublime_preview](previews/monokai-sublime.svg)         |
-| [`nord`](colors/nord.lua?raw=1)                                     | ![nord_preview](previews/nord.svg)                               |
-| [`onedark`](colors/onedark.lua?raw=1)                               | ![onedark_preview](previews/onedark.svg)                         |
-| [`only_dark`](colors/only_dark.lua?raw=1)                           | ![only_dark_preview](previews/only_dark.svg)                     |
-| [`plasma`](colors/plasma.lua?raw=1)                                 | ![plasma_preview](previews/plasma.svg)                           |
-| [`rose-pine`](colors/rose-pine.lua?raw=1)                           | ![rose-pine_preview](previews/rose-pine.svg)                     |
-| [`rose-pine-moon`](colors/rose-pine-moon.lua?raw=1)                 | ![rose-pine-moon_preview](previews/rose-pine-moon.svg)           |
-| [`synthwave`](colors/synthwave.lua?raw=1)                           | ![synthwave_preview](previews/synthwave.svg)                     |
-| [`tokyo-night`](colors/tokyo-night.lua?raw=1)                       | ![tokyo-night_preview](previews/tokyo-night.svg)                 |
-| [`vscode-dark`](colors/vscode-dark.lua?raw=1)                       | ![vscode-dark_preview](previews/vscode-dark.svg)                 |
-| [`winter`](colors/winter.lua?raw=1)                                 | ![winter_preview](previews/winter.svg)                           |
-| [`zenburn`](colors/zenburn.lua?raw=1)                               | ![zenburn_preview](previews/zenburn.svg)                         |
+| Theme                                                               | Preview                                                            |
+| ------------------------------------------------------------------- | ------------------------------------------------------------------ |
+| [`abyss`](colors/abyss.lua?raw=1)                                   | ![abyss_preview](previews/abyss.svg)                               |
+| [`ayu-dark`](https://github.com/juliardi/lite-xl-ayu-theme.git)\*   | ![ayu-dark_preview](previews/ayu-dark.svg)                         |
+| [`ayu-mirage`](https://github.com/juliardi/lite-xl-ayu-theme.git)\* | ![ayu-mirage_preview](previews/ayu-mirage.svg)                     |
+| [`betelgeuse`](colors/betelgeuse.lua?raw=1)                         | ![betelgeuse_preview](previews/betelgeuse.svg)                     |
+| [`c0mfy`](colors/c0mfy.lua?raw=1)                                   | ![c0mfy_preview](previews/c0mfy.svg)                               |
+| [`catppuccin-frappe`](colors/catppuccin-frappe.lua?raw=1)           | ![catppuccin-frappe_preview](previews/catppuccin-frappe.svg)       |
+| [`catppuccin-macchiato`](colors/catppuccin-macchiato.lua?raw=1)     | ![catppuccin-macchiato_preview](previews/catppuccin-macchiato.svg) |
+| [`catppuccin-mocha`](colors/catppuccin-mocha.lua?raw=1)             | ![catppuccin-mocha_preview](previews/catppuccin-mocha.svg)         |
+| [`cold_lime`](colors/cold_lime.lua?raw=1)                           | ![cold_lime_preview](previews/cold_lime.svg)                       |
+| [`dracula`](colors/dracula.lua?raw=1)                               | ![dracula_preview](previews/dracula.svg)                           |
+| [`duorand`](colors/duorand.lua?raw=1)                               | ![duorand_preview](previews/duorand.svg)                           |
+| [`duotone`](colors/duotone.lua?raw=1)                               | ![duotone_preview](previews/duotone.svg)                           |
+| [`everforest`](colors/everforest.lua?raw=1)                         | ![everforest_preview](previews/everforest.svg)                     |
+| [`flexoki_dark`](colors/flexoki_dark.lua?raw=1)                     | ![flexoki_dark_preview](previews/flexoki_dark.svg)                 |
+| [`github-dark-dimmed`](colors/github-dark-dimmed.lua?raw=1)         | ![github-dark-dimmed_preview](previews/github-dark-dimmed.svg)     |
+| [`github_dark`](colors/github_dark.lua?raw=1)                       | ![github_dark_preview](previews/github_dark.svg)                   |
+| [`gruvbox_dark`](colors/gruvbox_dark.lua?raw=1)                     | ![gruvbox_dark_preview](previews/gruvbox_dark.svg)                 |
+| [`jb-fleet`](colors/jb-fleet.lua?raw=1)                             | ![jb-fleet_preview](previews/jb-fleet.svg)                         |
+| [`jellybeans`](colors/jellybeans.lua?raw=1)                         | ![jellybeans_preview](previews/jellybeans.svg)                     |
+| [`liqube`](colors/liqube.lua?raw=1)                                 | ![liqube_preview](previews/liqube.svg)                             |
+| [`mariana`](colors/mariana.lua?raw=1)                               | ![mariana_preview](previews/mariana.svg)                           |
+| [`monodark`](colors/monodark.lua?raw=1)                             | ![monodark_preview](previews/monodark.svg)                         |
+| [`monokai`](colors/monokai.lua?raw=1)                               | ![monokai_preview](previews/monokai.svg)                           |
+| [`monokai-pro-classic`](colors/monokai-pro-classic.lua?raw=1)       | ![monokai-pro-classic_preview](previews/monokai-pro-classic.svg)   |
+| [`monokai-sublime`](colors/monokai-sublime.lua?raw=1)               | ![monokai-sublime_preview](previews/monokai-sublime.svg)           |
+| [`nord`](colors/nord.lua?raw=1)                                     | ![nord_preview](previews/nord.svg)                                 |
+| [`onedark`](colors/onedark.lua?raw=1)                               | ![onedark_preview](previews/onedark.svg)                           |
+| [`only_dark`](colors/only_dark.lua?raw=1)                           | ![only_dark_preview](previews/only_dark.svg)                       |
+| [`plasma`](colors/plasma.lua?raw=1)                                 | ![plasma_preview](previews/plasma.svg)                             |
+| [`rose-pine`](colors/rose-pine.lua?raw=1)                           | ![rose-pine_preview](previews/rose-pine.svg)                       |
+| [`rose-pine-moon`](colors/rose-pine-moon.lua?raw=1)                 | ![rose-pine-moon_preview](previews/rose-pine-moon.svg)             |
+| [`synthwave`](colors/synthwave.lua?raw=1)                           | ![synthwave_preview](previews/synthwave.svg)                       |
+| [`tokyo-night`](colors/tokyo-night.lua?raw=1)                       | ![tokyo-night_preview](previews/tokyo-night.svg)                   |
+| [`vscode-dark`](colors/vscode-dark.lua?raw=1)                       | ![vscode-dark_preview](previews/vscode-dark.svg)                   |
+| [`winter`](colors/winter.lua?raw=1)                                 | ![winter_preview](previews/winter.svg)                             |
+| [`zenburn`](colors/zenburn.lua?raw=1)                               | ![zenburn_preview](previews/zenburn.svg)                           |
 
 ## Light
 
-| Theme                                                              | Preview                                                  |
-| ------------------------------------------------------------------ | -------------------------------------------------------- |
-| [`ayu-light`](https://github.com/juliardi/lite-xl-ayu-theme.git)\* | ![ayu-light_preview](previews/ayu-light.svg)             |
-| [`flexoki_light`](colors/flexoki_light.lua?raw=1)                  | ![flexoki_light_preview](previews/flexoki_light.svg)     |
-| [`github`](colors/github.lua?raw=1)                                | ![github_preview](previews/github.svg)                   |
-| [`gruvbox_light`](colors/gruvbox_light.lua?raw=1)                  | ![gruvbox_light_preview](previews/gruvbox_light.svg)     |
-| [`moe`](colors/moe.lua?raw=1)                                      | ![moe_preview](previews/moe.svg)                         |
-| [`rose-pine-dawn`](colors/rose-pine-dawn.lua?raw=1)                | ![rose-pine-dawn_preview](previews/rose-pine-dawn.svg)   |
-| [`solarized_light`](colors/solarized_light.lua?raw=1)              | ![solarized_light_preview](previews/solarized_light.svg) |
-| [`solarobj`](colors/solarobj.lua?raw=1)                            | ![solarobj_preview](previews/solarobj.svg)               |
+| Theme                                                              | Preview                                                    |
+| ------------------------------------------------------------------ | ---------------------------------------------------------- |
+| [`ayu-light`](https://github.com/juliardi/lite-xl-ayu-theme.git)\* | ![ayu-light_preview](previews/ayu-light.svg)               |
+| [`catppuccin-latte`](colors/catppuccin-latte.lua?raw=1)            | ![catppuccin-latte_preview](previews/catppuccin-latte.svg) |
+| [`flexoki_light`](colors/flexoki_light.lua?raw=1)                  | ![flexoki_light_preview](previews/flexoki_light.svg)       |
+| [`github`](colors/github.lua?raw=1)                                | ![github_preview](previews/github.svg)                     |
+| [`gruvbox_light`](colors/gruvbox_light.lua?raw=1)                  | ![gruvbox_light_preview](previews/gruvbox_light.svg)       |
+| [`moe`](colors/moe.lua?raw=1)                                      | ![moe_preview](previews/moe.svg)                           |
+| [`rose-pine-dawn`](colors/rose-pine-dawn.lua?raw=1)                | ![rose-pine-dawn_preview](previews/rose-pine-dawn.svg)     |
+| [`solarized_light`](colors/solarized_light.lua?raw=1)              | ![solarized_light_preview](previews/solarized_light.svg)   |
+| [`solarobj`](colors/solarobj.lua?raw=1)                            | ![solarobj_preview](previews/solarobj.svg)                 |
diff --git a/colors/catppuccin-frappe.lua b/colors/catppuccin-frappe.lua
new file mode 100644
index 0000000..38c693b
--- /dev/null
+++ b/colors/catppuccin-frappe.lua
@@ -0,0 +1,29 @@
+local style = require "core.style"
+local common = require "core.common"
+
+style.background = { common.color "#303446" }
+style.background2 = { common.color "#292c3c" }
+style.background3 = { common.color "#414559" }
+style.text = { common.color "#c6d0f5" }
+style.caret = { common.color "#f2d5cf" }
+style.accent = { common.color "#ca9ee6" }
+style.dim = { common.color "#b5bfe2" }
+style.divider = { common.color "#ca9ee6" }
+style.selection = { common.color "#626880" }
+style.line_number = { common.color "#737994" }
+style.line_number2 = { common.color "#ca9ee6" }
+style.line_highlight = { common.color "#414559" }
+style.scrollbar = { common.color "#626880" }
+style.scrollbar2 = { common.color "#737994" }
+style.scrollbar_track = { common.color "#292c3c" }
+
+style.syntax["normal"] = { common.color "#e78284" }
+style.syntax["symbol"] = { common.color "#babbf1" }
+style.syntax["comment"] = { common.color "#737994" }
+style.syntax["keyword"] = { common.color "#e78284" }
+style.syntax["keyword2"] = { common.color "#e78284" }
+style.syntax["number"] = { common.color "#ef9f76" }
+style.syntax["literal"] = { common.color "#babbf1" }
+style.syntax["string"] = { common.color "#a6d189" }
+style.syntax["operator"] = { common.color "#99d1db" }
+style.syntax["function"] = { common.color "#8caaee" }
diff --git a/colors/catppuccin-latte.lua b/colors/catppuccin-latte.lua
new file mode 100644
index 0000000..2b906b9
--- /dev/null
+++ b/colors/catppuccin-latte.lua
@@ -0,0 +1,29 @@
+local style = require "core.style"
+local common = require "core.common"
+
+style.background = { common.color "#eff1f5" }
+style.background2 = { common.color "#e6e9ef" }
+style.background3 = { common.color "#ccd0da" }
+style.text = { common.color "#4c4f69" }
+style.caret = { common.color "#dc8a78" }
+style.accent = { common.color "#8839ef" }
+style.dim = { common.color "#5c5f77" }
+style.divider = { common.color "#8839ef" }
+style.selection = { common.color "#bcc0cc" } -- surface1
+style.line_number = { common.color "#9ca0b0" }
+style.line_number2 = { common.color "#8839ef" }
+style.line_highlight = { common.color "#dce0e8" } -- crust
+style.scrollbar = { common.color "#acb0be" }
+style.scrollbar2 = { common.color "#9ca0b0" }
+style.scrollbar_track = { common.color "#dce0e8" } -- crust
+
+style.syntax["normal"] = { common.color "#d20f39" }
+style.syntax["symbol"] = { common.color "#7287fd" }
+style.syntax["comment"] = { common.color "#9ca0b0" }
+style.syntax["keyword"] = { common.color "#d20f39" }
+style.syntax["keyword2"] = { common.color "#d20f39" }
+style.syntax["number"] = { common.color "#fe640b" }
+style.syntax["literal"] = { common.color "#7287fd" }
+style.syntax["string"] = { common.color "#40a02b" }
+style.syntax["operator"] = { common.color "#04a5e5" }
+style.syntax["function"] = { common.color "#1e66f5" }
diff --git a/colors/catppuccin-macchiato.lua b/colors/catppuccin-macchiato.lua
new file mode 100644
index 0000000..4a10116
--- /dev/null
+++ b/colors/catppuccin-macchiato.lua
@@ -0,0 +1,29 @@
+local style = require "core.style"
+local common = require "core.common"
+
+style.background = { common.color "#24273a" }
+style.background2 = { common.color "#1e2030" }
+style.background3 = { common.color "#363a4f" }
+style.text = { common.color "#cad3f5" }
+style.caret = { common.color "#f4dbd6" }
+style.accent = { common.color "#c6a0f6" }
+style.dim = { common.color "#b8c0e0" }
+style.divider = { common.color "#c6a0f6" }
+style.selection = { common.color "#5b6078" }
+style.line_number = { common.color "#6e738d" }
+style.line_number2 = { common.color "#c6a0f6" }
+style.line_highlight = { common.color "#363a4f" }
+style.scrollbar = { common.color "#5b6078" }
+style.scrollbar2 = { common.color "#6e738d" }
+style.scrollbar_track = { common.color "#1e2030" }
+
+style.syntax["normal"] = { common.color "#ed8796" }
+style.syntax["symbol"] = { common.color "#b7bdf8" }
+style.syntax["comment"] = { common.color "#6e738d" }
+style.syntax["keyword"] = { common.color "#ed8796" }
+style.syntax["keyword2"] = { common.color "#076678" }
+style.syntax["number"] = { common.color "#f5a97f" }
+style.syntax["literal"] = { common.color "#b7bdf8" }
+style.syntax["string"] = { common.color "#a6da95" }
+style.syntax["operator"] = { common.color "#91d7e3" }
+style.syntax["function"] = { common.color "#8aadf4" }
diff --git a/colors/catppuccin-mocha.lua b/colors/catppuccin-mocha.lua
new file mode 100644
index 0000000..ecc5829
--- /dev/null
+++ b/colors/catppuccin-mocha.lua
@@ -0,0 +1,28 @@
+local style = require "core.style"
+local common = require "core.common"
+style.background = { common.color "#1e1e2e" } -- base
+style.background2 = { common.color "#181825" } -- mantle
+style.background3 = { common.color "#313244" } -- surface0
+style.text = { common.color "#cdd6f4" } -- text
+style.caret = { common.color "#f5e0dc" } -- rosewater
+style.accent = { common.color "#cba6f7" } -- mauve
+style.dim = { common.color "#bac2de" } -- subtext1
+style.divider = { common.color "#cba6f7" } -- mauve
+style.selection = { common.color "#585b70" } -- surface2
+style.line_number = { common.color "#6c7086" } -- overlay0
+style.line_number2 = { common.color "#cba6f7" } -- mauve
+style.line_highlight = { common.color "#313244" } -- surface0
+style.scrollbar = { common.color "#585b70" } -- surface2
+style.scrollbar2 = { common.color "#6c7086" } -- overlay0
+style.scrollbar_track = { common.color "#181825" } -- mantle
+
+style.syntax["normal"] = { common.color "#f38ba8" } -- red
+style.syntax["symbol"] = { common.color "#b4befe" } -- lavender
+style.syntax["comment"] = { common.color "#6c7086" } -- overlay0
+style.syntax["keyword"] = { common.color "#f38ba8" } -- red
+style.syntax["keyword2"] = { common.color "#f38ba8" } -- red
+style.syntax["number"] = { common.color "#fab387" } -- peach
+style.syntax["literal"] = { common.color "#b4befe" } -- lavender
+style.syntax["string"] = { common.color "#a6e3a1" } -- green
+style.syntax["operator"] = { common.color "#89dceb" } -- sky
+style.syntax["function"] = { common.color "#89b4fa" } -- blue
diff --git a/manifest.json b/manifest.json
index 2e313da..72dffbb 100644
--- a/manifest.json
+++ b/manifest.json
@@ -58,6 +58,50 @@
          "version" : "0.1"
       },
       {
+         "id" : "catppuccin-frappe",
+         "mod_version" : "3.0.0",
+         "name" : "catppuccin-frappe",
+         "path" : "colors/catppuccin-frappe.lua",
+         "tags" : [
+            "dark"
+         ],
+         "type" : "color",
+         "version" : "0.1"
+      },
+      {
+         "id" : "catppuccin-latte",
+         "mod_version" : "3.0.0",
+         "name" : "catppuccin-latte",
+         "path" : "colors/catppuccin-latte.lua",
+         "tags" : [
+            "light"
+         ],
+         "type" : "color",
+         "version" : "0.1"
+      },
+      {
+         "id" : "catppuccin-macchiato",
+         "mod_version" : "3.0.0",
+         "name" : "catppuccin-macchiato",
+         "path" : "colors/catppuccin-macchiato.lua",
+         "tags" : [
+            "dark"
+         ],
+         "type" : "color",
+         "version" : "0.1"
+      },
+      {
+         "id" : "catppuccin-mocha",
+         "mod_version" : "3.0.0",
+         "name" : "catppuccin-mocha",
+         "path" : "colors/catppuccin-mocha.lua",
+         "tags" : [
+            "dark"
+         ],
+         "type" : "color",
+         "version" : "0.1"
+      },
+      {
          "id" : "cold_lime",
          "mod_version" : "3.0.0",
          "name" : "cold_lime",
diff --git a/previews/catppuccin-frappe.svg b/previews/catppuccin-frappe.svg
new file mode 100644
index 0000000..2b2ed14
--- /dev/null
+++ b/previews/catppuccin-frappe.svg
@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="16" shape-rendering="crispEdges"> 
+<rect x="0.0" width="13.333333333333" height="16" fill="rgb(41, 44, 60)"></rect> 
+<rect x="13.333333333333" width="13.333333333333" height="16" fill="rgb(48, 52, 70)"></rect> 
+<rect x="26.666666666667" width="13.333333333333" height="16" fill="rgb(65, 69, 89)"></rect> 
+<rect x="40.0" width="13.333333333333" height="16" fill="rgb(98, 104, 128)"></rect> 
+<rect x="53.333333333333" width="13.333333333333" height="16" fill="rgb(115, 121, 148)"></rect> 
+<rect x="66.666666666667" width="13.333333333333" height="16" fill="rgb(231, 130, 132)"></rect> 
+<rect x="80.0" width="13.333333333333" height="16" fill="rgb(166, 209, 137)"></rect> 
+<rect x="93.333333333333" width="13.333333333333" height="16" fill="rgb(239, 159, 118)"></rect> 
+<rect x="106.66666666667" width="13.333333333333" height="16" fill="rgb(140, 170, 238)"></rect> 
+<rect x="120.0" width="13.333333333333" height="16" fill="rgb(153, 209, 219)"></rect> 
+<rect x="133.33333333333" width="13.333333333333" height="16" fill="rgb(202, 158, 230)"></rect> 
+<rect x="146.66666666667" width="13.333333333333" height="16" fill="rgb(181, 191, 226)"></rect> 
+<rect x="160.0" width="13.333333333333" height="16" fill="rgb(186, 187, 241)"></rect> 
+<rect x="173.33333333333" width="13.333333333333" height="16" fill="rgb(198, 208, 245)"></rect> 
+<rect x="186.66666666667" width="13.333333333333" height="16" fill="rgb(242, 213, 207)"></rect> 
+</svg>
\ No newline at end of file
diff --git a/previews/catppuccin-latte.svg b/previews/catppuccin-latte.svg
new file mode 100644
index 0000000..83fe5c8
--- /dev/null
+++ b/previews/catppuccin-latte.svg
@@ -0,0 +1,19 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="16" shape-rendering="crispEdges"> 
+<rect x="0.0" width="11.764705882353" height="16" fill="rgb(76, 79, 105)"></rect> 
+<rect x="11.764705882353" width="11.764705882353" height="16" fill="rgb(64, 160, 43)"></rect> 
+<rect x="23.529411764706" width="11.764705882353" height="16" fill="rgb(210, 15, 57)"></rect> 
+<rect x="35.294117647059" width="11.764705882353" height="16" fill="rgb(92, 95, 119)"></rect> 
+<rect x="47.058823529412" width="11.764705882353" height="16" fill="rgb(254, 100, 11)"></rect> 
+<rect x="58.823529411765" width="11.764705882353" height="16" fill="rgb(30, 102, 245)"></rect> 
+<rect x="70.588235294118" width="11.764705882353" height="16" fill="rgb(4, 165, 229)"></rect> 
+<rect x="82.352941176471" width="11.764705882353" height="16" fill="rgb(136, 57, 239)"></rect> 
+<rect x="94.117647058824" width="11.764705882353" height="16" fill="rgb(220, 138, 120)"></rect> 
+<rect x="105.88235294118" width="11.764705882353" height="16" fill="rgb(156, 160, 176)"></rect> 
+<rect x="117.64705882353" width="11.764705882353" height="16" fill="rgb(114, 135, 253)"></rect> 
+<rect x="129.41176470588" width="11.764705882353" height="16" fill="rgb(172, 176, 190)"></rect> 
+<rect x="141.17647058824" width="11.764705882353" height="16" fill="rgb(188, 192, 204)"></rect> 
+<rect x="152.94117647059" width="11.764705882353" height="16" fill="rgb(204, 208, 218)"></rect> 
+<rect x="164.70588235294" width="11.764705882353" height="16" fill="rgb(220, 224, 232)"></rect> 
+<rect x="176.47058823529" width="11.764705882353" height="16" fill="rgb(230, 233, 239)"></rect> 
+<rect x="188.23529411765" width="11.764705882353" height="16" fill="rgb(239, 241, 245)"></rect> 
+</svg>
\ No newline at end of file
diff --git a/previews/catppuccin-macchiato.svg b/previews/catppuccin-macchiato.svg
new file mode 100644
index 0000000..986893e
--- /dev/null
+++ b/previews/catppuccin-macchiato.svg
@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="16" shape-rendering="crispEdges"> 
+<rect x="0.0" width="12.5" height="16" fill="rgb(30, 32, 48)"></rect> 
+<rect x="12.5" width="12.5" height="16" fill="rgb(36, 39, 58)"></rect> 
+<rect x="25.0" width="12.5" height="16" fill="rgb(54, 58, 79)"></rect> 
+<rect x="37.5" width="12.5" height="16" fill="rgb(7, 102, 120)"></rect> 
+<rect x="50.0" width="12.5" height="16" fill="rgb(91, 96, 120)"></rect> 
+<rect x="62.5" width="12.5" height="16" fill="rgb(110, 115, 141)"></rect> 
+<rect x="75.0" width="12.5" height="16" fill="rgb(237, 135, 150)"></rect> 
+<rect x="87.5" width="12.5" height="16" fill="rgb(166, 218, 149)"></rect> 
+<rect x="100.0" width="12.5" height="16" fill="rgb(245, 169, 127)"></rect> 
+<rect x="112.5" width="12.5" height="16" fill="rgb(138, 173, 244)"></rect> 
+<rect x="125.0" width="12.5" height="16" fill="rgb(145, 215, 227)"></rect> 
+<rect x="137.5" width="12.5" height="16" fill="rgb(184, 192, 224)"></rect> 
+<rect x="150.0" width="12.5" height="16" fill="rgb(198, 160, 246)"></rect> 
+<rect x="162.5" width="12.5" height="16" fill="rgb(183, 189, 248)"></rect> 
+<rect x="175.0" width="12.5" height="16" fill="rgb(202, 211, 245)"></rect> 
+<rect x="187.5" width="12.5" height="16" fill="rgb(244, 219, 214)"></rect> 
+</svg>
\ No newline at end of file
diff --git a/previews/catppuccin-mocha.svg b/previews/catppuccin-mocha.svg
new file mode 100644
index 0000000..a4fa551
--- /dev/null
+++ b/previews/catppuccin-mocha.svg
@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="16" shape-rendering="crispEdges"> 
+<rect x="0.0" width="13.333333333333" height="16" fill="rgb(24, 24, 37)"></rect> 
+<rect x="13.333333333333" width="13.333333333333" height="16" fill="rgb(30, 30, 46)"></rect> 
+<rect x="26.666666666667" width="13.333333333333" height="16" fill="rgb(49, 50, 68)"></rect> 
+<rect x="40.0" width="13.333333333333" height="16" fill="rgb(88, 91, 112)"></rect> 
+<rect x="53.333333333333" width="13.333333333333" height="16" fill="rgb(108, 112, 134)"></rect> 
+<rect x="66.666666666667" width="13.333333333333" height="16" fill="rgb(243, 139, 168)"></rect> 
+<rect x="80.0" width="13.333333333333" height="16" fill="rgb(166, 227, 161)"></rect> 
+<rect x="93.333333333333" width="13.333333333333" height="16" fill="rgb(250, 179, 135)"></rect> 
+<rect x="106.66666666667" width="13.333333333333" height="16" fill="rgb(137, 180, 250)"></rect> 
+<rect x="120.0" width="13.333333333333" height="16" fill="rgb(137, 220, 235)"></rect> 
+<rect x="133.33333333333" width="13.333333333333" height="16" fill="rgb(186, 194, 222)"></rect> 
+<rect x="146.66666666667" width="13.333333333333" height="16" fill="rgb(203, 166, 247)"></rect> 
+<rect x="160.0" width="13.333333333333" height="16" fill="rgb(180, 190, 254)"></rect> 
+<rect x="173.33333333333" width="13.333333333333" height="16" fill="rgb(205, 214, 244)"></rect> 
+<rect x="186.66666666667" width="13.333333333333" height="16" fill="rgb(245, 224, 220)"></rect> 
+</svg>
\ No newline at end of file