diff --git a/styles/src/buildLicenses.ts b/styles/src/buildLicenses.ts
index 793a14a3b2..3367e50ff0 100644
--- a/styles/src/buildLicenses.ts
+++ b/styles/src/buildLicenses.ts
@@ -39,7 +39,7 @@ function getLicenseText(
         if (typeof meta.license.license_text == "string") {
             callback(meta, meta.license.license_text)
         } else {
-            let license_text_obj: Verification = meta.license.license_text;
+            let license_text_obj: Verification = meta.license.license_text
             // The following copied from the example code on nodejs.org:
             // https://nodejs.org/api/http.html#httpgetoptions-callback
             https
diff --git a/styles/src/styleTree/editor.ts b/styles/src/styleTree/editor.ts
index 799363a349..64a19d714f 100644
--- a/styles/src/styleTree/editor.ts
+++ b/styles/src/styleTree/editor.ts
@@ -90,7 +90,7 @@ export default function editor(colorScheme: ColorScheme) {
                     clicked: {
                         color: colorScheme.ramps.neutral(0.5).alpha(0.7).hex(),
                     },
-                }
+                },
             },
             foldBackground: foreground(layer, "variant"),
         },
diff --git a/styles/src/themes/andromeda.ts b/styles/src/themes/andromeda.ts
index 369f1d7f2b..7eba7b1481 100644
--- a/styles/src/themes/andromeda.ts
+++ b/styles/src/themes/andromeda.ts
@@ -39,7 +39,7 @@ export const meta: Meta = {
                 "https://raw.githubusercontent.com/EliverLara/Andromeda/master/LICENSE.md",
             license_checksum:
                 "2f7886f1a05cefc2c26f5e49de1a39fa4466413c1ccb06fc80960e73f5ed4b89",
-        }
+        },
     },
     url: "https://github.com/EliverLara/Andromeda",
 }
diff --git a/styles/src/themes/atelier-cave-dark.ts b/styles/src/themes/atelier-cave-dark.ts
new file mode 100644
index 0000000000..a56e22cd92
--- /dev/null
+++ b/styles/src/themes/atelier-cave-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Cave Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/cave/",
+    },
+    colors: {
+        base00: "#19171c",
+        base01: "#26232a",
+        base02: "#585260",
+        base03: "#655f6d",
+        base04: "#7e7887",
+        base05: "#8b8792",
+        base06: "#e2dfe7",
+        base07: "#efecf4",
+        base08: "#be4678",
+        base09: "#aa573c",
+        base0A: "#a06e3b",
+        base0B: "#2a9292",
+        base0C: "#398bc6",
+        base0D: "#576ddb",
+        base0E: "#955ae7",
+        base0F: "#bf40bf",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-cave-light.ts b/styles/src/themes/atelier-cave-light.ts
new file mode 100644
index 0000000000..3b180752cf
--- /dev/null
+++ b/styles/src/themes/atelier-cave-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Cave Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/cave/",
+    },
+    colors: {
+        base00: "#efecf4",
+        base01: "#e2dfe7",
+        base02: "#8b8792",
+        base03: "#7e7887",
+        base04: "#655f6d",
+        base05: "#585260",
+        base06: "#26232a",
+        base07: "#19171c",
+        base08: "#be4678",
+        base09: "#aa573c",
+        base0A: "#a06e3b",
+        base0B: "#2a9292",
+        base0C: "#398bc6",
+        base0D: "#576ddb",
+        base0E: "#955ae7",
+        base0F: "#bf40bf",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-cave.ts b/styles/src/themes/atelier-cave.ts
deleted file mode 100644
index 21b846d708..0000000000
--- a/styles/src/themes/atelier-cave.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-import chroma from "chroma-js"
-import { Meta } from "./common/colorScheme"
-import { colorRamp, createColorScheme } from "./common/ramps"
-
-const name = "Atelier Cave"
-
-export const dark = createColorScheme(`${name} Dark`, false, {
-    neutral: chroma
-        .scale([
-            "#19171c",
-            "#26232a",
-            "#585260",
-            "#655f6d",
-            "#7e7887",
-            "#8b8792",
-            "#e2dfe7",
-            "#efecf4",
-        ])
-        .domain([0, 0.15, 0.45, 0.6, 0.65, 0.7, 0.85, 1]),
-    red: colorRamp(chroma("#be4678")),
-    orange: colorRamp(chroma("#aa573c")),
-    yellow: colorRamp(chroma("#a06e3b")),
-    green: colorRamp(chroma("#2a9292")),
-    cyan: colorRamp(chroma("#398bc6")),
-    blue: colorRamp(chroma("#576ddb")),
-    violet: colorRamp(chroma("#955ae7")),
-    magenta: colorRamp(chroma("#bf40bf")),
-})
-
-export const light = createColorScheme(`${name} Light`, true, {
-    neutral: chroma
-        .scale([
-            "#19171c",
-            "#26232a",
-            "#585260",
-            "#655f6d",
-            "#7e7887",
-            "#8b8792",
-            "#e2dfe7",
-            "#efecf4",
-        ])
-        .correctLightness(),
-    red: colorRamp(chroma("#be4678")),
-    orange: colorRamp(chroma("#aa573c")),
-    yellow: colorRamp(chroma("#a06e3b")),
-    green: colorRamp(chroma("#2a9292")),
-    cyan: colorRamp(chroma("#398bc6")),
-    blue: colorRamp(chroma("#576ddb")),
-    violet: colorRamp(chroma("#955ae7")),
-    magenta: colorRamp(chroma("#bf40bf")),
-})
-
-export const meta: Meta = {
-    name,
-    author: "atelierbram",
-    license: {
-        SPDX: "MIT",
-        license_text: {
-            https_url: "https://atelierbram.mit-license.org/license.txt",
-            license_checksum:
-                "f95ce526ef4e7eecf7a832bba0e3451cc1000f9ce63eb01ed6f64f8109f5d0a5",
-        }
-    },
-    url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/cave/",
-}
diff --git a/styles/src/themes/atelier-dune-dark.ts b/styles/src/themes/atelier-dune-dark.ts
new file mode 100644
index 0000000000..0ab402a99d
--- /dev/null
+++ b/styles/src/themes/atelier-dune-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Dune Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune/",
+    },
+    colors: {
+        base00: "#20201d",
+        base01: "#292824",
+        base02: "#6e6b5e",
+        base03: "#7d7a68",
+        base04: "#999580",
+        base05: "#a6a28c",
+        base06: "#e8e4cf",
+        base07: "#fefbec",
+        base08: "#d73737",
+        base09: "#b65611",
+        base0A: "#ae9513",
+        base0B: "#60ac39",
+        base0C: "#1fad83",
+        base0D: "#6684e1",
+        base0E: "#b854d4",
+        base0F: "#d43552",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-dune-light.ts b/styles/src/themes/atelier-dune-light.ts
new file mode 100644
index 0000000000..e6a09985d5
--- /dev/null
+++ b/styles/src/themes/atelier-dune-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Dune Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune/",
+    },
+    colors: {
+        base00: "#fefbec",
+        base01: "#e8e4cf",
+        base02: "#a6a28c",
+        base03: "#999580",
+        base04: "#7d7a68",
+        base05: "#6e6b5e",
+        base06: "#292824",
+        base07: "#20201d",
+        base08: "#d73737",
+        base09: "#b65611",
+        base0A: "#ae9513",
+        base0B: "#60ac39",
+        base0C: "#1fad83",
+        base0D: "#6684e1",
+        base0E: "#b854d4",
+        base0F: "#d43552",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-estuary-dark.ts b/styles/src/themes/atelier-estuary-dark.ts
new file mode 100644
index 0000000000..c4ec50c1e0
--- /dev/null
+++ b/styles/src/themes/atelier-estuary-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Estuary Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/estuary/",
+    },
+    colors: {
+        base00: "#22221b",
+        base01: "#302f27",
+        base02: "#5f5e4e",
+        base03: "#6c6b5a",
+        base04: "#878573",
+        base05: "#929181",
+        base06: "#e7e6df",
+        base07: "#f4f3ec",
+        base08: "#ba6236",
+        base09: "#ae7313",
+        base0A: "#a5980d",
+        base0B: "#7d9726",
+        base0C: "#5b9d48",
+        base0D: "#36a166",
+        base0E: "#5f9182",
+        base0F: "#9d6c7c",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-estuary-light.ts b/styles/src/themes/atelier-estuary-light.ts
new file mode 100644
index 0000000000..6fce0e4483
--- /dev/null
+++ b/styles/src/themes/atelier-estuary-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Estuary Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/estuary/",
+    },
+    colors: {
+        base00: "#f4f3ec",
+        base01: "#e7e6df",
+        base02: "#929181",
+        base03: "#878573",
+        base04: "#6c6b5a",
+        base05: "#5f5e4e",
+        base06: "#302f27",
+        base07: "#22221b",
+        base08: "#ba6236",
+        base09: "#ae7313",
+        base0A: "#a5980d",
+        base0B: "#7d9726",
+        base0C: "#5b9d48",
+        base0D: "#36a166",
+        base0E: "#5f9182",
+        base0F: "#9d6c7c",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-forest-dark.ts b/styles/src/themes/atelier-forest-dark.ts
new file mode 100644
index 0000000000..7c47c55a83
--- /dev/null
+++ b/styles/src/themes/atelier-forest-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Forest Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/forest/",
+    },
+    colors: {
+        base00: "#1b1918",
+        base01: "#2c2421",
+        base02: "#68615e",
+        base03: "#766e6b",
+        base04: "#9c9491",
+        base05: "#a8a19f",
+        base06: "#e6e2e0",
+        base07: "#f1efee",
+        base08: "#f22c40",
+        base09: "#df5320",
+        base0A: "#c38418",
+        base0B: "#7b9726",
+        base0C: "#3d97b8",
+        base0D: "#407ee7",
+        base0E: "#6666ea",
+        base0F: "#c33ff3",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-forest-light.ts b/styles/src/themes/atelier-forest-light.ts
new file mode 100644
index 0000000000..8ce0616476
--- /dev/null
+++ b/styles/src/themes/atelier-forest-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Forest Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/forest/",
+    },
+    colors: {
+        base00: "#f1efee",
+        base01: "#e6e2e0",
+        base02: "#a8a19f",
+        base03: "#9c9491",
+        base04: "#766e6b",
+        base05: "#68615e",
+        base06: "#2c2421",
+        base07: "#1b1918",
+        base08: "#f22c40",
+        base09: "#df5320",
+        base0A: "#c38418",
+        base0B: "#7b9726",
+        base0C: "#3d97b8",
+        base0D: "#407ee7",
+        base0E: "#6666ea",
+        base0F: "#c33ff3",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-heath-dark.ts b/styles/src/themes/atelier-heath-dark.ts
new file mode 100644
index 0000000000..87458ab8f5
--- /dev/null
+++ b/styles/src/themes/atelier-heath-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Heath Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/heath/",
+    },
+    colors: {
+        base00: "#1b181b",
+        base01: "#292329",
+        base02: "#695d69",
+        base03: "#776977",
+        base04: "#9e8f9e",
+        base05: "#ab9bab",
+        base06: "#d8cad8",
+        base07: "#f7f3f7",
+        base08: "#ca402b",
+        base09: "#a65926",
+        base0A: "#bb8a35",
+        base0B: "#918b3b",
+        base0C: "#159393",
+        base0D: "#516aec",
+        base0E: "#7b59c0",
+        base0F: "#cc33cc",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-heath-light.ts b/styles/src/themes/atelier-heath-light.ts
new file mode 100644
index 0000000000..3db3437041
--- /dev/null
+++ b/styles/src/themes/atelier-heath-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Heath Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/heath/",
+    },
+    colors: {
+        base00: "#f7f3f7",
+        base01: "#d8cad8",
+        base02: "#ab9bab",
+        base03: "#9e8f9e",
+        base04: "#776977",
+        base05: "#695d69",
+        base06: "#292329",
+        base07: "#1b181b",
+        base08: "#ca402b",
+        base09: "#a65926",
+        base0A: "#bb8a35",
+        base0B: "#918b3b",
+        base0C: "#159393",
+        base0D: "#516aec",
+        base0E: "#7b59c0",
+        base0F: "#cc33cc",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-lakeside-dark.ts b/styles/src/themes/atelier-lakeside-dark.ts
new file mode 100644
index 0000000000..a8297ef9fd
--- /dev/null
+++ b/styles/src/themes/atelier-lakeside-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Lakeside Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/lakeside/",
+    },
+    colors: {
+        base00: "#161b1d",
+        base01: "#1f292e",
+        base02: "#516d7b",
+        base03: "#5a7b8c",
+        base04: "#7195a8",
+        base05: "#7ea2b4",
+        base06: "#c1e4f6",
+        base07: "#ebf8ff",
+        base08: "#d22d72",
+        base09: "#935c25",
+        base0A: "#8a8a0f",
+        base0B: "#568c3b",
+        base0C: "#2d8f6f",
+        base0D: "#257fad",
+        base0E: "#6b6bb8",
+        base0F: "#b72dd2",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-lakeside-light.ts b/styles/src/themes/atelier-lakeside-light.ts
new file mode 100644
index 0000000000..408fabcaf3
--- /dev/null
+++ b/styles/src/themes/atelier-lakeside-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Lakeside Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/lakeside/",
+    },
+    colors: {
+        base00: "#ebf8ff",
+        base01: "#c1e4f6",
+        base02: "#7ea2b4",
+        base03: "#7195a8",
+        base04: "#5a7b8c",
+        base05: "#516d7b",
+        base06: "#1f292e",
+        base07: "#161b1d",
+        base08: "#d22d72",
+        base09: "#935c25",
+        base0A: "#8a8a0f",
+        base0B: "#568c3b",
+        base0C: "#2d8f6f",
+        base0D: "#257fad",
+        base0E: "#6b6bb8",
+        base0F: "#b72dd2",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-plateau-dark.ts b/styles/src/themes/atelier-plateau-dark.ts
new file mode 100644
index 0000000000..731cb824e4
--- /dev/null
+++ b/styles/src/themes/atelier-plateau-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Plateau Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/plateau/",
+    },
+    colors: {
+        base00: "#1b1818",
+        base01: "#292424",
+        base02: "#585050",
+        base03: "#655d5d",
+        base04: "#7e7777",
+        base05: "#8a8585",
+        base06: "#e7dfdf",
+        base07: "#f4ecec",
+        base08: "#ca4949",
+        base09: "#b45a3c",
+        base0A: "#a06e3b",
+        base0B: "#4b8b8b",
+        base0C: "#5485b6",
+        base0D: "#7272ca",
+        base0E: "#8464c4",
+        base0F: "#bd5187",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-plateau-light.ts b/styles/src/themes/atelier-plateau-light.ts
new file mode 100644
index 0000000000..96f295a695
--- /dev/null
+++ b/styles/src/themes/atelier-plateau-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Plateau Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/plateau/",
+    },
+    colors: {
+        base00: "#f4ecec",
+        base01: "#e7dfdf",
+        base02: "#8a8585",
+        base03: "#7e7777",
+        base04: "#655d5d",
+        base05: "#585050",
+        base06: "#292424",
+        base07: "#1b1818",
+        base08: "#ca4949",
+        base09: "#b45a3c",
+        base0A: "#a06e3b",
+        base0B: "#4b8b8b",
+        base0C: "#5485b6",
+        base0D: "#7272ca",
+        base0E: "#8464c4",
+        base0F: "#bd5187",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-savanna-dark.ts b/styles/src/themes/atelier-savanna-dark.ts
new file mode 100644
index 0000000000..dfcb4f27cb
--- /dev/null
+++ b/styles/src/themes/atelier-savanna-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Savanna Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/savanna/",
+    },
+    colors: {
+        base00: "#171c19",
+        base01: "#232a25",
+        base02: "#526057",
+        base03: "#5f6d64",
+        base04: "#78877d",
+        base05: "#87928a",
+        base06: "#dfe7e2",
+        base07: "#ecf4ee",
+        base08: "#b16139",
+        base09: "#9f713c",
+        base0A: "#a07e3b",
+        base0B: "#489963",
+        base0C: "#1c9aa0",
+        base0D: "#478c90",
+        base0E: "#55859b",
+        base0F: "#867469",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-savanna-light.ts b/styles/src/themes/atelier-savanna-light.ts
new file mode 100644
index 0000000000..4bc1389fc9
--- /dev/null
+++ b/styles/src/themes/atelier-savanna-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Savanna Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/savanna/",
+    },
+    colors: {
+        base00: "#ecf4ee",
+        base01: "#dfe7e2",
+        base02: "#87928a",
+        base03: "#78877d",
+        base04: "#5f6d64",
+        base05: "#526057",
+        base06: "#232a25",
+        base07: "#171c19",
+        base08: "#b16139",
+        base09: "#9f713c",
+        base0A: "#a07e3b",
+        base0B: "#489963",
+        base0C: "#1c9aa0",
+        base0D: "#478c90",
+        base0E: "#55859b",
+        base0F: "#867469",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-seaside-dark.ts b/styles/src/themes/atelier-seaside-dark.ts
new file mode 100644
index 0000000000..1326a27786
--- /dev/null
+++ b/styles/src/themes/atelier-seaside-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Seaside Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/seaside/",
+    },
+    colors: {
+        base00: "#131513",
+        base01: "#242924",
+        base02: "#5e6e5e",
+        base03: "#687d68",
+        base04: "#809980",
+        base05: "#8ca68c",
+        base06: "#cfe8cf",
+        base07: "#f4fbf4",
+        base08: "#e6193c",
+        base09: "#87711d",
+        base0A: "#98981b",
+        base0B: "#29a329",
+        base0C: "#1999b3",
+        base0D: "#3d62f5",
+        base0E: "#ad2bee",
+        base0F: "#e619c3",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-seaside-light.ts b/styles/src/themes/atelier-seaside-light.ts
new file mode 100644
index 0000000000..6f6823718a
--- /dev/null
+++ b/styles/src/themes/atelier-seaside-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Seaside Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/seaside/",
+    },
+    colors: {
+        base00: "#f4fbf4",
+        base01: "#cfe8cf",
+        base02: "#8ca68c",
+        base03: "#809980",
+        base04: "#687d68",
+        base05: "#5e6e5e",
+        base06: "#242924",
+        base07: "#131513",
+        base08: "#e6193c",
+        base09: "#87711d",
+        base0A: "#98981b",
+        base0B: "#29a329",
+        base0C: "#1999b3",
+        base0D: "#3d62f5",
+        base0E: "#ad2bee",
+        base0F: "#e619c3",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-sulphurpool-dark.ts b/styles/src/themes/atelier-sulphurpool-dark.ts
new file mode 100644
index 0000000000..dcfc0d932a
--- /dev/null
+++ b/styles/src/themes/atelier-sulphurpool-dark.ts
@@ -0,0 +1,66 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Sulphurpool Dark`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/sulphurpool/",
+    },
+    colors: {
+        base00: "#202746",
+        base01: "#293256",
+        base02: "#5e6687",
+        base03: "#6b7394",
+        base04: "#898ea4",
+        base05: "#979db4",
+        base06: "#dfe2f1",
+        base07: "#f5f7ff",
+        base08: "#c94922",
+        base09: "#c76b29",
+        base0A: "#c08b30",
+        base0B: "#ac9739",
+        base0C: "#22a2c9",
+        base0D: "#3d8fd1",
+        base0E: "#6679cc",
+        base0F: "#9c637a",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        false,
+        {
+            neutral: chroma.scale([
+                colors.base00,
+                colors.base01,
+                colors.base02,
+                colors.base03,
+                colors.base04,
+                colors.base05,
+                colors.base06,
+                colors.base07,
+            ]),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-sulphurpool-light.ts b/styles/src/themes/atelier-sulphurpool-light.ts
new file mode 100644
index 0000000000..b2b5f7c328
--- /dev/null
+++ b/styles/src/themes/atelier-sulphurpool-light.ts
@@ -0,0 +1,68 @@
+import chroma from "chroma-js"
+import { Meta } from "./common/colorScheme"
+import { colorRamp, createColorScheme } from "./common/ramps"
+import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
+
+const variant: Variant = {
+    meta: {
+        name: `${name} Sulphurpool Light`,
+        ...metaCommon,
+        url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/sulphurpool/",
+    },
+    colors: {
+        base00: "#f5f7ff",
+        base01: "#dfe2f1",
+        base02: "#979db4",
+        base03: "#898ea4",
+        base04: "#6b7394",
+        base05: "#5e6687",
+        base06: "#293256",
+        base07: "#202746",
+        base08: "#c94922",
+        base09: "#c76b29",
+        base0A: "#c08b30",
+        base0B: "#ac9739",
+        base0C: "#22a2c9",
+        base0D: "#3d8fd1",
+        base0E: "#6679cc",
+        base0F: "#9c637a",
+    },
+}
+
+const syntax = buildSyntax(variant)
+
+const theme = (variant: Variant) => {
+    const { meta, colors } = variant
+
+    return createColorScheme(
+        meta.name,
+        true,
+        {
+            neutral: chroma.scale(
+                [
+                    colors.base00,
+                    colors.base01,
+                    colors.base02,
+                    colors.base03,
+                    colors.base04,
+                    colors.base05,
+                    colors.base06,
+                    colors.base07,
+                ].reverse()
+            ),
+            red: colorRamp(chroma(colors.base08)),
+            orange: colorRamp(chroma(colors.base09)),
+            yellow: colorRamp(chroma(colors.base0A)),
+            green: colorRamp(chroma(colors.base0B)),
+            cyan: colorRamp(chroma(colors.base0C)),
+            blue: colorRamp(chroma(colors.base0D)),
+            violet: colorRamp(chroma(colors.base0E)),
+            magenta: colorRamp(chroma(colors.base0F)),
+        },
+        syntax
+    )
+}
+
+export const dark = theme(variant)
+
+export const meta: Meta = variant.meta
diff --git a/styles/src/themes/atelier-sulphurpool.ts b/styles/src/themes/atelier-sulphurpool.ts
deleted file mode 100644
index e34bc80238..0000000000
--- a/styles/src/themes/atelier-sulphurpool.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-import chroma from "chroma-js"
-import { Meta } from "./common/colorScheme"
-import { colorRamp, createColorScheme } from "./common/ramps"
-
-const name = "Atelier Sulphurpool"
-
-const ramps = {
-    neutral: chroma
-        .scale([
-            "#202746",
-            "#293256",
-            "#5e6687",
-            "#6b7394",
-            "#898ea4",
-            "#979db4",
-            "#dfe2f1",
-            "#f5f7ff",
-        ])
-        .domain([0, 0.2, 0.38, 0.45, 0.65, 0.7, 0.85, 1]),
-    red: colorRamp(chroma("#c94922")),
-    orange: colorRamp(chroma("#c76b29")),
-    yellow: colorRamp(chroma("#c08b30")),
-    green: colorRamp(chroma("#ac9739")),
-    cyan: colorRamp(chroma("#22a2c9")),
-    blue: colorRamp(chroma("#3d8fd1")),
-    violet: colorRamp(chroma("#6679cc")),
-    magenta: colorRamp(chroma("#9c637a")),
-}
-
-export const dark = createColorScheme(`${name} Dark`, false, ramps)
-export const light = createColorScheme(`${name} Light`, true, ramps)
-
-export const meta: Meta = {
-    name,
-    author: "atelierbram",
-    license: {
-        SPDX: "MIT",
-        license_text: {
-            https_url: "https://atelierbram.mit-license.org/license.txt",
-            license_checksum:
-                "f95ce526ef4e7eecf7a832bba0e3451cc1000f9ce63eb01ed6f64f8109f5d0a5",
-        }
-    },
-    url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/sulphurpool/",
-}
diff --git a/styles/src/themes/common/atelier-common.ts b/styles/src/themes/common/atelier-common.ts
new file mode 100644
index 0000000000..08a915d019
--- /dev/null
+++ b/styles/src/themes/common/atelier-common.ts
@@ -0,0 +1,66 @@
+import { License, Meta, ThemeSyntax } from "./colorScheme"
+
+export interface Variant {
+    meta: Meta
+    colors: {
+        base00: string
+        base01: string
+        base02: string
+        base03: string
+        base04: string
+        base05: string
+        base06: string
+        base07: string
+        base08: string
+        base09: string
+        base0A: string
+        base0B: string
+        base0C: string
+        base0D: string
+        base0E: string
+        base0F: string
+    }
+}
+
+export const metaCommon: {
+    author: string
+    license: License
+} = {
+    author: "Bram de Haan (http://atelierbramdehaan.nl)",
+    license: {
+        SPDX: "MIT",
+        license_text: {
+            https_url: "https://atelierbram.mit-license.org/license.txt",
+            license_checksum:
+                "f95ce526ef4e7eecf7a832bba0e3451cc1000f9ce63eb01ed6f64f8109f5d0a5",
+        },
+    },
+}
+
+export const buildSyntax = (variant: Variant): ThemeSyntax => {
+    const { colors } = variant
+    return {
+        primary: { color: colors.base06 },
+        comment: { color: colors.base03 },
+        "punctuation.delimiter": { color: colors.base05 },
+        "punctuation.bracket": { color: colors.base05 },
+        "punctuation.special": { color: colors.base0F },
+        "string.special.symbol": { color: colors.base0B },
+        operator: { color: colors.base05 },
+        function: { color: colors.base0D },
+        "function.method": { color: colors.base0D },
+        "function.special.definition": { color: colors.base0A },
+        string: { color: colors.base0B },
+        "string.special": { color: colors.base0F },
+        "string.regex": { color: colors.base0C },
+        type: { color: colors.base0A },
+        number: { color: colors.base09 },
+        property: { color: colors.base08 },
+        variable: { color: colors.base06 },
+        "variable.special": { color: colors.base0E },
+        variant: { color: colors.base0A },
+        keyword: { color: colors.base0E },
+    }
+}
+
+export const name = "Atelier"
diff --git a/styles/src/themes/gruvbox-common.ts b/styles/src/themes/gruvbox-common.ts
index c3e63a31cf..c42362c11c 100644
--- a/styles/src/themes/gruvbox-common.ts
+++ b/styles/src/themes/gruvbox-common.ts
@@ -248,7 +248,8 @@ export const meta: Meta = {
     name,
     license: {
         SPDX: "MIT", // "MIT/X11"
-        license_text: "Copyright <YEAR> <COPYRIGHT HOLDER>\n\nPermission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files(the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/ or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE."
+        license_text:
+            "Copyright <YEAR> <COPYRIGHT HOLDER>\n\nPermission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files(the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/ or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.",
     },
     author: "morhetz <morhetz@gmail.com>",
     url: "https://github.com/morhetz/gruvbox",
diff --git a/styles/src/themes/gruvbox-dark-hard.ts b/styles/src/themes/gruvbox-dark-hard.ts
index a6e20e1020..3723de4901 100644
--- a/styles/src/themes/gruvbox-dark-hard.ts
+++ b/styles/src/themes/gruvbox-dark-hard.ts
@@ -1,6 +1,6 @@
-import { darkHard as dark, meta as commonMeta } from "./gruvbox-common";
+import { darkHard as dark, meta as commonMeta } from "./gruvbox-common"
 
-let meta = { ...commonMeta };
+let meta = { ...commonMeta }
 meta.name = `${commonMeta.name} Dark Hard`
 
-export { dark, meta }
\ No newline at end of file
+export { dark, meta }
diff --git a/styles/src/themes/gruvbox-dark-soft.ts b/styles/src/themes/gruvbox-dark-soft.ts
index 7eaefaa99a..2887572ead 100644
--- a/styles/src/themes/gruvbox-dark-soft.ts
+++ b/styles/src/themes/gruvbox-dark-soft.ts
@@ -1,7 +1,6 @@
-import { darkSoft as dark, meta as commonMeta } from "./gruvbox-common";
+import { darkSoft as dark, meta as commonMeta } from "./gruvbox-common"
 
-
-let meta = { ...commonMeta };
+let meta = { ...commonMeta }
 meta.name = `${commonMeta.name} Dark Soft`
 
-export { dark, meta }
\ No newline at end of file
+export { dark, meta }
diff --git a/styles/src/themes/gruvbox-dark.ts b/styles/src/themes/gruvbox-dark.ts
index ea21933714..cff7bd8bf9 100644
--- a/styles/src/themes/gruvbox-dark.ts
+++ b/styles/src/themes/gruvbox-dark.ts
@@ -1,7 +1,6 @@
-import { darkDefault as dark, meta as commonMeta } from "./gruvbox-common";
+import { darkDefault as dark, meta as commonMeta } from "./gruvbox-common"
 
-
-let meta = { ...commonMeta };
+let meta = { ...commonMeta }
 meta.name = `${commonMeta.name} Dark`
 
-export { dark, meta }
\ No newline at end of file
+export { dark, meta }
diff --git a/styles/src/themes/gruvbox-light-hard.ts b/styles/src/themes/gruvbox-light-hard.ts
index b0f42ca4b7..cf998ce588 100644
--- a/styles/src/themes/gruvbox-light-hard.ts
+++ b/styles/src/themes/gruvbox-light-hard.ts
@@ -1,6 +1,6 @@
-import { lightHard as light, meta as commonMeta } from "./gruvbox-common";
+import { lightHard as light, meta as commonMeta } from "./gruvbox-common"
 
-let meta = { ...commonMeta };
+let meta = { ...commonMeta }
 meta.name = `${commonMeta.name} Dark Soft`
 
-export { light, meta }
\ No newline at end of file
+export { light, meta }
diff --git a/styles/src/themes/gruvbox-light-soft.ts b/styles/src/themes/gruvbox-light-soft.ts
index 6743d29232..90ec82e965 100644
--- a/styles/src/themes/gruvbox-light-soft.ts
+++ b/styles/src/themes/gruvbox-light-soft.ts
@@ -1,6 +1,6 @@
-import { lightSoft as light, meta as commonMeta } from "./gruvbox-common";
+import { lightSoft as light, meta as commonMeta } from "./gruvbox-common"
 
-let meta = { ...commonMeta };
+let meta = { ...commonMeta }
 meta.name = `${commonMeta.name} Light Soft`
 
-export { light, meta }
\ No newline at end of file
+export { light, meta }
diff --git a/styles/src/themes/gruvbox-light.ts b/styles/src/themes/gruvbox-light.ts
index f64778d856..e8f355cd11 100644
--- a/styles/src/themes/gruvbox-light.ts
+++ b/styles/src/themes/gruvbox-light.ts
@@ -1,6 +1,6 @@
-import { lightDefault as light, meta as commonMeta } from "./gruvbox-common";
+import { lightDefault as light, meta as commonMeta } from "./gruvbox-common"
 
-let meta = { ...commonMeta };
+let meta = { ...commonMeta }
 meta.name = `${commonMeta.name} Light`
 
-export { light, meta }
\ No newline at end of file
+export { light, meta }
diff --git a/styles/src/themes/one-dark.ts b/styles/src/themes/one-dark.ts
index f99b4114f3..85417a0e68 100644
--- a/styles/src/themes/one-dark.ts
+++ b/styles/src/themes/one-dark.ts
@@ -79,7 +79,7 @@ export const meta: Meta = {
                 "https://raw.githubusercontent.com/atom/atom/master/packages/one-light-ui/LICENSE.md",
             license_checksum:
                 "d5af8fc171f6f600c0ab4e7597dca398dda80dbe6821ce01cef78e859e7a00f8",
-        }
+        },
     },
     url: "https://github.com/atom/atom/tree/master/packages/one-dark-ui",
 }
diff --git a/styles/src/themes/one-light.ts b/styles/src/themes/one-light.ts
index 534e4c1648..7bf21aee17 100644
--- a/styles/src/themes/one-light.ts
+++ b/styles/src/themes/one-light.ts
@@ -78,7 +78,7 @@ export const meta: Meta = {
                 "https://raw.githubusercontent.com/atom/atom/master/packages/one-light-ui/LICENSE.md",
             license_checksum:
                 "d5af8fc171f6f600c0ab4e7597dca398dda80dbe6821ce01cef78e859e7a00f8",
-        }
+        },
     },
     url: "https://github.com/atom/atom/tree/master/packages/one-light-ui",
 }
diff --git a/styles/src/themes/rose-pine-dawn.ts b/styles/src/themes/rose-pine-dawn.ts
index 7f7d52079d..427b05f72b 100644
--- a/styles/src/themes/rose-pine-dawn.ts
+++ b/styles/src/themes/rose-pine-dawn.ts
@@ -39,7 +39,7 @@ export const meta: Meta = {
                 "https://raw.githubusercontent.com/edunfelt/base16-rose-pine-scheme/main/LICENSE",
             license_checksum:
                 "6ca1b9da8c78c8441c5aa43d024a4e4a7bf59d1ecca1480196e94fda0f91ee4a",
-        }
+        },
     },
     url: "https://github.com/edunfelt/base16-rose-pine-scheme",
 }
diff --git a/styles/src/themes/rose-pine-moon.ts b/styles/src/themes/rose-pine-moon.ts
index a89d44487e..be2f5a8daf 100644
--- a/styles/src/themes/rose-pine-moon.ts
+++ b/styles/src/themes/rose-pine-moon.ts
@@ -39,7 +39,7 @@ export const meta: Meta = {
                 "https://raw.githubusercontent.com/edunfelt/base16-rose-pine-scheme/main/LICENSE",
             license_checksum:
                 "6ca1b9da8c78c8441c5aa43d024a4e4a7bf59d1ecca1480196e94fda0f91ee4a",
-        }
+        },
     },
     url: "https://github.com/edunfelt/base16-rose-pine-scheme",
 }
diff --git a/styles/src/themes/rose-pine.ts b/styles/src/themes/rose-pine.ts
index 87c9d34ffe..944550f125 100644
--- a/styles/src/themes/rose-pine.ts
+++ b/styles/src/themes/rose-pine.ts
@@ -37,7 +37,7 @@ export const meta: Meta = {
                 "https://raw.githubusercontent.com/edunfelt/base16-rose-pine-scheme/main/LICENSE",
             license_checksum:
                 "6ca1b9da8c78c8441c5aa43d024a4e4a7bf59d1ecca1480196e94fda0f91ee4a",
-        }
+        },
     },
     url: "https://github.com/edunfelt/base16-rose-pine-scheme",
 }
diff --git a/styles/src/themes/sandcastle.ts b/styles/src/themes/sandcastle.ts
index 86179db3db..483f01b27a 100644
--- a/styles/src/themes/sandcastle.ts
+++ b/styles/src/themes/sandcastle.ts
@@ -37,7 +37,7 @@ export const meta: Meta = {
                 "https://raw.githubusercontent.com/gessig/base16-sandcastle-scheme/master/LICENSE",
             license_checksum:
                 "8399d44b4d935b60be9fee0a76d7cc9a817b4f3f11574c9d6d1e8fd57e72ffdc",
-        }
+        },
     },
     url: "https://github.com/gessig/base16-sandcastle-scheme",
 }
diff --git a/styles/src/themes/solarized.ts b/styles/src/themes/solarized.ts
index 42306f68c3..1210c43806 100644
--- a/styles/src/themes/solarized.ts
+++ b/styles/src/themes/solarized.ts
@@ -40,7 +40,7 @@ export const meta: Metadata = {
                 "https://raw.githubusercontent.com/altercation/solarized/master/LICENSE",
             license_checksum:
                 "494aefdabf86acce06bd63001ad8aedad4ee38da23509d3f917d95aa3368b9a6",
-        }
+        },
     },
     url: "https://github.com/altercation/solarized",
 }
diff --git a/styles/src/themes/staff/abruzzo.ts b/styles/src/themes/staff/abruzzo.ts
deleted file mode 100644
index 43b75f2613..0000000000
--- a/styles/src/themes/staff/abruzzo.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Abruzzo"
-const author = "slightknack <hey@isaac.sh>"
-const url = "https://github.com/slightknack"
-const license = {
-    type: "",
-    url: "",
-}
-
-export const dark = createColorScheme(name, false, {
-    neutral: chroma.scale([
-        "#1b0d05",
-        "#2c1e18",
-        "#654035",
-        "#9d5e4a",
-        "#b37354",
-        "#c1825a",
-        "#dda66e",
-        "#fbf3e2",
-    ]),
-    red: colorRamp(chroma("#e594c4")),
-    orange: colorRamp(chroma("#d9e87e")),
-    yellow: colorRamp(chroma("#fd9d83")),
-    green: colorRamp(chroma("#96adf7")),
-    cyan: colorRamp(chroma("#fc798f")),
-    blue: colorRamp(chroma("#BCD0F5")),
-    violet: colorRamp(chroma("#dac5eb")),
-    magenta: colorRamp(chroma("#c1a3ef")),
-})
diff --git a/styles/src/themes/staff/atelier-dune.ts b/styles/src/themes/staff/atelier-dune.ts
deleted file mode 100644
index bd39098dc3..0000000000
--- a/styles/src/themes/staff/atelier-dune.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Atelier Dune"
-const author = "atelierbram"
-const url =
-    "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune/"
-const license = {
-    type: "MIT",
-    url: "https://github.com/atelierbram/syntax-highlighting/blob/master/LICENSE",
-}
-
-const ramps = {
-    neutral: chroma.scale([
-        "#20201d",
-        "#292824",
-        "#6e6b5e",
-        "#7d7a68",
-        "#999580",
-        "#a6a28c",
-        "#e8e4cf",
-        "#fefbec",
-    ]),
-    red: colorRamp(chroma("#d73737")),
-    orange: colorRamp(chroma("#b65611")),
-    yellow: colorRamp(chroma("#ae9513")),
-    green: colorRamp(chroma("#60ac39")),
-    cyan: colorRamp(chroma("#1fad83")),
-    blue: colorRamp(chroma("#6684e1")),
-    violet: colorRamp(chroma("#b854d4")),
-    magenta: colorRamp(chroma("#d43552")),
-}
-
-export const dark = createColorScheme(`${name} Dark`, false, ramps)
-export const light = createColorScheme(`${name} Light`, true, ramps)
diff --git a/styles/src/themes/staff/atelier-heath.ts b/styles/src/themes/staff/atelier-heath.ts
deleted file mode 100644
index cd4eb2a1ac..0000000000
--- a/styles/src/themes/staff/atelier-heath.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Atelier Heath"
-const author = "atelierbram"
-const url =
-    "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/heath/"
-const license = {
-    type: "MIT",
-    url: "https://github.com/atelierbram/syntax-highlighting/blob/master/LICENSE",
-}
-
-// `name-[light|dark]`, isLight, color ramps
-export const dark = createColorScheme(`${name} Dark`, false, {
-    neutral: chroma.scale([
-        "#1b181b",
-        "#292329",
-        "#695d69",
-        "#776977",
-        "#9e8f9e",
-        "#ab9bab",
-        "#d8cad8",
-        "#f7f3f7",
-    ]),
-    red: colorRamp(chroma("#ca402b")),
-    orange: colorRamp(chroma("#a65926")),
-    yellow: colorRamp(chroma("#bb8a35")),
-    green: colorRamp(chroma("#918b3b")),
-    cyan: colorRamp(chroma("#159393")),
-    blue: colorRamp(chroma("#516aec")),
-    violet: colorRamp(chroma("#7b59c0")),
-    magenta: colorRamp(chroma("#cc33cc")),
-})
-
-export const light = createColorScheme(`${name} Light`, true, {
-    neutral: chroma.scale([
-        "#161b1d",
-        "#1f292e",
-        "#516d7b",
-        "#5a7b8c",
-        "#7195a8",
-        "#7ea2b4",
-        "#c1e4f6",
-        "#ebf8ff",
-    ]),
-    red: colorRamp(chroma("#d22d72")),
-    orange: colorRamp(chroma("#935c25")),
-    yellow: colorRamp(chroma("#8a8a0f")),
-    green: colorRamp(chroma("#568c3b")),
-    cyan: colorRamp(chroma("#2d8f6f")),
-    blue: colorRamp(chroma("#257fad")),
-    violet: colorRamp(chroma("#6b6bb8")),
-    magenta: colorRamp(chroma("#b72dd2")),
-})
diff --git a/styles/src/themes/staff/atelier-seaside.ts b/styles/src/themes/staff/atelier-seaside.ts
deleted file mode 100644
index 13286e77f9..0000000000
--- a/styles/src/themes/staff/atelier-seaside.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Atelier Seaside"
-const author = "atelierbram"
-const url =
-    "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/seaside/"
-const license = {
-    type: "MIT",
-    url: "https://github.com/atelierbram/syntax-highlighting/blob/master/LICENSE",
-}
-
-const ramps = {
-    neutral: chroma.scale([
-        "#131513",
-        "#242924",
-        "#5e6e5e",
-        "#687d68",
-        "#809980",
-        "#8ca68c",
-        "#cfe8cf",
-        "#f4fbf4",
-    ]),
-    red: colorRamp(chroma("#e6193c")),
-    orange: colorRamp(chroma("#87711d")),
-    yellow: colorRamp(chroma("#98981b")),
-    green: colorRamp(chroma("#29a329")),
-    cyan: colorRamp(chroma("#1999b3")),
-    blue: colorRamp(chroma("#3d62f5")),
-    violet: colorRamp(chroma("#ad2bee")),
-    magenta: colorRamp(chroma("#e619c3")),
-}
-
-export const dark = createColorScheme(`${name} Dark`, false, ramps)
-export const light = createColorScheme(`${name} Light`, true, ramps)
diff --git a/styles/src/themes/staff/brushtrees.ts b/styles/src/themes/staff/brushtrees.ts
deleted file mode 100644
index a17cf92acb..0000000000
--- a/styles/src/themes/staff/brushtrees.ts
+++ /dev/null
@@ -1,73 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Brush Trees"
-const author = "Abraham White <abelincoln.white@gmail.com>"
-const url = "https://github.com/WhiteAbeLincoln/base16-brushtrees-scheme"
-const license = {
-    type: "MIT",
-    url: "https://github.com/WhiteAbeLincoln/base16-brushtrees-scheme/blob/master/LICENSE",
-}
-
-export const dark = createColorScheme(`${name} Dark`, false, {
-    neutral: chroma.scale([
-        "#485867",
-        "#5A6D7A",
-        "#6D828E",
-        "#8299A1",
-        "#98AFB5",
-        "#B0C5C8",
-        "#C9DBDC",
-        "#E3EFEF",
-    ]),
-    red: colorRamp(chroma("#b38686")),
-    orange: colorRamp(chroma("#d8bba2")),
-    yellow: colorRamp(chroma("#aab386")),
-    green: colorRamp(chroma("#87b386")),
-    cyan: colorRamp(chroma("#86b3b3")),
-    blue: colorRamp(chroma("#868cb3")),
-    violet: colorRamp(chroma("#b386b2")),
-    magenta: colorRamp(chroma("#b39f9f")),
-})
-
-export const mirage = createColorScheme(`${name} Mirage`, false, {
-    neutral: chroma.scale([
-        "#485867",
-        "#5A6D7A",
-        "#6D828E",
-        "#8299A1",
-        "#98AFB5",
-        "#B0C5C8",
-        "#C9DBDC",
-        "#E3EFEF",
-    ]),
-    red: colorRamp(chroma("#F28779")),
-    orange: colorRamp(chroma("#FFAD66")),
-    yellow: colorRamp(chroma("#FFD173")),
-    green: colorRamp(chroma("#D5FF80")),
-    cyan: colorRamp(chroma("#95E6CB")),
-    blue: colorRamp(chroma("#5CCFE6")),
-    violet: colorRamp(chroma("#D4BFFF")),
-    magenta: colorRamp(chroma("#F29E74")),
-})
-
-export const light = createColorScheme(`${name} Light`, true, {
-    neutral: chroma.scale([
-        "#1A1F29",
-        "#242936",
-        "#5C6773",
-        "#828C99",
-        "#ABB0B6",
-        "#F8F9FA",
-        "#F3F4F5",
-        "#FAFAFA",
-    ]),
-    red: colorRamp(chroma("#b38686")),
-    orange: colorRamp(chroma("#d8bba2")),
-    yellow: colorRamp(chroma("#aab386")),
-    green: colorRamp(chroma("#87b386")),
-    cyan: colorRamp(chroma("#86b3b3")),
-    blue: colorRamp(chroma("#868cb3")),
-    violet: colorRamp(chroma("#b386b2")),
-    magenta: colorRamp(chroma("#b39f9f")),
-})
diff --git a/styles/src/themes/staff/dracula.ts b/styles/src/themes/staff/dracula.ts
deleted file mode 100644
index acff08d230..0000000000
--- a/styles/src/themes/staff/dracula.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Dracula"
-const author = "zenorocha"
-const url = "https://github.com/dracula/dracula-theme"
-const license = {
-    type: "MIT",
-    url: "https://github.com/dracula/dracula-theme/blob/master/LICENSE",
-}
-
-export const dark = createColorScheme(name, false, {
-    neutral: chroma.scale([
-        "#282A36",
-        "#3a3c4e",
-        "#4d4f68",
-        "#626483",
-        "#62d6e8",
-        "#e9e9f4",
-        "#f1f2f8",
-        "#f8f8f2",
-    ]),
-    red: colorRamp(chroma("#ff5555")),
-    orange: colorRamp(chroma("#ffb86c")),
-    yellow: colorRamp(chroma("#f1fa8c")),
-    green: colorRamp(chroma("#50fa7b")),
-    cyan: colorRamp(chroma("#8be9fd")),
-    blue: colorRamp(chroma("#6272a4")),
-    violet: colorRamp(chroma("#bd93f9")),
-    magenta: colorRamp(chroma("#00f769")),
-})
diff --git a/styles/src/themes/staff/monokai.ts b/styles/src/themes/staff/monokai.ts
deleted file mode 100644
index 75319e527a..0000000000
--- a/styles/src/themes/staff/monokai.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Monokai"
-const author = "Wimer Hazenberg (http://www.monokai.nl)"
-const url = "https://base16.netlify.app/previews/base16-monokai.html"
-const license = {
-    type: "?",
-    url: "?",
-}
-
-// `name-[light|dark]`, isLight, color ramps
-export const dark = createColorScheme(name, false, {
-    neutral: chroma.scale([
-        "#272822",
-        "#383830",
-        "#49483e",
-        "#75715e",
-        "#a59f85",
-        "#f8f8f2",
-        "#f5f4f1",
-        "#f9f8f5",
-    ]),
-    red: colorRamp(chroma("#f92672")),
-    orange: colorRamp(chroma("#fd971f")),
-    yellow: colorRamp(chroma("#f4bf75")),
-    green: colorRamp(chroma("#a6e22e")),
-    cyan: colorRamp(chroma("#a1efe4")),
-    blue: colorRamp(chroma("#66d9ef")),
-    violet: colorRamp(chroma("#ae81ff")),
-    magenta: colorRamp(chroma("#cc6633")),
-})
diff --git a/styles/src/themes/staff/nord.ts b/styles/src/themes/staff/nord.ts
deleted file mode 100644
index 48f924e7a4..0000000000
--- a/styles/src/themes/staff/nord.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Nord"
-const author = "arcticicestudio"
-const url = "https://www.nordtheme.com/"
-const license = {
-    type: "MIT",
-    url: "https://github.com/arcticicestudio/nord/blob/develop/LICENSE.md",
-}
-
-// `name-[light|dark]`, isLight, color ramps
-export const dark = createColorScheme(name, false, {
-    neutral: chroma.scale([
-        "#2E3440",
-        "#3B4252",
-        "#434C5E",
-        "#4C566A",
-        "#D8DEE9",
-        "#E5E9F0",
-        "#ECEFF4",
-        "#8FBCBB",
-    ]),
-    red: colorRamp(chroma("#88C0D0")),
-    orange: colorRamp(chroma("#81A1C1")),
-    yellow: colorRamp(chroma("#5E81AC")),
-    green: colorRamp(chroma("#BF616A")),
-    cyan: colorRamp(chroma("#D08770")),
-    blue: colorRamp(chroma("#EBCB8B")),
-    violet: colorRamp(chroma("#A3BE8C")),
-    magenta: colorRamp(chroma("#B48EAD")),
-})
diff --git a/styles/src/themes/staff/seti-ui.ts b/styles/src/themes/staff/seti-ui.ts
deleted file mode 100644
index abf6624242..0000000000
--- a/styles/src/themes/staff/seti-ui.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Seti UI"
-const author = "jesseweed"
-const url = "https://github.com/jesseweed/seti-ui"
-const license = {
-    type: "MIT",
-    url: "https://github.com/jesseweed/seti-ui/blob/master/LICENSE.md",
-}
-
-// `name-[light|dark]`, isLight, color ramps
-export const dark = createColorScheme(name, false, {
-    neutral: chroma.scale([
-        "#151718",
-        "#262B30",
-        "#1E2326",
-        "#41535B",
-        "#43a5d5",
-        "#d6d6d6",
-        "#eeeeee",
-        "#ffffff",
-    ]),
-    red: colorRamp(chroma("#Cd3f45")),
-    orange: colorRamp(chroma("#db7b55")),
-    yellow: colorRamp(chroma("#e6cd69")),
-    green: colorRamp(chroma("#9fca56")),
-    cyan: colorRamp(chroma("#55dbbe")),
-    blue: colorRamp(chroma("#55b5db")),
-    violet: colorRamp(chroma("#a074c4")),
-    magenta: colorRamp(chroma("#8a553f")),
-})
diff --git a/styles/src/themes/staff/tokyo-night-storm.ts b/styles/src/themes/staff/tokyo-night-storm.ts
deleted file mode 100644
index 399c526872..0000000000
--- a/styles/src/themes/staff/tokyo-night-storm.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Tokyo Night Storm"
-const author = "folke"
-const url = "https://github.com/folke/tokyonight.nvim"
-const license = {
-    type: "MIT",
-    url: "https://github.com/ghifarit53/tokyonight-vim/blob/master/LICENSE",
-}
-
-// `name-[light|dark]`, isLight, color ramps
-export const dark = createColorScheme(name, false, {
-    neutral: chroma.scale([
-        "#24283B",
-        "#16161E",
-        "#343A52",
-        "#444B6A",
-        "#787C99",
-        "#A9B1D6",
-        "#CBCCD1",
-        "#D5D6DB",
-    ]),
-    red: colorRamp(chroma("#C0CAF5")),
-    orange: colorRamp(chroma("#A9B1D6")),
-    yellow: colorRamp(chroma("#0DB9D7")),
-    green: colorRamp(chroma("#9ECE6A")),
-    cyan: colorRamp(chroma("#B4F9F8")),
-    blue: colorRamp(chroma("#2AC3DE")),
-    violet: colorRamp(chroma("#BB9AF7")),
-    magenta: colorRamp(chroma("#F7768E")),
-})
diff --git a/styles/src/themes/staff/tokyo-night.ts b/styles/src/themes/staff/tokyo-night.ts
deleted file mode 100644
index 267b1fc031..0000000000
--- a/styles/src/themes/staff/tokyo-night.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Tokyo"
-const author = "folke"
-const url = "https://github.com/folke/tokyonight.nvim"
-const license = {
-    type: "Apache License 2.0",
-    url: "https://github.com/folke/tokyonight.nvim/blob/main/LICENSE",
-}
-
-// `name-[light|dark]`, isLight, color ramps
-export const dark = createColorScheme(`${name} Night`, false, {
-    neutral: chroma.scale([
-        "#1A1B26",
-        "#16161E",
-        "#2F3549",
-        "#444B6A",
-        "#787C99",
-        "#A9B1D6",
-        "#CBCCD1",
-        "#D5D6DB",
-    ]),
-    red: colorRamp(chroma("#C0CAF5")),
-    orange: colorRamp(chroma("#A9B1D6")),
-    yellow: colorRamp(chroma("#0DB9D7")),
-    green: colorRamp(chroma("#9ECE6A")),
-    cyan: colorRamp(chroma("#B4F9F8")),
-    blue: colorRamp(chroma("#2AC3DE")),
-    violet: colorRamp(chroma("#BB9AF7")),
-    magenta: colorRamp(chroma("#F7768E")),
-})
-
-export const light = createColorScheme(`${name} Day`, true, {
-    neutral: chroma.scale([
-        "#1A1B26",
-        "#1A1B26",
-        "#343B59",
-        "#4C505E",
-        "#9699A3",
-        "#DFE0E5",
-        "#CBCCD1",
-        "#D5D6DB",
-    ]),
-    red: colorRamp(chroma("#343B58")),
-    orange: colorRamp(chroma("#965027")),
-    yellow: colorRamp(chroma("#166775")),
-    green: colorRamp(chroma("#485E30")),
-    cyan: colorRamp(chroma("#3E6968")),
-    blue: colorRamp(chroma("#34548A")),
-    violet: colorRamp(chroma("#5A4A78")),
-    magenta: colorRamp(chroma("#8C4351")),
-})
diff --git a/styles/src/themes/staff/zed-pro.ts b/styles/src/themes/staff/zed-pro.ts
deleted file mode 100644
index 9b748be299..0000000000
--- a/styles/src/themes/staff/zed-pro.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Zed Pro"
-const author = "Nate Butler"
-const url = "https://github.com/iamnbutler"
-const license = {
-    type: "?",
-    url: "?",
-}
-
-const ramps = {
-    neutral: chroma
-        .scale([
-            "#101010",
-            "#1C1C1C",
-            "#212121",
-            "#2D2D2D",
-            "#B9B9B9",
-            "#DADADA",
-            "#E6E6E6",
-            "#FFFFFF",
-        ])
-        .domain([0, 0.1, 0.2, 0.3, 0.7, 0.8, 0.9, 1]),
-    red: colorRamp(chroma("#DC604F")),
-    orange: colorRamp(chroma("#DE782F")),
-    yellow: colorRamp(chroma("#E0B750")),
-    green: colorRamp(chroma("#2A643D")),
-    cyan: colorRamp(chroma("#215050")),
-    blue: colorRamp(chroma("#2F6DB7")),
-    violet: colorRamp(chroma("#5874C1")),
-    magenta: colorRamp(chroma("#DE9AB8")),
-}
-
-export const dark = createColorScheme(`${name} Dark`, false, ramps)
-export const light = createColorScheme(`${name} Light`, true, ramps)
diff --git a/styles/src/themes/staff/zenburn.ts b/styles/src/themes/staff/zenburn.ts
deleted file mode 100644
index 9457ef1957..0000000000
--- a/styles/src/themes/staff/zenburn.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import chroma from "chroma-js"
-import { colorRamp, createColorScheme } from "../common/ramps"
-
-const name = "Zenburn"
-const author = "elnawe"
-const url = "https://github.com/elnawe/base16-zenburn-scheme"
-const license = {
-    type: "None",
-    url: "",
-}
-
-export const dark = createColorScheme(name, false, {
-    neutral: chroma.scale([
-        "#383838",
-        "#404040",
-        "#606060",
-        "#6f6f6f",
-        "#808080",
-        "#dcdccc",
-        "#c0c0c0",
-        "#ffffff",
-    ]),
-    red: colorRamp(chroma("#dca3a3")),
-    orange: colorRamp(chroma("#dfaf8f")),
-    yellow: colorRamp(chroma("#e0cf9f")),
-    green: colorRamp(chroma("#5f7f5f")),
-    cyan: colorRamp(chroma("#93e0e3")),
-    blue: colorRamp(chroma("#7cb8bb")),
-    violet: colorRamp(chroma("#dc8cc3")),
-    magenta: colorRamp(chroma("#000000")),
-})
diff --git a/styles/src/themes/summercamp.ts b/styles/src/themes/summercamp.ts
index e8d1bd40b2..7df125e866 100644
--- a/styles/src/themes/summercamp.ts
+++ b/styles/src/themes/summercamp.ts
@@ -39,6 +39,6 @@ export const meta: Meta = {
                 "https://raw.githubusercontent.com/zoefiri/base16-sc/master/LICENSE",
             license_checksum:
                 "fadcc834b7eaf2943800956600e8aeea4b495ecf6490f4c4b6c91556a90accaf",
-        }
+        },
     },
 }