WIP

src/board/styles-board/gradient/contrast-a.ts

@@ -0,0 +1,43 @@
+import { Style } from "../../../types";
+
+const style: Style = {
+  name: "Contrast A",
+  category: "gradient",
+  background: {
+    type: "gradient",
+    data: {
+      dir: "vertical",
+      colors: ["#ff9b38", "#389bff"],
+    },
+  },
+  dark: {
+    type: "solid",
+    data: {
+      color: "transparent",
+    },
+  },
+  light: {
+    type: "solid",
+    data: {
+      color: "#ffffff66",
+    },
+  },
+  moveIndicator: {
+    type: "color",
+    data: "#3cff0055",
+  },
+  border: {
+    type: "gradient",
+    data: {
+      dir: "vertical",
+      colors: ["#f27f0d", "#0d7ff2"],
+    },
+  },
+  coords: {
+    onLight: "#00000077",
+    onDark: "#fff",
+    onBorder: "#fff",
+  },
+};
+
+export default style;

src/board/styles-board/gradient/contrast-b.ts

@@ -0,0 +1,43 @@
+import { Style } from "../../../types";
+
+const style: Style = {
+  name: "Contrast B",
+  category: "gradient",
+  background: {
+    type: "gradient",
+    data: {
+      dir: "vertical",
+      colors: ["#FF4DA6", "#4D74FF"],
+    },
+  },
+  dark: {
+    type: "solid",
+    data: {
+      color: "transparent",
+    },
+  },
+  light: {
+    type: "solid",
+    data: {
+      color: "#ffffff66",
+    },
+  },
+  moveIndicator: {
+    type: "color",
+    data: "#3cff0055",
+  },
+  border: {
+    type: "gradient",
+    data: {
+      dir: "vertical",
+      colors: ["#BB3D7C", "#3653BB"],
+    },
+  },
+  coords: {
+    onLight: "#00000077",
+    onDark: "#fff",
+    onBorder: "#fff",
+  },
+};
+
+export default style;

src/board/styles-board/gradient/contrast-c.ts

@@ -0,0 +1,43 @@
+import { Style } from "../../../types";
+
+const style: Style = {
+  name: "Contrast C",
+  category: "gradient",
+  background: {
+    type: "gradient",
+    data: {
+      dir: "vertical",
+      colors: ["#FF8D4D", "#914DFF"],
+    },
+  },
+  dark: {
+    type: "solid",
+    data: {
+      color: "transparent",
+    },
+  },
+  light: {
+    type: "solid",
+    data: {
+      color: "#ffffff66",
+    },
+  },
+  moveIndicator: {
+    type: "color",
+    data: "#3cff0055",
+  },
+  border: {
+    type: "gradient",
+    data: {
+      dir: "vertical",
+      colors: ["#E8702C", "#6334B0"],
+    },
+  },
+  coords: {
+    onLight: "#00000077",
+    onDark: "#fff",
+    onBorder: "#fff",
+  },
+};
+
+export default style;

src/board/styles-board/gradient/contrast-d.ts

@@ -0,0 +1,43 @@
+import { Style } from "../../../types";
+
+const style: Style = {
+  name: "Contrast D",
+  category: "gradient",
+  background: {
+    type: "gradient",
+    data: {
+      dir: "vertical",
+      colors: ["#61c43f", "#864DFF"],
+    },
+  },
+  dark: {
+    type: "solid",
+    data: {
+      color: "transparent",
+    },
+  },
+  light: {
+    type: "solid",
+    data: {
+      color: "#ffffff66",
+    },
+  },
+  moveIndicator: {
+    type: "color",
+    data: "#3cff0055",
+  },
+  border: {
+    type: "gradient",
+    data: {
+      dir: "vertical",
+      colors: ["#559a3c", "#6333cc"],
+    },
+  },
+  coords: {
+    onLight: "#00000077",
+    onDark: "#fff",
+    onBorder: "#fff",
+  },
+};
+
+export default style;

src/board/styles-board/index.ts

@@ -29,6 +29,10 @@ import smoothLaguna from "./gradient/smooth-laguna";
 import smoothSea from "./gradient/smooth-sea";
 import smoothViolet from "./gradient/smooth-violet";
 import smoothMono from "./gradient/smooth-mono";
+import contrastA from "./gradient/contrast-a";
+import contrastB from "./gradient/contrast-b";
+import contrastC from "./gradient/contrast-c";
+import contrastD from "./gradient/contrast-d";
 
 import wood1 from "./pic/wood1";
 import wood2 from "./pic/wood2";
@@ -71,6 +75,10 @@ const styles = {
   smoothSea,
   smoothViolet,
   smoothMono,
+  contrastA,
+  contrastB,
+  contrastC,
+  contrastD,
   wood1,
   wood2,
   wood3,