@volue/design-colors 2.0.3 → 3.0.0-next.0

package/dist/index.common.js

@@ -1,83 +1,316 @@
 module.exports = {
-  "palette": {
-    "colorBlack": "#000000",
-    "colorWhite": "#ffffff",
-    "colorGray5": "#f2f2f2",
-    "colorGray10": "#e5e5e5",
-    "colorGray15": "#d9d9d9",
-    "colorGray25": "#b2b2b2",
-    "colorGray50": "#666666",
-    "colorGray75": "#333333",
-    "colorPrimary5": "#f2f4f5",
-    "colorPrimary10": "#e6e9ea",
-    "colorPrimary60": "#6b8085",
-    "colorPrimary100": "#082b33",
-    "colorPrimary120": "#062228",
-    "colorAccent5": "#f2f8f8",
-    "colorAccent10": "#e5f1f2",
-    "colorAccent15": "#d9ebec",
-    "colorAccent25": "#bfddde",
-    "colorAccent60": "#7fbbbd",
-    "colorAccent100": "#01797d",
-    "colorAccent120": "#016063",
-    "colorBlue10": "#e9f1f6",
-    "colorBlue50": "#92b8d4",
-    "colorBlue100": "#2673aa",
-    "colorBlue120": "#1a5178",
-    "colorGreen10": "#ecf3ea",
-    "colorGreen50": "#a0c29b",
-    "colorGreen100": "#438538",
-    "colorGreen120": "#295222",
-    "colorOrange10": "#fbf0e5",
-    "colorOrange50": "#ecb67f",
-    "colorOrange100": "#da6e00",
-    "colorOrange120": "#a65300",
-    "colorRed10": "#fbe9ea",
-    "colorRed50": "#df9e99",
-    "colorRed100": "#bf3f34",
-    "colorRed120": "#8c2e26",
-    "colorTeal10": "#e9f6f7",
-    "colorTeal50": "#94d1d5",
-    "colorTeal100": "#2ba3ab",
-    "colorTeal120": "#1e7278",
-    "colorPink10": "#faebef",
-    "colorPink50": "#e79eb0",
-    "colorPink100": "#cf3f63",
-    "colorPink120": "#9c2f4a",
-    "colorPurple10": "#f1ecf5",
-    "colorPurple50": "#bfa9d3",
-    "colorPurple100": "#8054a8",
-    "colorPurple120": "#593b75",
-    "colorYellow10": "#fdfaf4",
-    "colorYellow50": "#fdd9a3",
-    "colorYellow100": "#faa600",
-    "colorYellow120": "#c78500"
+  "core": {
+    "white": "#ffffff",
+    "gray0": "#f9fafb",
+    "gray5": "#f3f5f6",
+    "gray10": "#e6ebec",
+    "gray20": "#c2cdd0",
+    "gray30": "#9dafb3",
+    "gray40": "#789297",
+    "gray60": "#53747b",
+    "gray70": "#2f565e",
+    "gray80": "#223f44",
+    "gray90": "#1c353a",
+    "gray100": "#082d35",
+    "accent0": "#f8fbfc",
+    "accent5": "#f3f8f9",
+    "accent10": "#e8f1f3",
+    "accent20": "#c4dbe0",
+    "accent30": "#a8cbd3",
+    "accent40": "#7eb0bc",
+    "accent60": "#5b9ba9",
+    "accent70": "#388597",
+    "accent80": "#157084",
+    "accent90": "#11596a",
+    "accent100": "#0c4957",
+    "blue5": "#f0fcff",
+    "blue10": "#e1f9ff",
+    "blue20": "#d0f6ff",
+    "blue30": "#bff3ff",
+    "blue40": "#9aecff",
+    "blue60": "#00cceb",
+    "blue70": "#00b4d1",
+    "blue80": "#0096af",
+    "blue90": "#007a92",
+    "blue100": "#005e72",
+    "green5": "#eeffef",
+    "green10": "#dbffdf",
+    "green20": "#c6ffcd",
+    "green30": "#b0ffbb",
+    "green40": "#7dfd95",
+    "green60": "#31d962",
+    "green70": "#1fc052",
+    "green80": "#22a047",
+    "green90": "#1b8238",
+    "green100": "#006626",
+    "orange5": "#fff9ed",
+    "orange10": "#fff2da",
+    "orange20": "#ffecc8",
+    "orange30": "#ffdd99",
+    "orange40": "#ffd787",
+    "orange60": "#ffcd61",
+    "orange70": "#ffb900",
+    "orange80": "#dc9f00",
+    "orange90": "#b17600",
+    "orange100": "#805400",
+    "red5": "#fff7f8",
+    "red10": "#ffeff0",
+    "red20": "#ffdbde",
+    "red30": "#ffbfc1",
+    "red40": "#ffadb1",
+    "red60": "#ff7d89",
+    "red70": "#ff3b3d",
+    "red80": "#df001f",
+    "red90": "#b20016",
+    "red100": "#9d0012"
   },
-  "text": {
-    "colorWhite": "#ffffff",
-    "colorBlack": "#000000",
-    "colorGray50": "#666666",
-    "colorGray75": "#333333",
-    "colorPrimary60": "#6b8085",
-    "colorPrimary100": "#082b33",
-    "colorPrimary120": "#062228",
-    "colorAccent100": "#01797d",
-    "colorAccent120": "#016063",
-    "colorBlue100": "#2673aa",
-    "colorBlue120": "#1a5178",
-    "colorGreen100": "#438538",
-    "colorGreen120": "#295222",
-    "colorOrange100": "#da6e00",
-    "colorOrange120": "#a65300",
-    "colorRed100": "#bf3f34",
-    "colorRed120": "#8c2e26",
-    "colorTeal100": "#2ba3ab",
-    "colorTeal120": "#1e7278",
-    "colorPurple100": "#8054a8",
-    "colorPurple120": "#593b75",
-    "colorPink100": "#cf3f63",
-    "colorPink120": "#9c2f4a",
-    "colorYellow100": "#faa600",
-    "colorYellow120": "#c78500"
+  "data": {
+    "red20": "#f7e6e8",
+    "red40": "#ecc7c9",
+    "red60": "#e6a1a5",
+    "red80": "#eb7072",
+    "red100": "#c6434b",
+    "orange20": "#faebdc",
+    "orange40": "#f5caa3",
+    "orange60": "#eda35e",
+    "orange80": "#e57b1a",
+    "orange100": "#b35d0a",
+    "brown20": "#f4edde",
+    "brown40": "#e8cf96",
+    "brown60": "#d8b155",
+    "brown80": "#b89749",
+    "brown100": "#8e7333",
+    "pear20": "#fcfcdb",
+    "pear40": "#e8e54c",
+    "pear60": "#cbc920",
+    "pear80": "#afad07",
+    "pear100": "#888705",
+    "lime20": "#f1fcdc",
+    "lime40": "#cbed7a",
+    "lime60": "#a7d441",
+    "lime80": "#84ba12",
+    "lime100": "#66910e",
+    "green20": "#dff5e1",
+    "green40": "#ade2b0",
+    "green60": "#76ce7a",
+    "green80": "#3fb845",
+    "green100": "#318d36",
+    "teal20": "#dcf4ef",
+    "teal40": "#a7dfd6",
+    "teal60": "#6fc9ba",
+    "teal80": "#3ab19e",
+    "teal100": "#2a8879",
+    "aqua20": "#e3f1f6",
+    "aqua40": "#b1dae4",
+    "aqua60": "#7ac4d3",
+    "aqua80": "#42abc2",
+    "aqua100": "#2e8495",
+    "blue20": "#e6eff7",
+    "blue40": "#bfd5e9",
+    "blue60": "#93bbdf",
+    "blue80": "#60a1df",
+    "blue100": "#3b7bb7",
+    "lazuli20": "#ecedf9",
+    "lazuli40": "#cccfee",
+    "lazuli60": "#aab2e9",
+    "lazuli80": "#7f94f2",
+    "lazuli100": "#5768df",
+    "purple20": "#f4eaf8",
+    "purple40": "#e2c6ec",
+    "purple60": "#d2a1e3",
+    "purple80": "#c574e4",
+    "purple100": "#a345c5",
+    "pink20": "#f8e9f2",
+    "pink40": "#ebc5de",
+    "pink60": "#e29dc9",
+    "pink80": "#e26ab5",
+    "pink100": "#bc3d91"
+  },
+  "background": {
+    "canvas": "#ffffff",
+    "surface": {
+      "default": "#ffffff",
+      "subtle": "#f3f5f6",
+      "contrast": "#082d35"
+    },
+    "neutral": {
+      "minimal": "#ffffff",
+      "subtle": {
+        "default": "#f9fafb",
+        "hover": "#f3f5f6",
+        "active": "#e6ebec"
+      },
+      "moderate": {
+        "default": "#f3f5f6",
+        "hover": "#e6ebec"
+      },
+      "default": "#e6ebec",
+      "hover": "#c2cdd0",
+      "bold": "#53747b",
+      "strong": "#223f44",
+      "contrast": "#082d35"
+    },
+    "accent": {
+      "minimal": {
+        "default": "#f8fbfc",
+        "hover": "#f3f8f9",
+        "active": "#e8f1f3"
+      },
+      "subtle": {
+        "default": "#f3f8f9",
+        "hover": "#e8f1f3",
+        "active": "#c4dbe0"
+      },
+      "default": "#e8f1f3",
+      "hover": "#c4dbe0",
+      "bold": "#5b9ba9",
+      "strong": {
+        "default": "#157084",
+        "hover": "#11596a"
+      }
+    },
+    "danger": {
+      "subtle": {
+        "default": "#fff7f8",
+        "hover": "#ffeff0",
+        "active": "#ffdbde"
+      },
+      "default": "#ffeff0",
+      "hover": "#ffdbde",
+      "bold": "#ff3b3d",
+      "strong": {
+        "default": "#df001f",
+        "hover": "#b20016"
+      }
+    },
+    "warning": {
+      "subtle": {
+        "default": "#fff9ed",
+        "hover": "#fff2da",
+        "active": "#ffecc8"
+      },
+      "default": "#fff2da",
+      "hover": "#ffecc8",
+      "bold": "#ffb900",
+      "strong": {
+        "default": "#dc9f00",
+        "hover": "#b17600"
+      }
+    },
+    "success": {
+      "subtle": {
+        "default": "#eeffef",
+        "hover": "#dbffdf",
+        "active": "#c6ffcd"
+      },
+      "default": "#dbffdf",
+      "hover": "#c6ffcd",
+      "bold": "#22a047",
+      "strong": {
+        "default": "#1b8238",
+        "hover": "#006626"
+      }
+    },
+    "info": {
+      "subtle": {
+        "default": "#f0fcff",
+        "hover": "#e1f9ff",
+        "active": "#d0f6ff"
+      },
+      "default": "#e1f9ff",
+      "hover": "#d0f6ff",
+      "bold": "#0096af",
+      "strong": {
+        "default": "#007a92",
+        "hover": "#005e72"
+      }
+    },
+    "disabled": {
+      "default": "#e6ebec",
+      "subtle": "#f3f5f6"
+    },
+    "inverse": "rgba(255, 255, 255, 0.1)"
+  },
+  "foreground": {
+    "body": "#082d35",
+    "link": "#11596a",
+    "neutral": {
+      "default": "#082d35",
+      "moderate": "#223f44",
+      "subtle": "#53747b",
+      "minimal": "#9dafb3"
+    },
+    "accent": {
+      "default": "#0c4957",
+      "moderate": "#11596a"
+    },
+    "danger": {
+      "default": "#9d0012",
+      "moderate": "#b20016",
+      "subtle": "#df001f"
+    },
+    "warning": {
+      "default": "#805400",
+      "moderate": "#b17600",
+      "subtle": "#dc9f00",
+      "inverse": "#082d35"
+    },
+    "success": {
+      "default": "#006626",
+      "moderate": "#1b8238",
+      "subtle": "#22a047"
+    },
+    "info": {
+      "default": "#005e72",
+      "moderate": "#007a92",
+      "subtle": "#0096af"
+    },
+    "disabled": {
+      "default": "#9dafb3",
+      "subtle": "#c2cdd0"
+    },
+    "inverse": "#ffffff"
+  },
+  "border": {
+    "neutral": {
+      "subtle": "#e6ebec",
+      "moderate": "#c2cdd0",
+      "default": "#9dafb3",
+      "bold": "#2f565e",
+      "contrast": "#082d35"
+    },
+    "accent": {
+      "moderate": "#c4dbe0",
+      "default": "#a8cbd3",
+      "hover": "#7eb0bc",
+      "bold": "#388597",
+      "strong": "#11596a"
+    },
+    "danger": {
+      "default": "#ffbfc1",
+      "bold": "#df001f",
+      "strong": "#b20016"
+    },
+    "warning": {
+      "default": "#ffd787",
+      "bold": "#dc9f00",
+      "strong": "#b17600"
+    },
+    "success": {
+      "default": "#7dfd95",
+      "bold": "#1b8238",
+      "strong": "#006626"
+    },
+    "info": {
+      "default": "#9aecff",
+      "bold": "#007a92",
+      "strong": "#005e72"
+    },
+    "disabled": {
+      "default": "#e6ebec",
+      "subtle": "#f3f5f6"
+    },
+    "focus": "#388597",
+    "inverse": "rgba(255, 255, 255, 0.85)"
   }
-}
+};