Add new internal themes

Nate Butler created 3 years ago

Change summary

styles/src/themes/internal/dracula.ts | 29 ++++++++++++++++
styles/src/themes/internal/embers.ts  | 30 +++++++++++++++++
styles/src/themes/internal/gruvbox.ts | 51 +++++++++++++++++++++++++++++
styles/src/themes/internal/heath.ts   | 29 ++++++++++++++++
styles/src/themes/internal/monokai.ts | 29 ++++++++++++++++
styles/src/themes/internal/nord.ts    | 29 ++++++++++++++++
6 files changed, 197 insertions(+)

Detailed changes

styles/src/themes/internal/dracula.ts

@@ -0,0 +1,29 @@
+import chroma from "chroma-js";
+import { colorRamp, createColorScheme } from "../common/ramps";
+
+const name = "Dracula";
+const author = "Base16 port by Mike Barkmin (http://github.com/mikebarkmin)";
+const url = "http://github.com/dracula"
+
+// `name-[light|dark]`, isLight, color ramps
+export const dark = createColorScheme(`${name}`, false, {
+  neutral: chroma
+    .scale([
+      "#282936",
+      "#3a3c4e",
+      "#4d4f68",
+      "#626483",
+      "#62d6e8",
+      "#e9e9f4",
+      "#f1f2f8",
+      "#f7f7fb",
+    ]),
+  red: colorRamp(chroma("#ea51b2")),
+  orange: colorRamp(chroma("#b45bcf")),
+  yellow: colorRamp(chroma("#ebff87")),
+  green: colorRamp(chroma("#00f769")),
+  cyan: colorRamp(chroma("#a1efe4")),
+  blue: colorRamp(chroma("#62d6e8")),
+  violet: colorRamp(chroma("#b45bcf")),
+  magenta: colorRamp(chroma("#00f769")),
+});

styles/src/themes/internal/embers.ts

@@ -0,0 +1,30 @@
+import chroma from "chroma-js";
+import { colorRamp, createColorScheme } from "../common/ramps";
+
+// Ashes scheme for the Base16 Builder (https://github.com/chriskempson/base16-builder)
+const name = "Embers";
+const author = "Jannik Siebert (https://github.com/janniks)";
+const url = ""
+
+// `name-[light|dark]`, isLight, color ramps
+export const dark = createColorScheme(`${name}`, false, {
+  neutral: chroma
+    .scale([
+      "#16130F",
+      "#2C2620",
+      "#433B32",
+      "#5A5047",
+      "#8A8075",
+      "#A39A90",
+      "#BEB6AE",
+      "#DBD6D1",
+    ]),
+  red: colorRamp(chroma("#826D57")),
+  orange: colorRamp(chroma("#828257")),
+  yellow: colorRamp(chroma("#6D8257")),
+  green: colorRamp(chroma("#57826D")),
+  cyan: colorRamp(chroma("#576D82")),
+  blue: colorRamp(chroma("#6D5782")),
+  violet: colorRamp(chroma("#82576D")),
+  magenta: colorRamp(chroma("#825757")),
+});

styles/src/themes/internal/gruvbox.ts

@@ -0,0 +1,51 @@
+import chroma from "chroma-js";
+import { colorRamp, createColorScheme } from "../common/ramps";
+
+const name = "Gruvbox";
+const author = "Dawid Kurek ([e-mail])";
+const url = "https://github.com/morhetz/gruvbox"
+
+// `name-[light|dark]`, isLight, color ramps
+export const dark = createColorScheme(`${name}-dark-medium`, false, {
+  neutral: chroma
+    .scale([
+      "#282828",
+      "#3c3836",
+      "#504945",
+      "#665c54",
+      "#bdae93",
+      "#d5c4a1",
+      "#ebdbb2",
+      "#fbf1c7",
+    ]),
+  red: colorRamp(chroma("#fb4934")),
+  orange: colorRamp(chroma("#fe8019")),
+  yellow: colorRamp(chroma("#fabd2f")),
+  green: colorRamp(chroma("#b8bb26")),
+  cyan: colorRamp(chroma("#8ec07c")),
+  blue: colorRamp(chroma("#83a598")),
+  violet: colorRamp(chroma("#d3869b")),
+  magenta: colorRamp(chroma("#d65d0e")),
+});
+
+export const light = createColorScheme(`${name}-light-medium`, true, {
+  neutral: chroma
+    .scale([
+      "#282828",
+      "#3c3836",
+      "#504945",
+      "#665c54",
+      "#bdae93",
+      "#d5c4a1",
+      "#ebdbb2",
+      "#fbf1c7",
+    ]),
+  red: colorRamp(chroma("#9d0006")),
+  orange: colorRamp(chroma("#af3a03")),
+  yellow: colorRamp(chroma("#b57614")),
+  green: colorRamp(chroma("#79740e")),
+  cyan: colorRamp(chroma("#427b58")),
+  blue: colorRamp(chroma("#076678")),
+  violet: colorRamp(chroma("#8f3f71")),
+  magenta: colorRamp(chroma("#d65d0e")),
+});

styles/src/themes/internal/heath.ts

@@ -0,0 +1,29 @@
+import chroma from "chroma-js";
+import { colorRamp, createColorScheme } from "../common/ramps";
+
+const name = "Atelier Heath";
+const author = "Bram de Haan (http://atelierbramdehaan.nl)";
+const url = ""
+
+// `name-[light|dark]`, isLight, color ramps
+export const dark = createColorScheme(`${name}`, 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")),
+});

styles/src/themes/internal/monokai.ts

@@ -0,0 +1,29 @@
+import chroma from "chroma-js";
+import { colorRamp, createColorScheme } from "../common/ramps";
+
+const name = "Monokai";
+const author = "Wimer Hazenberg (http://www.monokai.nl)";
+const 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")),
+});

styles/src/themes/internal/nord.ts

@@ -0,0 +1,29 @@
+import chroma from "chroma-js";
+import { colorRamp, createColorScheme } from "../common/ramps";
+
+const name = "Nord";
+const author = "arcticicestudio";
+const url = ""
+
+// `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")),
+});