Add gray color families

2023-02-12 20:02:51 -05:00
parent 1fcfa5d272
commit e65c0810ba
3 changed files with 56 additions and 0 deletions
@@ -7,6 +7,52 @@ import { curve } from "./curves";

 // Token or user-facing colors should use short, clear names and a 100-900 scale to match the font weight scale.

+// Light Gray ======================================== //
+
+export const lightgray = generateColorFamily({
+  name: "lightgray",
+  color: {
+    hue: {
+      start: 210,
+      end: 210,
+      curve: curve.linear,
+    },
+    saturation: {
+      start: 10,
+      end: 15,
+      curve: curve.saturation,
+    },
+    lightness: {
+      start: 97,
+      end: 50,
+      curve: curve.linear,
+    },
+  },
+});
+
+// Light Dark ======================================== //
+
+export const darkgray = generateColorFamily({
+  name: "darkgray",
+  color: {
+    hue: {
+      start: 210,
+      end: 210,
+      curve: curve.linear,
+    },
+    saturation: {
+      start: 15,
+      end: 20,
+      curve: curve.saturation,
+    },
+    lightness: {
+      start: 55,
+      end: 8,
+      curve: curve.linear,
+    },
+  },
+});
+
 // Red ======================================== //

 export const red = generateColorFamily({