@volue/design-colors 3.0.0-next.7 → 3.0.0-next.8

package/dist/generic.common.js

@@ -262,7 +262,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#00b4d1",
+      "value": "#00a7c2",
       "name": "colorBlue70",
       "path": [
         "color",
@@ -271,7 +271,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#0096af",
+      "value": "#008299",
       "name": "colorBlue80",
       "path": [
         "color",
@@ -280,7 +280,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#007a92",
+      "value": "#006c80",
       "name": "colorBlue90",
       "path": [
         "color",
@@ -289,7 +289,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#005e72",
+      "value": "#005766",
       "name": "colorBlue100",
       "path": [
         "color",
@@ -352,7 +352,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#1fc052",
+      "value": "#1eb84f",
       "name": "colorGreen70",
       "path": [
         "color",
@@ -361,7 +361,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#22a047",
+      "value": "#1d873c",
       "name": "colorGreen80",
       "path": [
         "color",
@@ -370,7 +370,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#1b8238",
+      "value": "#187233",
       "name": "colorGreen90",
       "path": [
         "color",
@@ -379,7 +379,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#006626",
+      "value": "#125426",
       "name": "colorGreen100",
       "path": [
         "color",
@@ -606,7 +606,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#c6434b",
+      "value": "#bb3a42",
       "name": "dataRed100",
       "path": [
         "color",
@@ -651,7 +651,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#b35d0a",
+      "value": "#a4540a",
       "name": "dataOrange100",
       "path": [
         "color",
@@ -696,7 +696,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#8e7333",
+      "value": "#7f672e",
       "name": "dataBrown100",
       "path": [
         "color",
@@ -741,7 +741,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#888705",
+      "value": "#767605",
       "name": "dataPear100",
       "path": [
         "color",
@@ -786,7 +786,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#66910e",
+      "value": "#587d0c",
       "name": "dataLime100",
       "path": [
         "color",
@@ -831,7 +831,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#318d36",
+      "value": "#2a792e",
       "name": "dataGreen100",
       "path": [
         "color",
@@ -876,7 +876,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#2a8879",
+      "value": "#25796b",
       "name": "dataTeal100",
       "path": [
         "color",
@@ -921,7 +921,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#2e8495",
+      "value": "#297585",
       "name": "dataAqua100",
       "path": [
         "color",
@@ -966,7 +966,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#3b7bb7",
+      "value": "#346da2",
       "name": "dataBlue100",
       "path": [
         "color",
@@ -1011,7 +1011,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#5768df",
+      "value": "#4b5cdd",
       "name": "dataLazuli100",
       "path": [
         "color",
@@ -1056,7 +1056,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#a345c5",
+      "value": "#9e3dc2",
       "name": "dataPurple100",
       "path": [
         "color",
@@ -1101,7 +1101,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#bc3d91",
+      "value": "#b53b8c",
       "name": "dataPink100",
       "path": [
         "color",
@@ -1111,70 +1111,10 @@ module.exports = {
     }
   ],
   "background": [
-    {
-      "value": "#ffffff",
-      "name": "backgroundCanvas",
-      "description": "Canvas background. Used for the background of your app.",
-      "originalName": "backgroundNeutralMinimal",
-      "path": [
-        "color",
-        "background",
-        "canvas",
-        "@"
-      ]
-    },
-    {
-      "value": "#f9fafb",
-      "name": "backgroundCanvasSubtle",
-      "description": "Subtle canvas background. Used for the background of your app, e.g. when you create a card-based layout.",
-      "originalName": "backgroundNeutralSubtle",
-      "path": [
-        "color",
-        "background",
-        "canvas",
-        "subtle"
-      ]
-    },
-    {
-      "value": "#ffffff",
-      "name": "backgroundSurface",
-      "description": "Default surface background. Used for the background area of UI components like cards, inputs etc.",
-      "originalName": "backgroundNeutralMinimal",
-      "path": [
-        "color",
-        "background",
-        "surface",
-        "@"
-      ]
-    },
-    {
-      "value": "#f3f5f6",
-      "name": "backgroundSurfaceSubtle",
-      "description": "Subtle surface background. Used for the background area of components that should stand out somewhat against default surface or app canvas.",
-      "originalName": "backgroundNeutralModerate",
-      "path": [
-        "color",
-        "background",
-        "surface",
-        "subtle"
-      ]
-    },
-    {
-      "value": "#082d35",
-      "name": "backgroundSurfaceContrast",
-      "description": "Contrast surface background. Used for backgrounds of components that should stand out from the rest of the content, such as app header or tooltips.",
-      "originalName": "backgroundNeutralContrast",
-      "path": [
-        "color",
-        "background",
-        "surface",
-        "contrast"
-      ]
-    },
     {
       "value": "#ffffff",
       "name": "backgroundNeutralMinimal",
-      "description": "Minimal neutral background.",
+      "description": "Minimal neutral background. Used for the background area of your app and UI components like cards, inputs etc.",
       "originalName": "colorWhite",
       "path": [
         "color",
@@ -1186,66 +1126,25 @@ module.exports = {
     {
       "value": "#f9fafb",
       "name": "backgroundNeutralSubtle",
-      "description": "Subtle neutral background.",
+      "description": "Subtle neutral background. Used for the background of your app, e.g. when you create a card-based layout.",
       "originalName": "colorGray0",
       "path": [
         "color",
         "background",
         "neutral",
-        "subtle",
-        "@"
-      ]
-    },
-    {
-      "value": "#f3f5f6",
-      "name": "backgroundNeutralSubtleHover",
-      "description": "Subtle neutral background hover state.",
-      "originalName": "colorGray5",
-      "path": [
-        "color",
-        "background",
-        "neutral",
-        "subtle",
-        "hover"
-      ]
-    },
-    {
-      "value": "#e6ebec",
-      "name": "backgroundNeutralSubtleActive",
-      "description": "Subtle neutral background active state.",
-      "originalName": "colorGray10",
-      "path": [
-        "color",
-        "background",
-        "neutral",
-        "subtle",
-        "active"
+        "subtle"
       ]
     },
     {
       "value": "#f3f5f6",
       "name": "backgroundNeutralModerate",
-      "description": "Moderate neutral background.",
+      "description": "Moderate neutral background. Used for the background area of components that should stand out somewhat against minimal neutral surfaces.",
       "originalName": "colorGray5",
       "path": [
         "color",
         "background",
         "neutral",
-        "moderate",
-        "@"
-      ]
-    },
-    {
-      "value": "#e6ebec",
-      "name": "backgroundNeutralModerateHover",
-      "description": "Moderate neutral background hover state.",
-      "originalName": "colorGray10",
-      "path": [
-        "color",
-        "background",
-        "neutral",
-        "moderate",
-        "hover"
+        "moderate"
       ]
     },
     {
@@ -1260,18 +1159,6 @@ module.exports = {
         "@"
       ]
     },
-    {
-      "value": "#c2cdd0",
-      "name": "backgroundNeutralHover",
-      "description": "Default neutral background hover state.",
-      "originalName": "colorGray20",
-      "path": [
-        "color",
-        "background",
-        "neutral",
-        "hover"
-      ]
-    },
     {
       "value": "#53747b",
       "name": "backgroundNeutralBold",
@@ -1299,7 +1186,7 @@ module.exports = {
     {
       "value": "#082d35",
       "name": "backgroundNeutralContrast",
-      "description": "Contrast neutral background.",
+      "description": "Contrast neutral background. Used for backgrounds of components that should stand out from the rest of the content, such as app header or tooltips.",
       "originalName": "colorGray100",
       "path": [
         "color",
@@ -1410,6 +1297,18 @@ module.exports = {
         "hover"
       ]
     },
+    {
+      "value": "#a8cbd3",
+      "name": "backgroundAccentActive",
+      "description": "Default accent background active state.",
+      "originalName": "colorAccent30",
+      "path": [
+        "color",
+        "background",
+        "accent",
+        "active"
+      ]
+    },
     {
       "value": "#5b9ba9",
       "name": "backgroundAccentBold",
@@ -1419,7 +1318,34 @@ module.exports = {
         "color",
         "background",
         "accent",
-        "bold"
+        "bold",
+        "@"
+      ]
+    },
+    {
+      "value": "#388597",
+      "name": "backgroundAccentBoldHover",
+      "description": "Bold accent background hover state.",
+      "originalName": "colorAccent70",
+      "path": [
+        "color",
+        "background",
+        "accent",
+        "bold",
+        "hover"
+      ]
+    },
+    {
+      "value": "#157084",
+      "name": "backgroundAccentBoldActive",
+      "description": "Bold accent background active state.",
+      "originalName": "colorAccent80",
+      "path": [
+        "color",
+        "background",
+        "accent",
+        "bold",
+        "active"
       ]
     },
     {
@@ -1448,6 +1374,19 @@ module.exports = {
         "hover"
       ]
     },
+    {
+      "value": "#0c4957",
+      "name": "backgroundAccentStrongActive",
+      "description": "Strong accent background active state.",
+      "originalName": "colorAccent100",
+      "path": [
+        "color",
+        "background",
+        "accent",
+        "strong",
+        "active"
+      ]
+    },
     {
       "value": "#fff7f8",
       "name": "backgroundDangerSubtle",
@@ -1511,6 +1450,18 @@ module.exports = {
         "hover"
       ]
     },
+    {
+      "value": "#ffbfc1",
+      "name": "backgroundDangerActive",
+      "description": "Default danger background active state.",
+      "originalName": "colorRed30",
+      "path": [
+        "color",
+        "background",
+        "danger",
+        "active"
+      ]
+    },
     {
       "value": "#ff3b3d",
       "name": "backgroundDangerBold",
@@ -1520,7 +1471,34 @@ module.exports = {
         "color",
         "background",
         "danger",
-        "bold"
+        "bold",
+        "@"
+      ]
+    },
+    {
+      "value": "#df001f",
+      "name": "backgroundDangerBoldHover",
+      "description": "Bold danger background hover state.",
+      "originalName": "colorRed80",
+      "path": [
+        "color",
+        "background",
+        "danger",
+        "bold",
+        "hover"
+      ]
+    },
+    {
+      "value": "#b20016",
+      "name": "backgroundDangerBoldActive",
+      "description": "Bold danger background active state.",
+      "originalName": "colorRed90",
+      "path": [
+        "color",
+        "background",
+        "danger",
+        "bold",
+        "active"
       ]
     },
     {
@@ -1549,6 +1527,19 @@ module.exports = {
         "hover"
       ]
     },
+    {
+      "value": "#9d0012",
+      "name": "backgroundDangerStrongActive",
+      "description": "Strong danger background active state.",
+      "originalName": "colorRed100",
+      "path": [
+        "color",
+        "background",
+        "danger",
+        "strong",
+        "active"
+      ]
+    },
     {
       "value": "#fff9ed",
       "name": "backgroundWarningSubtle",
@@ -1612,6 +1603,18 @@ module.exports = {
         "hover"
       ]
     },
+    {
+      "value": "#ffdd99",
+      "name": "backgroundWarningActive",
+      "description": "Default warning background active state.",
+      "originalName": "colorOrange30",
+      "path": [
+        "color",
+        "background",
+        "warning",
+        "active"
+      ]
+    },
     {
       "value": "#ffb900",
       "name": "backgroundWarningBold",
@@ -1621,7 +1624,34 @@ module.exports = {
         "color",
         "background",
         "warning",
-        "bold"
+        "bold",
+        "@"
+      ]
+    },
+    {
+      "value": "#dc9f00",
+      "name": "backgroundWarningBoldHover",
+      "description": "Bold warning background hover state.",
+      "originalName": "colorOrange80",
+      "path": [
+        "color",
+        "background",
+        "warning",
+        "bold",
+        "hover"
+      ]
+    },
+    {
+      "value": "#b17600",
+      "name": "backgroundWarningBoldActive",
+      "description": "Bold warning background active state.",
+      "originalName": "colorOrange90",
+      "path": [
+        "color",
+        "background",
+        "warning",
+        "bold",
+        "active"
       ]
     },
     {
@@ -1650,6 +1680,19 @@ module.exports = {
         "hover"
       ]
     },
+    {
+      "value": "#805400",
+      "name": "backgroundWarningStrongActive",
+      "description": "Strong warning background active state.",
+      "originalName": "colorOrange100",
+      "path": [
+        "color",
+        "background",
+        "warning",
+        "strong",
+        "active"
+      ]
+    },
     {
       "value": "#eeffef",
       "name": "backgroundSuccessSubtle",
@@ -1714,22 +1757,61 @@ module.exports = {
       ]
     },
     {
-      "value": "#22a047",
+      "value": "#b0ffbb",
+      "name": "backgroundSuccessActive",
+      "description": "Default success background active state.",
+      "originalName": "colorGreen30",
+      "path": [
+        "color",
+        "background",
+        "success",
+        "active"
+      ]
+    },
+    {
+      "value": "#1eb84f",
       "name": "backgroundSuccessBold",
       "description": "Bold success background.",
+      "originalName": "colorGreen70",
+      "path": [
+        "color",
+        "background",
+        "success",
+        "bold",
+        "@"
+      ]
+    },
+    {
+      "value": "#1d873c",
+      "name": "backgroundSuccessBoldHover",
+      "description": "Bold success background hover state.",
       "originalName": "colorGreen80",
       "path": [
         "color",
         "background",
         "success",
-        "bold"
+        "bold",
+        "hover"
+      ]
+    },
+    {
+      "value": "#187233",
+      "name": "backgroundSuccessBoldActive",
+      "description": "Bold success background active state.",
+      "originalName": "colorGreen90",
+      "path": [
+        "color",
+        "background",
+        "success",
+        "bold",
+        "active"
       ]
     },
     {
-      "value": "#1b8238",
+      "value": "#1d873c",
       "name": "backgroundSuccessStrong",
       "description": "Strong success background state.",
-      "originalName": "colorGreen90",
+      "originalName": "colorGreen80",
       "path": [
         "color",
         "background",
@@ -1739,10 +1821,10 @@ module.exports = {
       ]
     },
     {
-      "value": "#006626",
+      "value": "#187233",
       "name": "backgroundSuccessStrongHover",
       "description": "Strong success background hover state.",
-      "originalName": "colorGreen100",
+      "originalName": "colorGreen90",
       "path": [
         "color",
         "background",
@@ -1752,14 +1834,27 @@ module.exports = {
       ]
     },
     {
-      "value": "#f0fcff",
-      "name": "backgroundInfoSubtle",
-      "description": "Subtle info background.",
-      "originalName": "colorBlue5",
+      "value": "#125426",
+      "name": "backgroundSuccessStrongActive",
+      "description": "Strong success background active state.",
+      "originalName": "colorGreen100",
       "path": [
         "color",
         "background",
-        "info",
+        "success",
+        "strong",
+        "active"
+      ]
+    },
+    {
+      "value": "#f0fcff",
+      "name": "backgroundInfoSubtle",
+      "description": "Subtle info background.",
+      "originalName": "colorBlue5",
+      "path": [
+        "color",
+        "background",
+        "info",
         "subtle",
         "@"
       ]
@@ -1815,22 +1910,61 @@ module.exports = {
       ]
     },
     {
-      "value": "#0096af",
+      "value": "#bff3ff",
+      "name": "backgroundInfoActive",
+      "description": "Default info background active state.",
+      "originalName": "colorBlue30",
+      "path": [
+        "color",
+        "background",
+        "info",
+        "active"
+      ]
+    },
+    {
+      "value": "#00a7c2",
       "name": "backgroundInfoBold",
       "description": "Bold info background.",
+      "originalName": "colorBlue70",
+      "path": [
+        "color",
+        "background",
+        "info",
+        "bold",
+        "@"
+      ]
+    },
+    {
+      "value": "#008299",
+      "name": "backgroundInfoBoldHover",
+      "description": "Bold info background hover state.",
       "originalName": "colorBlue80",
       "path": [
         "color",
         "background",
         "info",
-        "bold"
+        "bold",
+        "hover"
+      ]
+    },
+    {
+      "value": "#006c80",
+      "name": "backgroundInfoBoldActive",
+      "description": "Bold info background active state.",
+      "originalName": "colorBlue90",
+      "path": [
+        "color",
+        "background",
+        "info",
+        "bold",
+        "active"
       ]
     },
     {
-      "value": "#007a92",
+      "value": "#008299",
       "name": "backgroundInfoStrong",
       "description": "Strong info background state.",
-      "originalName": "colorBlue90",
+      "originalName": "colorBlue80",
       "path": [
         "color",
         "background",
@@ -1840,10 +1974,10 @@ module.exports = {
       ]
     },
     {
-      "value": "#005e72",
+      "value": "#006c80",
       "name": "backgroundInfoStrongHover",
       "description": "Strong info background hover state.",
-      "originalName": "colorBlue100",
+      "originalName": "colorBlue90",
       "path": [
         "color",
         "background",
@@ -1852,6 +1986,19 @@ module.exports = {
         "hover"
       ]
     },
+    {
+      "value": "#005766",
+      "name": "backgroundInfoStrongActive",
+      "description": "Strong info background active state.",
+      "originalName": "colorBlue100",
+      "path": [
+        "color",
+        "background",
+        "info",
+        "strong",
+        "active"
+      ]
+    },
     {
       "value": "#e6ebec",
       "name": "backgroundDisabled",
@@ -1875,42 +2022,9 @@ module.exports = {
         "disabled",
         "subtle"
       ]
-    },
-    {
-      "value": "rgba(255, 255, 255, 0.113)",
-      "name": "backgroundInverse",
-      "description": "Inverse background. Used for backgrounds of elements on a strong background.",
-      "originalName": "backgroundNeutralMinimal",
-      "path": [
-        "color",
-        "background",
-        "inverse"
-      ]
     }
   ],
   "foreground": [
-    {
-      "value": "#082d35",
-      "name": "foregroundBody",
-      "description": "Body foreground. Used for the default body text of your app.",
-      "originalName": "foregroundNeutral",
-      "path": [
-        "color",
-        "foreground",
-        "body"
-      ]
-    },
-    {
-      "value": "#157084",
-      "name": "foregroundLink",
-      "description": "Link foreground",
-      "originalName": "foregroundAccentModerate",
-      "path": [
-        "color",
-        "foreground",
-        "link"
-      ]
-    },
     {
       "value": "#082d35",
       "name": "foregroundNeutral",
@@ -2080,7 +2194,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#006626",
+      "value": "#125426",
       "name": "foregroundSuccess",
       "description": "Default success foreground.",
       "originalName": "colorGreen100",
@@ -2092,7 +2206,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#1b8238",
+      "value": "#187233",
       "name": "foregroundSuccessModerate",
       "description": "Moderate success foreground.",
       "originalName": "colorGreen90",
@@ -2104,7 +2218,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#1fc052",
+      "value": "#1eb84f",
       "name": "foregroundSuccessSubtle",
       "description": "Subtle success foreground.",
       "originalName": "colorGreen70",
@@ -2116,7 +2230,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#005e72",
+      "value": "#005766",
       "name": "foregroundInfo",
       "description": "Default info foreground.",
       "originalName": "colorBlue100",
@@ -2128,7 +2242,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#007a92",
+      "value": "#006c80",
       "name": "foregroundInfoModerate",
       "description": "Moderate info foreground.",
       "originalName": "colorBlue90",
@@ -2140,7 +2254,7 @@ module.exports = {
       ]
     },
     {
-      "value": "#00b4d1",
+      "value": "#00a7c2",
       "name": "foregroundInfoSubtle",
       "description": "Subtle info foreground.",
       "originalName": "colorBlue70",
@@ -2284,6 +2398,18 @@ module.exports = {
         "hover"
       ]
     },
+    {
+      "value": "#5b9ba9",
+      "name": "borderAccentActive",
+      "description": "Default accent border active state.",
+      "originalName": "colorAccent60",
+      "path": [
+        "color",
+        "border",
+        "accent",
+        "active"
+      ]
+    },
     {
       "value": "#388597",
       "name": "borderAccentBold",
@@ -2393,10 +2519,10 @@ module.exports = {
       ]
     },
     {
-      "value": "#1b8238",
+      "value": "#1d873c",
       "name": "borderSuccessBold",
       "description": "Bold success border.",
-      "originalName": "colorGreen90",
+      "originalName": "colorGreen80",
       "path": [
         "color",
         "border",
@@ -2405,10 +2531,10 @@ module.exports = {
       ]
     },
     {
-      "value": "#006626",
+      "value": "#187233",
       "name": "borderSuccessStrong",
       "description": "Strong success border.",
-      "originalName": "colorGreen100",
+      "originalName": "colorGreen90",
       "path": [
         "color",
         "border",
@@ -2429,10 +2555,10 @@ module.exports = {
       ]
     },
     {
-      "value": "#007a92",
+      "value": "#008299",
       "name": "borderInfoBold",
       "description": "Bold info border.",
-      "originalName": "colorBlue90",
+      "originalName": "colorBlue80",
       "path": [
         "color",
         "border",
@@ -2441,10 +2567,10 @@ module.exports = {
       ]
     },
     {
-      "value": "#005e72",
+      "value": "#006c80",
       "name": "borderInfoStrong",
       "description": "Strong info border.",
-      "originalName": "colorBlue100",
+      "originalName": "colorBlue90",
       "path": [
         "color",
         "border",
@@ -2476,17 +2602,6 @@ module.exports = {
         "subtle"
       ]
     },
-    {
-      "value": "#388597",
-      "name": "borderFocus",
-      "description": "Border focus state.",
-      "originalName": "borderAccentBold",
-      "path": [
-        "color",
-        "border",
-        "focus"
-      ]
-    },
     {
       "value": "rgba(255, 255, 255, 0.85)",
       "name": "borderInverse",
@@ -2502,13 +2617,14 @@ module.exports = {
   "rgb": [
     {
       "value": "255, 255, 255",
-      "name": "rgbBackgroundSurface",
-      "originalName": "backgroundSurface",
+      "name": "rgbBackgroundNeutralMinimal",
+      "originalName": "backgroundNeutralMinimal",
       "path": [
         "color",
         "rgb",
         "background",
-        "surface"
+        "neutral",
+        "minimal"
       ]
     },
     {
@@ -2668,7 +2784,7 @@ module.exports = {
       ]
     },
     {
-      "value": "34, 160, 71",
+      "value": "30, 184, 79",
       "name": "rgbBackgroundSuccessBold",
       "originalName": "backgroundSuccessBold",
       "path": [
@@ -2680,7 +2796,7 @@ module.exports = {
       ]
     },
     {
-      "value": "27, 130, 56",
+      "value": "29, 135, 60",
       "name": "rgbBackgroundSuccessStrong",
       "originalName": "backgroundSuccessStrong",
       "path": [
@@ -2704,7 +2820,7 @@ module.exports = {
       ]
     },
     {
-      "value": "0, 150, 175",
+      "value": "0, 167, 194",
       "name": "rgbBackgroundInfoBold",
       "originalName": "backgroundInfoBold",
       "path": [
@@ -2716,7 +2832,7 @@ module.exports = {
       ]
     },
     {
-      "value": "0, 122, 146",
+      "value": "0, 130, 153",
       "name": "rgbBackgroundInfoStrong",
       "originalName": "backgroundInfoStrong",
       "path": [
@@ -2728,663 +2844,663 @@ module.exports = {
       ]
     },
     {
-      "value": "247, 230, 232",
-      "name": "rgbDataRed20",
-      "originalName": "dataRed20",
+      "value": "220, 244, 239",
+      "name": "rgbDataTeal20",
+      "originalName": "dataTeal20",
       "path": [
         "color",
         "rgb",
         "data",
-        "red20"
+        "teal20"
       ]
     },
     {
-      "value": "236, 199, 201",
-      "name": "rgbDataRed40",
-      "originalName": "dataRed40",
+      "value": "167, 223, 214",
+      "name": "rgbDataTeal40",
+      "originalName": "dataTeal40",
       "path": [
         "color",
         "rgb",
         "data",
-        "red40"
+        "teal40"
       ]
     },
     {
-      "value": "230, 161, 165",
-      "name": "rgbDataRed60",
-      "originalName": "dataRed60",
+      "value": "111, 201, 186",
+      "name": "rgbDataTeal60",
+      "originalName": "dataTeal60",
       "path": [
         "color",
         "rgb",
         "data",
-        "red60"
+        "teal60"
       ]
     },
     {
-      "value": "235, 112, 114",
-      "name": "rgbDataRed80",
-      "originalName": "dataRed80",
+      "value": "58, 177, 158",
+      "name": "rgbDataTeal80",
+      "originalName": "dataTeal80",
       "path": [
         "color",
         "rgb",
         "data",
-        "red80"
+        "teal80"
       ]
     },
     {
-      "value": "198, 67, 75",
-      "name": "rgbDataRed100",
-      "originalName": "dataRed100",
+      "value": "37, 121, 107",
+      "name": "rgbDataTeal100",
+      "originalName": "dataTeal100",
       "path": [
         "color",
         "rgb",
         "data",
-        "red100"
+        "teal100"
       ]
     },
     {
-      "value": "250, 235, 220",
-      "name": "rgbDataOrange20",
-      "originalName": "dataOrange20",
+      "value": "244, 234, 248",
+      "name": "rgbDataPurple20",
+      "originalName": "dataPurple20",
       "path": [
         "color",
         "rgb",
         "data",
-        "orange20"
+        "purple20"
       ]
     },
     {
-      "value": "245, 202, 163",
-      "name": "rgbDataOrange40",
-      "originalName": "dataOrange40",
+      "value": "226, 198, 236",
+      "name": "rgbDataPurple40",
+      "originalName": "dataPurple40",
       "path": [
         "color",
         "rgb",
         "data",
-        "orange40"
+        "purple40"
       ]
     },
     {
-      "value": "237, 163, 94",
-      "name": "rgbDataOrange60",
-      "originalName": "dataOrange60",
+      "value": "210, 161, 227",
+      "name": "rgbDataPurple60",
+      "originalName": "dataPurple60",
       "path": [
         "color",
         "rgb",
         "data",
-        "orange60"
+        "purple60"
       ]
     },
     {
-      "value": "229, 123, 26",
-      "name": "rgbDataOrange80",
-      "originalName": "dataOrange80",
+      "value": "197, 116, 228",
+      "name": "rgbDataPurple80",
+      "originalName": "dataPurple80",
       "path": [
         "color",
         "rgb",
         "data",
-        "orange80"
+        "purple80"
       ]
     },
     {
-      "value": "179, 93, 10",
-      "name": "rgbDataOrange100",
-      "originalName": "dataOrange100",
+      "value": "158, 61, 194",
+      "name": "rgbDataPurple100",
+      "originalName": "dataPurple100",
       "path": [
         "color",
         "rgb",
         "data",
-        "orange100"
+        "purple100"
       ]
     },
     {
-      "value": "244, 237, 222",
-      "name": "rgbDataBrown20",
-      "originalName": "dataBrown20",
+      "value": "248, 233, 242",
+      "name": "rgbDataPink20",
+      "originalName": "dataPink20",
       "path": [
         "color",
         "rgb",
         "data",
-        "brown20"
+        "pink20"
       ]
     },
     {
-      "value": "232, 207, 150",
-      "name": "rgbDataBrown40",
-      "originalName": "dataBrown40",
+      "value": "235, 197, 222",
+      "name": "rgbDataPink40",
+      "originalName": "dataPink40",
       "path": [
         "color",
         "rgb",
         "data",
-        "brown40"
+        "pink40"
       ]
     },
     {
-      "value": "216, 177, 85",
-      "name": "rgbDataBrown60",
-      "originalName": "dataBrown60",
+      "value": "226, 157, 201",
+      "name": "rgbDataPink60",
+      "originalName": "dataPink60",
       "path": [
         "color",
         "rgb",
         "data",
-        "brown60"
+        "pink60"
       ]
     },
     {
-      "value": "184, 151, 73",
-      "name": "rgbDataBrown80",
-      "originalName": "dataBrown80",
+      "value": "226, 106, 181",
+      "name": "rgbDataPink80",
+      "originalName": "dataPink80",
       "path": [
         "color",
         "rgb",
         "data",
-        "brown80"
+        "pink80"
       ]
     },
     {
-      "value": "142, 115, 51",
-      "name": "rgbDataBrown100",
-      "originalName": "dataBrown100",
+      "value": "181, 59, 140",
+      "name": "rgbDataPink100",
+      "originalName": "dataPink100",
       "path": [
         "color",
         "rgb",
         "data",
-        "brown100"
+        "pink100"
       ]
     },
     {
-      "value": "252, 252, 219",
-      "name": "rgbDataPear20",
-      "originalName": "dataPear20",
+      "value": "227, 241, 246",
+      "name": "rgbDataAqua20",
+      "originalName": "dataAqua20",
       "path": [
         "color",
         "rgb",
         "data",
-        "pear20"
+        "aqua20"
       ]
     },
     {
-      "value": "232, 229, 76",
-      "name": "rgbDataPear40",
-      "originalName": "dataPear40",
+      "value": "177, 218, 228",
+      "name": "rgbDataAqua40",
+      "originalName": "dataAqua40",
       "path": [
         "color",
         "rgb",
         "data",
-        "pear40"
+        "aqua40"
       ]
     },
     {
-      "value": "203, 201, 32",
-      "name": "rgbDataPear60",
-      "originalName": "dataPear60",
+      "value": "122, 196, 211",
+      "name": "rgbDataAqua60",
+      "originalName": "dataAqua60",
       "path": [
         "color",
         "rgb",
         "data",
-        "pear60"
+        "aqua60"
       ]
     },
     {
-      "value": "175, 173, 7",
-      "name": "rgbDataPear80",
-      "originalName": "dataPear80",
+      "value": "66, 171, 194",
+      "name": "rgbDataAqua80",
+      "originalName": "dataAqua80",
       "path": [
         "color",
         "rgb",
         "data",
-        "pear80"
+        "aqua80"
       ]
     },
     {
-      "value": "136, 135, 5",
-      "name": "rgbDataPear100",
-      "originalName": "dataPear100",
-      "path": [
+      "value": "41, 117, 133",
+      "name": "rgbDataAqua100",
+      "originalName": "dataAqua100",
+      "path": [
         "color",
         "rgb",
         "data",
-        "pear100"
+        "aqua100"
       ]
     },
     {
-      "value": "241, 252, 220",
-      "name": "rgbDataLime20",
-      "originalName": "dataLime20",
+      "value": "230, 239, 247",
+      "name": "rgbDataBlue20",
+      "originalName": "dataBlue20",
       "path": [
         "color",
         "rgb",
         "data",
-        "lime20"
+        "blue20"
       ]
     },
     {
-      "value": "203, 237, 122",
-      "name": "rgbDataLime40",
-      "originalName": "dataLime40",
+      "value": "191, 213, 233",
+      "name": "rgbDataBlue40",
+      "originalName": "dataBlue40",
       "path": [
         "color",
         "rgb",
         "data",
-        "lime40"
+        "blue40"
       ]
     },
     {
-      "value": "167, 212, 65",
-      "name": "rgbDataLime60",
-      "originalName": "dataLime60",
+      "value": "147, 187, 223",
+      "name": "rgbDataBlue60",
+      "originalName": "dataBlue60",
       "path": [
         "color",
         "rgb",
         "data",
-        "lime60"
+        "blue60"
       ]
     },
     {
-      "value": "132, 186, 18",
-      "name": "rgbDataLime80",
-      "originalName": "dataLime80",
+      "value": "96, 161, 223",
+      "name": "rgbDataBlue80",
+      "originalName": "dataBlue80",
       "path": [
         "color",
         "rgb",
         "data",
-        "lime80"
+        "blue80"
       ]
     },
     {
-      "value": "102, 145, 14",
-      "name": "rgbDataLime100",
-      "originalName": "dataLime100",
+      "value": "52, 109, 162",
+      "name": "rgbDataBlue100",
+      "originalName": "dataBlue100",
       "path": [
         "color",
         "rgb",
         "data",
-        "lime100"
+        "blue100"
       ]
     },
     {
-      "value": "223, 245, 225",
-      "name": "rgbDataGreen20",
-      "originalName": "dataGreen20",
+      "value": "236, 237, 249",
+      "name": "rgbDataLazuli20",
+      "originalName": "dataLazuli20",
       "path": [
         "color",
         "rgb",
         "data",
-        "green20"
+        "lazuli20"
       ]
     },
     {
-      "value": "173, 226, 176",
-      "name": "rgbDataGreen40",
-      "originalName": "dataGreen40",
+      "value": "204, 207, 238",
+      "name": "rgbDataLazuli40",
+      "originalName": "dataLazuli40",
       "path": [
         "color",
         "rgb",
         "data",
-        "green40"
+        "lazuli40"
       ]
     },
     {
-      "value": "118, 206, 122",
-      "name": "rgbDataGreen60",
-      "originalName": "dataGreen60",
+      "value": "170, 178, 233",
+      "name": "rgbDataLazuli60",
+      "originalName": "dataLazuli60",
       "path": [
         "color",
         "rgb",
         "data",
-        "green60"
+        "lazuli60"
       ]
     },
     {
-      "value": "63, 184, 69",
-      "name": "rgbDataGreen80",
-      "originalName": "dataGreen80",
+      "value": "127, 148, 242",
+      "name": "rgbDataLazuli80",
+      "originalName": "dataLazuli80",
       "path": [
         "color",
         "rgb",
         "data",
-        "green80"
+        "lazuli80"
       ]
     },
     {
-      "value": "49, 141, 54",
-      "name": "rgbDataGreen100",
-      "originalName": "dataGreen100",
+      "value": "75, 92, 221",
+      "name": "rgbDataLazuli100",
+      "originalName": "dataLazuli100",
       "path": [
         "color",
         "rgb",
         "data",
-        "green100"
+        "lazuli100"
       ]
     },
     {
-      "value": "220, 244, 239",
-      "name": "rgbDataTeal20",
-      "originalName": "dataTeal20",
+      "value": "223, 245, 225",
+      "name": "rgbDataGreen20",
+      "originalName": "dataGreen20",
       "path": [
         "color",
         "rgb",
         "data",
-        "teal20"
+        "green20"
       ]
     },
     {
-      "value": "167, 223, 214",
-      "name": "rgbDataTeal40",
-      "originalName": "dataTeal40",
+      "value": "173, 226, 176",
+      "name": "rgbDataGreen40",
+      "originalName": "dataGreen40",
       "path": [
         "color",
         "rgb",
         "data",
-        "teal40"
+        "green40"
       ]
     },
     {
-      "value": "111, 201, 186",
-      "name": "rgbDataTeal60",
-      "originalName": "dataTeal60",
+      "value": "118, 206, 122",
+      "name": "rgbDataGreen60",
+      "originalName": "dataGreen60",
       "path": [
         "color",
         "rgb",
         "data",
-        "teal60"
+        "green60"
       ]
     },
     {
-      "value": "58, 177, 158",
-      "name": "rgbDataTeal80",
-      "originalName": "dataTeal80",
+      "value": "63, 184, 69",
+      "name": "rgbDataGreen80",
+      "originalName": "dataGreen80",
       "path": [
         "color",
         "rgb",
         "data",
-        "teal80"
+        "green80"
       ]
     },
     {
-      "value": "42, 136, 121",
-      "name": "rgbDataTeal100",
-      "originalName": "dataTeal100",
+      "value": "42, 121, 46",
+      "name": "rgbDataGreen100",
+      "originalName": "dataGreen100",
       "path": [
         "color",
         "rgb",
         "data",
-        "teal100"
+        "green100"
       ]
     },
     {
-      "value": "227, 241, 246",
-      "name": "rgbDataAqua20",
-      "originalName": "dataAqua20",
+      "value": "241, 252, 220",
+      "name": "rgbDataLime20",
+      "originalName": "dataLime20",
       "path": [
         "color",
         "rgb",
         "data",
-        "aqua20"
+        "lime20"
       ]
     },
     {
-      "value": "177, 218, 228",
-      "name": "rgbDataAqua40",
-      "originalName": "dataAqua40",
+      "value": "203, 237, 122",
+      "name": "rgbDataLime40",
+      "originalName": "dataLime40",
       "path": [
         "color",
         "rgb",
         "data",
-        "aqua40"
+        "lime40"
       ]
     },
     {
-      "value": "122, 196, 211",
-      "name": "rgbDataAqua60",
-      "originalName": "dataAqua60",
+      "value": "167, 212, 65",
+      "name": "rgbDataLime60",
+      "originalName": "dataLime60",
       "path": [
         "color",
         "rgb",
         "data",
-        "aqua60"
+        "lime60"
       ]
     },
     {
-      "value": "66, 171, 194",
-      "name": "rgbDataAqua80",
-      "originalName": "dataAqua80",
+      "value": "132, 186, 18",
+      "name": "rgbDataLime80",
+      "originalName": "dataLime80",
       "path": [
         "color",
         "rgb",
         "data",
-        "aqua80"
+        "lime80"
       ]
     },
     {
-      "value": "46, 132, 149",
-      "name": "rgbDataAqua100",
-      "originalName": "dataAqua100",
+      "value": "88, 125, 12",
+      "name": "rgbDataLime100",
+      "originalName": "dataLime100",
       "path": [
         "color",
         "rgb",
         "data",
-        "aqua100"
+        "lime100"
       ]
     },
     {
-      "value": "230, 239, 247",
-      "name": "rgbDataBlue20",
-      "originalName": "dataBlue20",
+      "value": "250, 235, 220",
+      "name": "rgbDataOrange20",
+      "originalName": "dataOrange20",
       "path": [
         "color",
         "rgb",
         "data",
-        "blue20"
+        "orange20"
       ]
     },
     {
-      "value": "191, 213, 233",
-      "name": "rgbDataBlue40",
-      "originalName": "dataBlue40",
+      "value": "245, 202, 163",
+      "name": "rgbDataOrange40",
+      "originalName": "dataOrange40",
       "path": [
         "color",
         "rgb",
         "data",
-        "blue40"
+        "orange40"
       ]
     },
     {
-      "value": "147, 187, 223",
-      "name": "rgbDataBlue60",
-      "originalName": "dataBlue60",
+      "value": "237, 163, 94",
+      "name": "rgbDataOrange60",
+      "originalName": "dataOrange60",
       "path": [
         "color",
         "rgb",
         "data",
-        "blue60"
+        "orange60"
       ]
     },
     {
-      "value": "96, 161, 223",
-      "name": "rgbDataBlue80",
-      "originalName": "dataBlue80",
+      "value": "229, 123, 26",
+      "name": "rgbDataOrange80",
+      "originalName": "dataOrange80",
       "path": [
         "color",
         "rgb",
         "data",
-        "blue80"
+        "orange80"
       ]
     },
     {
-      "value": "59, 123, 183",
-      "name": "rgbDataBlue100",
-      "originalName": "dataBlue100",
+      "value": "164, 84, 10",
+      "name": "rgbDataOrange100",
+      "originalName": "dataOrange100",
       "path": [
         "color",
         "rgb",
         "data",
-        "blue100"
+        "orange100"
       ]
     },
     {
-      "value": "236, 237, 249",
-      "name": "rgbDataLazuli20",
-      "originalName": "dataLazuli20",
+      "value": "252, 252, 219",
+      "name": "rgbDataPear20",
+      "originalName": "dataPear20",
       "path": [
         "color",
         "rgb",
         "data",
-        "lazuli20"
+        "pear20"
       ]
     },
     {
-      "value": "204, 207, 238",
-      "name": "rgbDataLazuli40",
-      "originalName": "dataLazuli40",
+      "value": "232, 229, 76",
+      "name": "rgbDataPear40",
+      "originalName": "dataPear40",
       "path": [
         "color",
         "rgb",
         "data",
-        "lazuli40"
+        "pear40"
       ]
     },
     {
-      "value": "170, 178, 233",
-      "name": "rgbDataLazuli60",
-      "originalName": "dataLazuli60",
+      "value": "203, 201, 32",
+      "name": "rgbDataPear60",
+      "originalName": "dataPear60",
       "path": [
         "color",
         "rgb",
         "data",
-        "lazuli60"
+        "pear60"
       ]
     },
     {
-      "value": "127, 148, 242",
-      "name": "rgbDataLazuli80",
-      "originalName": "dataLazuli80",
+      "value": "175, 173, 7",
+      "name": "rgbDataPear80",
+      "originalName": "dataPear80",
       "path": [
         "color",
         "rgb",
         "data",
-        "lazuli80"
+        "pear80"
       ]
     },
     {
-      "value": "87, 104, 223",
-      "name": "rgbDataLazuli100",
-      "originalName": "dataLazuli100",
+      "value": "118, 118, 5",
+      "name": "rgbDataPear100",
+      "originalName": "dataPear100",
       "path": [
         "color",
         "rgb",
         "data",
-        "lazuli100"
+        "pear100"
       ]
     },
     {
-      "value": "244, 234, 248",
-      "name": "rgbDataPurple20",
-      "originalName": "dataPurple20",
+      "value": "244, 237, 222",
+      "name": "rgbDataBrown20",
+      "originalName": "dataBrown20",
       "path": [
         "color",
         "rgb",
         "data",
-        "purple20"
+        "brown20"
       ]
     },
     {
-      "value": "226, 198, 236",
-      "name": "rgbDataPurple40",
-      "originalName": "dataPurple40",
+      "value": "232, 207, 150",
+      "name": "rgbDataBrown40",
+      "originalName": "dataBrown40",
       "path": [
         "color",
         "rgb",
         "data",
-        "purple40"
+        "brown40"
       ]
     },
     {
-      "value": "210, 161, 227",
-      "name": "rgbDataPurple60",
-      "originalName": "dataPurple60",
+      "value": "216, 177, 85",
+      "name": "rgbDataBrown60",
+      "originalName": "dataBrown60",
       "path": [
         "color",
         "rgb",
         "data",
-        "purple60"
+        "brown60"
       ]
     },
     {
-      "value": "197, 116, 228",
-      "name": "rgbDataPurple80",
-      "originalName": "dataPurple80",
+      "value": "184, 151, 73",
+      "name": "rgbDataBrown80",
+      "originalName": "dataBrown80",
       "path": [
         "color",
         "rgb",
         "data",
-        "purple80"
+        "brown80"
       ]
     },
     {
-      "value": "163, 69, 197",
-      "name": "rgbDataPurple100",
-      "originalName": "dataPurple100",
+      "value": "127, 103, 46",
+      "name": "rgbDataBrown100",
+      "originalName": "dataBrown100",
       "path": [
         "color",
         "rgb",
         "data",
-        "purple100"
+        "brown100"
       ]
     },
     {
-      "value": "248, 233, 242",
-      "name": "rgbDataPink20",
-      "originalName": "dataPink20",
+      "value": "247, 230, 232",
+      "name": "rgbDataRed20",
+      "originalName": "dataRed20",
       "path": [
         "color",
         "rgb",
         "data",
-        "pink20"
+        "red20"
       ]
     },
     {
-      "value": "235, 197, 222",
-      "name": "rgbDataPink40",
-      "originalName": "dataPink40",
+      "value": "236, 199, 201",
+      "name": "rgbDataRed40",
+      "originalName": "dataRed40",
       "path": [
         "color",
         "rgb",
         "data",
-        "pink40"
+        "red40"
       ]
     },
     {
-      "value": "226, 157, 201",
-      "name": "rgbDataPink60",
-      "originalName": "dataPink60",
+      "value": "230, 161, 165",
+      "name": "rgbDataRed60",
+      "originalName": "dataRed60",
       "path": [
         "color",
         "rgb",
         "data",
-        "pink60"
+        "red60"
       ]
     },
     {
-      "value": "226, 106, 181",
-      "name": "rgbDataPink80",
-      "originalName": "dataPink80",
+      "value": "235, 112, 114",
+      "name": "rgbDataRed80",
+      "originalName": "dataRed80",
       "path": [
         "color",
         "rgb",
         "data",
-        "pink80"
+        "red80"
       ]
     },
     {
-      "value": "188, 61, 145",
-      "name": "rgbDataPink100",
-      "originalName": "dataPink100",
+      "value": "187, 58, 66",
+      "name": "rgbDataRed100",
+      "originalName": "dataRed100",
       "path": [
         "color",
         "rgb",
         "data",
-        "pink100"
+        "red100"
       ]
     }
   ]