@gitlab/ui 67.5.0 → 67.5.1

package/scss_to_js/scss_variables.json

@@ -197,21 +197,11 @@
       "value": "1280px",
       "compiledValue": "1280px"
     },
-    {
-      "name": "$black",
-      "value": "#000",
-      "compiledValue": "#000"
-    },
     {
       "name": "$black-normal",
       "value": "#333",
       "compiledValue": "#333"
     },
-    {
-      "name": "$white",
-      "value": "#fff",
-      "compiledValue": "#fff"
-    },
     {
       "name": "$white-contrast",
       "value": "#fff",
@@ -238,1955 +228,1965 @@
       "compiledValue": "rgba(255, 255, 255, 0)"
     },
     {
-      "name": "$green-50",
-      "value": "#ecf4ee",
-      "compiledValue": "#ecf4ee"
+      "name": "$theme-indigo-50",
+      "value": "#f1f1ff",
+      "compiledValue": "#f1f1ff"
     },
     {
-      "name": "$green-100",
-      "value": "#c3e6cd",
-      "compiledValue": "#c3e6cd"
+      "name": "$theme-indigo-100",
+      "value": "#dbdbf8",
+      "compiledValue": "#dbdbf8"
     },
     {
-      "name": "$green-200",
-      "value": "#91d4a8",
-      "compiledValue": "#91d4a8"
+      "name": "$theme-indigo-200",
+      "value": "#c7c7f2",
+      "compiledValue": "#c7c7f2"
     },
     {
-      "name": "$green-300",
-      "value": "#52b87a",
-      "compiledValue": "#52b87a"
+      "name": "$theme-indigo-300",
+      "value": "#a2a2e6",
+      "compiledValue": "#a2a2e6"
     },
     {
-      "name": "$green-400",
-      "value": "#2da160",
-      "compiledValue": "#2da160"
+      "name": "$theme-indigo-400",
+      "value": "#8181d7",
+      "compiledValue": "#8181d7"
     },
     {
-      "name": "$green-500",
-      "value": "#108548",
-      "compiledValue": "#108548"
+      "name": "$theme-indigo-500",
+      "value": "#6666c4",
+      "compiledValue": "#6666c4"
     },
     {
-      "name": "$green-600",
-      "value": "#217645",
-      "compiledValue": "#217645"
+      "name": "$theme-indigo-600",
+      "value": "#5252b5",
+      "compiledValue": "#5252b5"
     },
     {
-      "name": "$green-700",
-      "value": "#24663b",
-      "compiledValue": "#24663b"
+      "name": "$theme-indigo-700",
+      "value": "#41419f",
+      "compiledValue": "#41419f"
     },
     {
-      "name": "$green-800",
-      "value": "#0d532a",
-      "compiledValue": "#0d532a"
+      "name": "$theme-indigo-800",
+      "value": "#303083",
+      "compiledValue": "#303083"
     },
     {
-      "name": "$green-900",
-      "value": "#0a4020",
-      "compiledValue": "#0a4020"
+      "name": "$theme-indigo-900",
+      "value": "#222261",
+      "compiledValue": "#222261"
     },
     {
-      "name": "$green-950",
-      "value": "#072b15",
-      "compiledValue": "#072b15"
+      "name": "$theme-indigo-950",
+      "value": "#14143d",
+      "compiledValue": "#14143d"
     },
     {
-      "name": "$blue-50",
-      "value": "#e9f3fc",
-      "compiledValue": "#e9f3fc"
+      "name": "$theme-blue-50",
+      "value": "#cdd8e3",
+      "compiledValue": "#cdd8e3"
     },
     {
-      "name": "$blue-100",
-      "value": "#cbe2f9",
-      "compiledValue": "#cbe2f9"
+      "name": "$theme-blue-100",
+      "value": "#b9cadc",
+      "compiledValue": "#b9cadc"
     },
     {
-      "name": "$blue-200",
-      "value": "#9dc7f1",
-      "compiledValue": "#9dc7f1"
+      "name": "$theme-blue-200",
+      "value": "#a6bdd5",
+      "compiledValue": "#a6bdd5"
     },
     {
-      "name": "$blue-300",
-      "value": "#63a6e9",
-      "compiledValue": "#63a6e9"
+      "name": "$theme-blue-300",
+      "value": "#81a5c9",
+      "compiledValue": "#81a5c9"
     },
     {
-      "name": "$blue-400",
-      "value": "#428fdc",
-      "compiledValue": "#428fdc"
+      "name": "$theme-blue-400",
+      "value": "#628eb9",
+      "compiledValue": "#628eb9"
     },
     {
-      "name": "$blue-500",
-      "value": "#1f75cb",
-      "compiledValue": "#1f75cb"
+      "name": "$theme-blue-500",
+      "value": "#4977a5",
+      "compiledValue": "#4977a5"
     },
     {
-      "name": "$blue-600",
-      "value": "#1068bf",
-      "compiledValue": "#1068bf"
+      "name": "$theme-blue-600",
+      "value": "#346596",
+      "compiledValue": "#346596"
     },
     {
-      "name": "$blue-700",
-      "value": "#0b5cad",
-      "compiledValue": "#0b5cad"
+      "name": "$theme-blue-700",
+      "value": "#235180",
+      "compiledValue": "#235180"
     },
     {
-      "name": "$blue-800",
-      "value": "#064787",
-      "compiledValue": "#064787"
+      "name": "$theme-blue-800",
+      "value": "#153c63",
+      "compiledValue": "#153c63"
     },
     {
-      "name": "$blue-900",
-      "value": "#033464",
-      "compiledValue": "#033464"
+      "name": "$theme-blue-900",
+      "value": "#0b2640",
+      "compiledValue": "#0b2640"
     },
     {
-      "name": "$blue-950",
-      "value": "#002850",
-      "compiledValue": "#002850"
+      "name": "$theme-blue-950",
+      "value": "#04101c",
+      "compiledValue": "#04101c"
     },
     {
-      "name": "$orange-50",
-      "value": "#fdf1dd",
-      "compiledValue": "#fdf1dd"
+      "name": "$theme-light-blue-50",
+      "value": "#dde6ee",
+      "compiledValue": "#dde6ee"
     },
     {
-      "name": "$orange-100",
-      "value": "#f5d9a8",
-      "compiledValue": "#f5d9a8"
+      "name": "$theme-light-blue-100",
+      "value": "#c1d4e6",
+      "compiledValue": "#c1d4e6"
     },
     {
-      "name": "$orange-200",
-      "value": "#e9be74",
-      "compiledValue": "#e9be74"
+      "name": "$theme-light-blue-200",
+      "value": "#a0bedc",
+      "compiledValue": "#a0bedc"
     },
     {
-      "name": "$orange-300",
-      "value": "#d99530",
-      "compiledValue": "#d99530"
+      "name": "$theme-light-blue-300",
+      "value": "#74a3d3",
+      "compiledValue": "#74a3d3"
     },
     {
-      "name": "$orange-400",
-      "value": "#c17d10",
-      "compiledValue": "#c17d10"
+      "name": "$theme-light-blue-400",
+      "value": "#4f8bc7",
+      "compiledValue": "#4f8bc7"
     },
     {
-      "name": "$orange-500",
-      "value": "#ab6100",
-      "compiledValue": "#ab6100"
+      "name": "$theme-light-blue-500",
+      "value": "#3476b9",
+      "compiledValue": "#3476b9"
     },
     {
-      "name": "$orange-600",
-      "value": "#9e5400",
-      "compiledValue": "#9e5400"
+      "name": "$theme-light-blue-600",
+      "value": "#2268ae",
+      "compiledValue": "#2268ae"
     },
     {
-      "name": "$orange-700",
-      "value": "#8f4700",
-      "compiledValue": "#8f4700"
+      "name": "$theme-light-blue-700",
+      "value": "#145aa1",
+      "compiledValue": "#145aa1"
     },
     {
-      "name": "$orange-800",
-      "value": "#703800",
-      "compiledValue": "#703800"
+      "name": "$theme-light-blue-800",
+      "value": "#0e4d8d",
+      "compiledValue": "#0e4d8d"
     },
     {
-      "name": "$orange-900",
-      "value": "#5c2900",
-      "compiledValue": "#5c2900"
+      "name": "$theme-light-blue-900",
+      "value": "#0c4277",
+      "compiledValue": "#0c4277"
     },
     {
-      "name": "$orange-950",
-      "value": "#421f00",
-      "compiledValue": "#421f00"
+      "name": "$theme-light-blue-950",
+      "value": "#0a3764",
+      "compiledValue": "#0a3764"
     },
     {
-      "name": "$red-50",
-      "value": "#fcf1ef",
-      "compiledValue": "#fcf1ef"
+      "name": "$theme-green-50",
+      "value": "#dde9de",
+      "compiledValue": "#dde9de"
     },
     {
-      "name": "$red-100",
-      "value": "#fdd4cd",
-      "compiledValue": "#fdd4cd"
+      "name": "$theme-green-100",
+      "value": "#b1d6b5",
+      "compiledValue": "#b1d6b5"
     },
     {
-      "name": "$red-200",
-      "value": "#fcb5aa",
-      "compiledValue": "#fcb5aa"
+      "name": "$theme-green-200",
+      "value": "#8cc497",
+      "compiledValue": "#8cc497"
     },
     {
-      "name": "$red-300",
-      "value": "#f57f6c",
-      "compiledValue": "#f57f6c"
+      "name": "$theme-green-300",
+      "value": "#69af7d",
+      "compiledValue": "#69af7d"
     },
     {
-      "name": "$red-400",
-      "value": "#ec5941",
-      "compiledValue": "#ec5941"
+      "name": "$theme-green-400",
+      "value": "#499767",
+      "compiledValue": "#499767"
     },
     {
-      "name": "$red-500",
-      "value": "#dd2b0e",
-      "compiledValue": "#dd2b0e"
+      "name": "$theme-green-500",
+      "value": "#308258",
+      "compiledValue": "#308258"
     },
     {
-      "name": "$red-600",
-      "value": "#c91c00",
-      "compiledValue": "#c91c00"
+      "name": "$theme-green-600",
+      "value": "#25744c",
+      "compiledValue": "#25744c"
     },
     {
-      "name": "$red-700",
-      "value": "#ae1800",
-      "compiledValue": "#ae1800"
+      "name": "$theme-green-700",
+      "value": "#1b653f",
+      "compiledValue": "#1b653f"
     },
     {
-      "name": "$red-800",
-      "value": "#8d1300",
-      "compiledValue": "#8d1300"
+      "name": "$theme-green-800",
+      "value": "#155635",
+      "compiledValue": "#155635"
     },
     {
-      "name": "$red-900",
-      "value": "#660e00",
-      "compiledValue": "#660e00"
+      "name": "$theme-green-900",
+      "value": "#0e4328",
+      "compiledValue": "#0e4328"
     },
     {
-      "name": "$red-950",
-      "value": "#4d0a00",
-      "compiledValue": "#4d0a00"
+      "name": "$theme-green-950",
+      "value": "#052e19",
+      "compiledValue": "#052e19"
     },
     {
-      "name": "$purple-50",
-      "value": "#f4f0ff",
-      "compiledValue": "#f4f0ff"
+      "name": "$theme-red-50",
+      "value": "#f4e9e7",
+      "compiledValue": "#f4e9e7"
     },
     {
-      "name": "$purple-100",
-      "value": "#e1d8f9",
-      "compiledValue": "#e1d8f9"
+      "name": "$theme-red-100",
+      "value": "#ecd3d0",
+      "compiledValue": "#ecd3d0"
     },
     {
-      "name": "$purple-200",
-      "value": "#cbbbf2",
-      "compiledValue": "#cbbbf2"
+      "name": "$theme-red-200",
+      "value": "#e3bab5",
+      "compiledValue": "#e3bab5"
     },
     {
-      "name": "$purple-300",
-      "value": "#ac93e6",
-      "compiledValue": "#ac93e6"
+      "name": "$theme-red-300",
+      "value": "#d59086",
+      "compiledValue": "#d59086"
     },
     {
-      "name": "$purple-400",
-      "value": "#9475db",
-      "compiledValue": "#9475db"
+      "name": "$theme-red-400",
+      "value": "#c66e60",
+      "compiledValue": "#c66e60"
     },
     {
-      "name": "$purple-500",
-      "value": "#7b58cf",
-      "compiledValue": "#7b58cf"
+      "name": "$theme-red-500",
+      "value": "#ad4a3b",
+      "compiledValue": "#ad4a3b"
     },
     {
-      "name": "$purple-600",
-      "value": "#694cc0",
-      "compiledValue": "#694cc0"
+      "name": "$theme-red-600",
+      "value": "#a13322",
+      "compiledValue": "#a13322"
     },
     {
-      "name": "$purple-700",
-      "value": "#5943b6",
-      "compiledValue": "#5943b6"
+      "name": "$theme-red-700",
+      "value": "#8f2110",
+      "compiledValue": "#8f2110"
     },
     {
-      "name": "$purple-800",
-      "value": "#453894",
-      "compiledValue": "#453894"
+      "name": "$theme-red-800",
+      "value": "#761405",
+      "compiledValue": "#761405"
     },
     {
-      "name": "$purple-900",
-      "value": "#2f2a6b",
-      "compiledValue": "#2f2a6b"
+      "name": "$theme-red-900",
+      "value": "#580d02",
+      "compiledValue": "#580d02"
     },
     {
-      "name": "$purple-950",
-      "value": "#232150",
-      "compiledValue": "#232150"
+      "name": "$theme-red-950",
+      "value": "#380700",
+      "compiledValue": "#380700"
     },
     {
-      "name": "$gray-10",
-      "value": "#fbfafd",
-      "compiledValue": "#fbfafd"
+      "name": "$theme-light-red-50",
+      "value": "#faf2f1",
+      "compiledValue": "#faf2f1"
     },
     {
-      "name": "$gray-50",
-      "value": "#ececef",
-      "compiledValue": "#ececef"
+      "name": "$theme-light-red-100",
+      "value": "#f6d9d5",
+      "compiledValue": "#f6d9d5"
     },
     {
-      "name": "$gray-100",
-      "value": "#dcdcde",
-      "compiledValue": "#dcdcde"
+      "name": "$theme-light-red-200",
+      "value": "#ebada2",
+      "compiledValue": "#ebada2"
     },
     {
-      "name": "$gray-200",
-      "value": "#bfbfc3",
-      "compiledValue": "#bfbfc3"
+      "name": "$theme-light-red-300",
+      "value": "#e07f6f",
+      "compiledValue": "#e07f6f"
     },
     {
-      "name": "$gray-300",
-      "value": "#a4a3a8",
-      "compiledValue": "#a4a3a8"
+      "name": "$theme-light-red-400",
+      "value": "#d36250",
+      "compiledValue": "#d36250"
     },
     {
-      "name": "$gray-400",
-      "value": "#89888d",
-      "compiledValue": "#89888d"
+      "name": "$theme-light-red-500",
+      "value": "#c24b38",
+      "compiledValue": "#c24b38"
     },
     {
-      "name": "$gray-500",
-      "value": "#737278",
-      "compiledValue": "#737278"
+      "name": "$theme-light-red-600",
+      "value": "#b53a26",
+      "compiledValue": "#b53a26"
     },
     {
-      "name": "$gray-600",
-      "value": "#626168",
-      "compiledValue": "#626168"
+      "name": "$theme-light-red-700",
+      "value": "#a02e1c",
+      "compiledValue": "#a02e1c"
     },
     {
-      "name": "$gray-700",
-      "value": "#535158",
-      "compiledValue": "#535158"
+      "name": "$theme-light-red-800",
+      "value": "#8b2212",
+      "compiledValue": "#8b2212"
     },
     {
-      "name": "$gray-800",
-      "value": "#434248",
-      "compiledValue": "#434248"
+      "name": "$theme-light-red-900",
+      "value": "#751709",
+      "compiledValue": "#751709"
     },
     {
-      "name": "$gray-900",
-      "value": "#333238",
-      "compiledValue": "#333238"
+      "name": "$theme-light-red-950",
+      "value": "#5c1105",
+      "compiledValue": "#5c1105"
     },
     {
-      "name": "$gray-950",
-      "value": "#1f1e24",
-      "compiledValue": "#1f1e24"
+      "name": "$t-gray-a-02",
+      "value": "rgba($gray-950, 0.02)",
+      "compiledValue": "rgba(31, 30, 36, 0.02)"
     },
     {
-      "name": "$brand-charcoal",
-      "value": "#171321",
-      "compiledValue": "#171321"
+      "name": "$t-gray-a-04",
+      "value": "rgba($gray-950, 0.04)",
+      "compiledValue": "rgba(31, 30, 36, 0.04)"
     },
     {
-      "name": "$brand-orange-01",
-      "value": "#fca326",
-      "compiledValue": "#fca326"
+      "name": "$t-gray-a-06",
+      "value": "rgba($gray-950, 0.06)",
+      "compiledValue": "rgba(31, 30, 36, 0.06)"
     },
     {
-      "name": "$brand-orange-02",
-      "value": "#fc6d26",
-      "compiledValue": "#fc6d26"
+      "name": "$t-gray-a-08",
+      "value": "rgba($gray-950, 0.08)",
+      "compiledValue": "rgba(31, 30, 36, 0.08)"
     },
     {
-      "name": "$brand-orange-03",
-      "value": "#e24329",
-      "compiledValue": "#e24329"
+      "name": "$t-gray-a-16",
+      "value": "rgba($gray-950, 0.16)",
+      "compiledValue": "rgba(31, 30, 36, 0.16)"
     },
     {
-      "name": "$brand-purple-01",
-      "value": "#a989f5",
-      "compiledValue": "#a989f5"
+      "name": "$t-gray-a-24",
+      "value": "rgba($gray-950, 0.24)",
+      "compiledValue": "rgba(31, 30, 36, 0.24)"
     },
     {
-      "name": "$brand-purple-02",
-      "value": "#7759c2",
-      "compiledValue": "#7759c2"
+      "name": "$gl-text-color",
+      "value": "$gray-900",
+      "compiledValue": "#333238"
     },
     {
-      "name": "$brand-gray-01",
-      "value": "#d1d0d3",
-      "compiledValue": "#d1d0d3"
+      "name": "$gl-text-color-secondary",
+      "value": "$gray-500",
+      "compiledValue": "#737278"
     },
     {
-      "name": "$brand-gray-02",
-      "value": "#a2a1a6",
-      "compiledValue": "#a2a1a6"
+      "name": "$gl-text-color-disabled",
+      "value": "$gray-400",
+      "compiledValue": "#89888d"
     },
     {
-      "name": "$brand-gray-03",
-      "value": "#74717a",
-      "compiledValue": "#74717a"
+      "name": "$gl-font-weight-light",
+      "value": "300",
+      "compiledValue": "300"
     },
     {
-      "name": "$brand-gray-04",
-      "value": "#45424d",
-      "compiledValue": "#45424d"
+      "name": "$gl-font-weight-normal",
+      "value": "400",
+      "compiledValue": "400"
     },
     {
-      "name": "$brand-gray-05",
-      "value": "#2b2838",
-      "compiledValue": "#2b2838"
+      "name": "$gl-font-weight-semibold",
+      "value": "500",
+      "compiledValue": "500"
     },
     {
-      "name": "$theme-indigo-50",
-      "value": "#f1f1ff",
-      "compiledValue": "#f1f1ff"
+      "name": "$gl-font-weight-bold",
+      "value": "600",
+      "compiledValue": "600"
     },
     {
-      "name": "$theme-indigo-100",
-      "value": "#dbdbf8",
-      "compiledValue": "#dbdbf8"
+      "name": "$gl-font-weights",
+      "value": "( 'normal': $gl-font-weight-normal, 'bold': $gl-font-weight-bold, )",
+      "mapValue": [
+        {
+          "name": "normal",
+          "value": "$gl-font-weight-normal",
+          "compiledValue": "400"
+        },
+        {
+          "name": "bold",
+          "value": "$gl-font-weight-bold",
+          "compiledValue": "600"
+        }
+      ],
+      "compiledValue": "(\"normal\": 400, \"bold\": 600)"
     },
     {
-      "name": "$theme-indigo-200",
-      "value": "#c7c7f2",
-      "compiledValue": "#c7c7f2"
+      "name": "$gl-monospace-font",
+      "value": "'GitLab Mono', 'JetBrains Mono', 'Menlo', 'DejaVu Sans Mono', 'Liberation Mono', 'Consolas', 'Ubuntu Mono', 'Courier New', 'andale mono', 'lucida console', monospace",
+      "compiledValue": ""
     },
     {
-      "name": "$theme-indigo-300",
-      "value": "#a2a2e6",
-      "compiledValue": "#a2a2e6"
-    },
+      "name": "$gl-regular-font",
+      "value": "GitLab Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Noto Sans', Ubuntu, Cantarell, 'Helvetica Neue', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji",
+      "compiledValue": "GitLab Sans \", -apple-system, BlinkMacSystemFont, \" Segoe UI \", Roboto, \" Noto Sans \", Ubuntu, Cantarell, \" Helvetica Neue \", sans-serif, \" Apple Color Emoji \", \" Segoe UI Emoji \", \" Segoe UI Symbol \", \" Noto Color Emoji"
+    },
     {
-      "name": "$theme-indigo-400",
-      "value": "#8181d7",
-      "compiledValue": "#8181d7"
+      "name": "$gl-fonts",
+      "value": "( 'monospace': $gl-monospace-font, 'regular': $gl-regular-font, )",
+      "mapValue": [
+        {
+          "name": "monospace",
+          "value": "$gl-monospace-font",
+          "compiledValue": "\"GitLab Mono\", \"JetBrains Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Liberation Mono\", \"Consolas\", \"Ubuntu Mono\", \"Courier New\", \"andale mono\", \"lucida console\", monospace"
+        },
+        {
+          "name": "regular",
+          "value": "$gl-regular-font",
+          "compiledValue": "\"GitLab Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Noto Sans\", Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", Noto Color Emoji"
+        }
+      ],
+      "compiledValue": "(\"monospace\": (\"GitLab Mono\", \"JetBrains Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Liberation Mono\", \"Consolas\", \"Ubuntu Mono\", \"Courier New\", \"andale mono\", \"lucida console\", monospace), \"regular\": (\"GitLab Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Noto Sans\", Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"))"
     },
     {
-      "name": "$theme-indigo-500",
-      "value": "#6666c4",
-      "compiledValue": "#6666c4"
+      "name": "$gl-font-sizes-fixed",
+      "value": "( 100: px-to-rem(12px), 200: px-to-rem(13px), 300: px-to-rem(14px), 400: px-to-rem(16px), 500: px-to-rem(18px), 600: px-to-rem(21px), 700: px-to-rem(24px), 800: px-to-rem(28px), )",
+      "mapValue": [
+        {
+          "name": "100",
+          "value": "px-to-rem(12px)",
+          "compiledValue": "0.75rem"
+        },
+        {
+          "name": "200",
+          "value": "px-to-rem(13px)",
+          "compiledValue": "0.8125rem"
+        },
+        {
+          "name": "300",
+          "value": "px-to-rem(14px)",
+          "compiledValue": "0.875rem"
+        },
+        {
+          "name": "400",
+          "value": "px-to-rem(16px)",
+          "compiledValue": "1rem"
+        },
+        {
+          "name": "500",
+          "value": "px-to-rem(18px)",
+          "compiledValue": "1.125rem"
+        },
+        {
+          "name": "600",
+          "value": "px-to-rem(21px)",
+          "compiledValue": "1.3125rem"
+        },
+        {
+          "name": "700",
+          "value": "px-to-rem(24px)",
+          "compiledValue": "1.5rem"
+        },
+        {
+          "name": "800",
+          "value": "px-to-rem(28px)",
+          "compiledValue": "1.75rem"
+        }
+      ],
+      "compiledValue": "(100: 0.75rem, 200: 0.8125rem, 300: 0.875rem, 400: 1rem, 500: 1.125rem, 600: 1.3125rem, 700: 1.5rem, 800: 1.75rem)"
     },
     {
-      "name": "$theme-indigo-600",
-      "value": "#5252b5",
-      "compiledValue": "#5252b5"
+      "name": "$gl-font-sizes",
+      "value": "( 100: map-get($gl-font-sizes-fixed, 100), 200: map-get($gl-font-sizes-fixed, 200), 300: map-get($gl-font-sizes-fixed, 300), 400: map-get($gl-font-sizes-fixed, 400), 500: clamp-between(map-get($gl-font-sizes-fixed, 500), px-to-rem(20px)), 600: clamp-between(map-get($gl-font-sizes-fixed, 600), px-to-rem(25px)), 700: clamp-between(map-get($gl-font-sizes-fixed, 700), px-to-rem(30px)), 800: clamp-between(map-get($gl-font-sizes-fixed, 800), px-to-rem(36px)), )",
+      "mapValue": [
+        {
+          "name": "100",
+          "value": "map-get($gl-font-sizes-fixed, 100)",
+          "compiledValue": "0.75rem"
+        },
+        {
+          "name": "200",
+          "value": "map-get($gl-font-sizes-fixed, 200)",
+          "compiledValue": "0.8125rem"
+        },
+        {
+          "name": "300",
+          "value": "map-get($gl-font-sizes-fixed, 300)",
+          "compiledValue": "0.875rem"
+        },
+        {
+          "name": "400",
+          "value": "map-get($gl-font-sizes-fixed, 400)",
+          "compiledValue": "1rem"
+        },
+        {
+          "name": "500",
+          "value": "clamp-between(map-get($gl-font-sizes-fixed, 500)",
+          "compiledValue": ""
+        },
+        {
+          "name": "600",
+          "value": "clamp-between(map-get($gl-font-sizes-fixed, 600)",
+          "compiledValue": ""
+        },
+        {
+          "name": "700",
+          "value": "clamp-between(map-get($gl-font-sizes-fixed, 700)",
+          "compiledValue": ""
+        },
+        {
+          "name": "800",
+          "value": "clamp-between(map-get($gl-font-sizes-fixed, 800)",
+          "compiledValue": ""
+        }
+      ],
+      "compiledValue": "(100: 0.75rem, 200: 0.8125rem, 300: 0.875rem, 400: 1rem, 500: clamp(1.125rem, calc(0.9027777778rem + 0.462962963vw), 1.25rem), 600: clamp(1.3125rem, calc(0.8680555556rem + 0.9259259259vw), 1.5625rem), 700: clamp(1.5rem, calc(0.8333333333rem + 1.3888888889vw), 1.875rem), 800: clamp(1.75rem, calc(0.8611111111rem + 1.8518518519vw), 2.25rem))"
     },
     {
-      "name": "$theme-indigo-700",
-      "value": "#41419f",
-      "compiledValue": "#41419f"
+      "name": "$gl-font-heading",
+      "value": "$gl-regular-font",
+      "compiledValue": "\"GitLab Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Noto Sans\", Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", Noto Color Emoji"
     },
     {
-      "name": "$theme-indigo-800",
-      "value": "#303083",
-      "compiledValue": "#303083"
+      "name": "$gl-font-weight-heading",
+      "value": "600",
+      "compiledValue": "600"
     },
     {
-      "name": "$theme-indigo-900",
-      "value": "#222261",
-      "compiledValue": "#222261"
+      "name": "$gl-letter-spacing-heading",
+      "value": "inherit",
+      "compiledValue": "inherit"
     },
     {
-      "name": "$theme-indigo-950",
-      "value": "#14143d",
-      "compiledValue": "#14143d"
+      "name": "$gl-letter-spacing-heading-reduced",
+      "value": "-0.01em",
+      "compiledValue": "-0.01em"
     },
     {
-      "name": "$theme-blue-50",
-      "value": "#cdd8e3",
-      "compiledValue": "#cdd8e3"
+      "name": "$gl-line-height-heading",
+      "value": "1.25",
+      "compiledValue": "1.25"
     },
     {
-      "name": "$theme-blue-100",
-      "value": "#b9cadc",
-      "compiledValue": "#b9cadc"
+      "name": "$gl-line-height-heading-display",
+      "value": "1.125",
+      "compiledValue": "1.125"
     },
     {
-      "name": "$theme-blue-200",
-      "value": "#a6bdd5",
-      "compiledValue": "#a6bdd5"
+      "name": "$gl-mb-heading",
+      "value": "$gl-spacing-scale-5",
+      "compiledValue": "1rem"
     },
     {
-      "name": "$theme-blue-300",
-      "value": "#81a5c9",
-      "compiledValue": "#81a5c9"
+      "name": "$gl-mb-heading-display",
+      "value": "$gl-spacing-scale-6",
+      "compiledValue": "1.5rem"
     },
     {
-      "name": "$theme-blue-400",
-      "value": "#628eb9",
-      "compiledValue": "#628eb9"
+      "name": "$gl-text-color-heading",
+      "value": "$gl-text-color",
+      "compiledValue": "#333238"
     },
     {
-      "name": "$theme-blue-500",
-      "value": "#4977a5",
-      "compiledValue": "#4977a5"
+      "name": "$gl-text-wrap-heading",
+      "value": "pretty",
+      "compiledValue": "pretty"
     },
     {
-      "name": "$theme-blue-600",
-      "value": "#346596",
-      "compiledValue": "#346596"
+      "name": "$gl-font-size",
+      "value": "px-to-rem(14px)",
+      "compiledValue": "0.875rem"
     },
     {
-      "name": "$theme-blue-700",
-      "value": "#235180",
-      "compiledValue": "#235180"
+      "name": "$gl-font-size-xs",
+      "value": "px-to-rem(10px)",
+      "compiledValue": "0.625rem"
     },
     {
-      "name": "$theme-blue-800",
-      "value": "#153c63",
-      "compiledValue": "#153c63"
+      "name": "$gl-font-size-sm",
+      "value": "px-to-rem(12px)",
+      "compiledValue": "0.75rem"
     },
     {
-      "name": "$theme-blue-900",
-      "value": "#0b2640",
-      "compiledValue": "#0b2640"
+      "name": "$gl-font-size-lg",
+      "value": "px-to-rem(16px)",
+      "compiledValue": "1rem"
     },
     {
-      "name": "$theme-blue-950",
-      "value": "#04101c",
-      "compiledValue": "#04101c"
+      "name": "$gl-font-size-h-display",
+      "value": "px-to-rem(28px)",
+      "compiledValue": "1.75rem"
     },
     {
-      "name": "$theme-light-blue-50",
-      "value": "#dde6ee",
-      "compiledValue": "#dde6ee"
+      "name": "$gl-font-size-h1",
+      "value": "px-to-rem(23px)",
+      "compiledValue": "1.4375rem"
     },
     {
-      "name": "$theme-light-blue-100",
-      "value": "#c1d4e6",
-      "compiledValue": "#c1d4e6"
+      "name": "$gl-font-size-h2",
+      "value": "px-to-rem(19px)",
+      "compiledValue": "1.1875rem"
     },
     {
-      "name": "$theme-light-blue-200",
-      "value": "#a0bedc",
-      "compiledValue": "#a0bedc"
+      "name": "$gl-font-size-h-display-md",
+      "value": "px-to-rem(31px)",
+      "compiledValue": "1.9375rem"
     },
     {
-      "name": "$theme-light-blue-300",
-      "value": "#74a3d3",
-      "compiledValue": "#74a3d3"
+      "name": "$gl-font-size-h1-md",
+      "value": "px-to-rem(25px)",
+      "compiledValue": "1.5625rem"
     },
     {
-      "name": "$theme-light-blue-400",
-      "value": "#4f8bc7",
-      "compiledValue": "#4f8bc7"
+      "name": "$gl-font-size-h2-md",
+      "value": "px-to-rem(20px)",
+      "compiledValue": "1.25rem"
     },
     {
-      "name": "$theme-light-blue-500",
-      "value": "#3476b9",
-      "compiledValue": "#3476b9"
+      "name": "$gl-font-size-h-display-xl",
+      "value": "px-to-rem(45px)",
+      "compiledValue": "2.8125rem"
     },
     {
-      "name": "$theme-light-blue-600",
-      "value": "#2268ae",
-      "compiledValue": "#2268ae"
+      "name": "$gl-font-size-h1-xl",
+      "value": "px-to-rem(32px)",
+      "compiledValue": "2rem"
     },
     {
-      "name": "$theme-light-blue-700",
-      "value": "#145aa1",
-      "compiledValue": "#145aa1"
+      "name": "$gl-font-size-h2-xl",
+      "value": "px-to-rem(23px)",
+      "compiledValue": "1.4375rem"
     },
     {
-      "name": "$theme-light-blue-800",
-      "value": "#0e4d8d",
-      "compiledValue": "#0e4d8d"
-    },
-    {
-      "name": "$theme-light-blue-900",
-      "value": "#0c4277",
-      "compiledValue": "#0c4277"
-    },
-    {
-      "name": "$theme-light-blue-950",
-      "value": "#0a3764",
-      "compiledValue": "#0a3764"
+      "name": "$gl-font-size-markdown",
+      "value": "px-to-rem(16px)",
+      "compiledValue": "1rem"
     },
     {
-      "name": "$theme-green-50",
-      "value": "#dde9de",
-      "compiledValue": "#dde9de"
+      "name": "$gl-font-size-markdown-sm",
+      "value": "px-to-rem(14px)",
+      "compiledValue": "0.875rem"
     },
     {
-      "name": "$theme-green-100",
-      "value": "#b1d6b5",
-      "compiledValue": "#b1d6b5"
+      "name": "$gl-font-size-markdown-h1",
+      "value": "px-to-rem(28px)",
+      "compiledValue": "1.75rem"
     },
     {
-      "name": "$theme-green-200",
-      "value": "#8cc497",
-      "compiledValue": "#8cc497"
+      "name": "$gl-font-size-markdown-h2",
+      "value": "px-to-rem(23px)",
+      "compiledValue": "1.4375rem"
     },
     {
-      "name": "$theme-green-300",
-      "value": "#69af7d",
-      "compiledValue": "#69af7d"
+      "name": "$gl-font-size-markdown-h3",
+      "value": "px-to-rem(19px)",
+      "compiledValue": "1.1875rem"
     },
     {
-      "name": "$theme-green-400",
-      "value": "#499767",
-      "compiledValue": "#499767"
+      "name": "$gl-font-size-markdown-h1-md",
+      "value": "px-to-rem(31px)",
+      "compiledValue": "1.9375rem"
     },
     {
-      "name": "$theme-green-500",
-      "value": "#308258",
-      "compiledValue": "#308258"
+      "name": "$gl-font-size-markdown-h2-md",
+      "value": "px-to-rem(25px)",
+      "compiledValue": "1.5625rem"
     },
     {
-      "name": "$theme-green-600",
-      "value": "#25744c",
-      "compiledValue": "#25744c"
+      "name": "$gl-font-size-markdown-h3-md",
+      "value": "px-to-rem(20px)",
+      "compiledValue": "1.25rem"
     },
     {
-      "name": "$theme-green-700",
-      "value": "#1b653f",
-      "compiledValue": "#1b653f"
+      "name": "$gl-font-size-markdown-h1-xl",
+      "value": "px-to-rem(45px)",
+      "compiledValue": "2.8125rem"
     },
     {
-      "name": "$theme-green-800",
-      "value": "#155635",
-      "compiledValue": "#155635"
+      "name": "$gl-font-size-markdown-h2-xl",
+      "value": "px-to-rem(32px)",
+      "compiledValue": "2rem"
     },
     {
-      "name": "$theme-green-900",
-      "value": "#0e4328",
-      "compiledValue": "#0e4328"
+      "name": "$gl-font-size-markdown-h3-xl",
+      "value": "px-to-rem(23px)",
+      "compiledValue": "1.4375rem"
     },
     {
-      "name": "$theme-green-950",
-      "value": "#052e19",
-      "compiledValue": "#052e19"
+      "name": "$gl-font-size-compact-markdown-h1",
+      "value": "px-to-rem(19px)",
+      "compiledValue": "1.1875rem"
     },
     {
-      "name": "$theme-red-50",
-      "value": "#f4e9e7",
-      "compiledValue": "#f4e9e7"
+      "name": "$gl-font-size-compact-markdown-h1-md",
+      "value": "px-to-rem(20px)",
+      "compiledValue": "1.25rem"
     },
     {
-      "name": "$theme-red-100",
-      "value": "#ecd3d0",
-      "compiledValue": "#ecd3d0"
+      "name": "$gl-font-size-compact-markdown-h1-xl",
+      "value": "px-to-rem(23px)",
+      "compiledValue": "1.4375rem"
     },
     {
-      "name": "$theme-red-200",
-      "value": "#e3bab5",
-      "compiledValue": "#e3bab5"
+      "name": "$border-color",
+      "value": "$gray-100",
+      "compiledValue": "#dcdcde"
     },
     {
-      "name": "$theme-red-300",
-      "value": "#d59086",
-      "compiledValue": "#d59086"
+      "name": "$gl-border-size-1",
+      "value": "1px",
+      "compiledValue": "1px"
     },
     {
-      "name": "$theme-red-400",
-      "value": "#c66e60",
-      "compiledValue": "#c66e60"
+      "name": "$gl-border-size-2",
+      "value": "2px",
+      "compiledValue": "2px"
     },
     {
-      "name": "$theme-red-500",
-      "value": "#ad4a3b",
-      "compiledValue": "#ad4a3b"
+      "name": "$gl-border-size-3",
+      "value": "3px",
+      "compiledValue": "3px"
     },
     {
-      "name": "$theme-red-600",
-      "value": "#a13322",
-      "compiledValue": "#a13322"
+      "name": "$gl-border-size-4",
+      "value": "4px",
+      "compiledValue": "4px"
     },
     {
-      "name": "$theme-red-700",
-      "value": "#8f2110",
-      "compiledValue": "#8f2110"
+      "name": "$gl-border-size-5",
+      "value": "5px",
+      "compiledValue": "5px"
     },
     {
-      "name": "$theme-red-800",
-      "value": "#761405",
-      "compiledValue": "#761405"
+      "name": "$gl-border-size-8",
+      "value": "8px",
+      "compiledValue": "8px"
     },
     {
-      "name": "$theme-red-900",
-      "value": "#580d02",
-      "compiledValue": "#580d02"
+      "name": "$gl-border-radius-small",
+      "value": "$gl-spacing-scale-1",
+      "compiledValue": "0.125rem"
     },
     {
-      "name": "$theme-red-950",
-      "value": "#380700",
-      "compiledValue": "#380700"
+      "name": "$gl-border-radius-base",
+      "value": "$gl-spacing-scale-2",
+      "compiledValue": "0.25rem"
     },
     {
-      "name": "$theme-light-red-50",
-      "value": "#faf2f1",
-      "compiledValue": "#faf2f1"
+      "name": "$gl-border-radius-large",
+      "value": "$gl-spacing-scale-3",
+      "compiledValue": "0.5rem"
     },
     {
-      "name": "$theme-light-red-100",
-      "value": "#f6d9d5",
-      "compiledValue": "#f6d9d5"
+      "name": "$gl-border-radius-6",
+      "value": "$gl-spacing-scale-6",
+      "compiledValue": "1.5rem"
     },
     {
-      "name": "$theme-light-red-200",
-      "value": "#ebada2",
-      "compiledValue": "#ebada2"
+      "name": "$gl-border-radius-7",
+      "value": "$gl-spacing-scale-7",
+      "compiledValue": "2rem"
     },
     {
-      "name": "$theme-light-red-300",
-      "value": "#e07f6f",
-      "compiledValue": "#e07f6f"
+      "name": "$gl-border-radius-full",
+      "value": "50%",
+      "compiledValue": "50%"
     },
     {
-      "name": "$theme-light-red-400",
-      "value": "#d36250",
-      "compiledValue": "#d36250"
+      "name": "$gl-transition-duration-slow",
+      "value": "0.4s",
+      "compiledValue": "0.4s"
     },
     {
-      "name": "$theme-light-red-500",
-      "value": "#c24b38",
-      "compiledValue": "#c24b38"
+      "name": "$gl-transition-duration-medium",
+      "value": "0.2s",
+      "compiledValue": "0.2s"
     },
     {
-      "name": "$theme-light-red-600",
-      "value": "#b53a26",
-      "compiledValue": "#b53a26"
+      "name": "$gl-transition-duration-fast",
+      "value": "0.1s",
+      "compiledValue": "0.1s"
     },
     {
-      "name": "$theme-light-red-700",
-      "value": "#a02e1c",
-      "compiledValue": "#a02e1c"
+      "name": "$outline-offset",
+      "value": "1px",
+      "compiledValue": "1px"
     },
     {
-      "name": "$theme-light-red-800",
-      "value": "#8b2212",
-      "compiledValue": "#8b2212"
+      "name": "$outline-width",
+      "value": "2px",
+      "compiledValue": "2px"
     },
     {
-      "name": "$theme-light-red-900",
-      "value": "#751709",
-      "compiledValue": "#751709"
+      "name": "$outline",
+      "value": "#{$outline-offset + $outline-width}",
+      "compiledValue": "3px"
     },
     {
-      "name": "$theme-light-red-950",
-      "value": "#5c1105",
-      "compiledValue": "#5c1105"
+      "name": "$focus-ring",
+      "value": "0 0 0 $outline-offset $white, 0 0 0 #{$outline-offset + $outline-width} $blue-400",
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-green-50",
-      "value": "#ddfab7",
-      "compiledValue": "#ddfab7"
+      "name": "$focus-ring-inset",
+      "value": "inset 0 0 0 #{$outline-width + $outline-offset} $white, inset 0 0 0 $outline-offset $white",
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-green-100",
-      "value": "#c6ed94",
-      "compiledValue": "#c6ed94"
+      "name": "$focus-ring-dark",
+      "value": "0 0 0 $outline-offset rgba($black, 0.6), 0 0 0 #{$outline-offset + $outline-width} $blue-300",
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-green-200",
-      "value": "#b0d97b",
-      "compiledValue": "#b0d97b"
+      "name": "$focus-ring-outline",
+      "value": "$outline-width solid $blue-400",
+      "compiledValue": "2px solid #428fdc"
     },
     {
-      "name": "$data-viz-green-300",
-      "value": "#94c25e",
-      "compiledValue": "#94c25e"
+      "name": "$toast-max-width",
+      "value": "px-to-rem(586px)",
+      "compiledValue": "36.625rem"
     },
     {
-      "name": "$data-viz-green-400",
-      "value": "#81ac41",
-      "compiledValue": "#81ac41"
+      "name": "$toast-padding-right",
+      "value": "px-to-rem(42px)",
+      "compiledValue": "2.625rem"
     },
     {
-      "name": "$data-viz-green-500",
-      "value": "#619025",
-      "compiledValue": "#619025"
+      "name": "$toast-background-color",
+      "value": "#303030",
+      "compiledValue": "#303030"
     },
     {
-      "name": "$data-viz-green-600",
-      "value": "#4e7f0e",
-      "compiledValue": "#4e7f0e"
+      "name": "$chart-tooltip-max-width",
+      "value": "px-to-rem(512px)",
+      "compiledValue": "32rem"
     },
     {
-      "name": "$data-viz-green-700",
-      "value": "#366800",
-      "compiledValue": "#366800"
+      "name": "$gl-icon-chevron-left",
+      "value": "'data:image/svg+xml",
+      "mapValue": [
+        {
+          "name": "data",
+          "value": "image",
+          "compiledValue": "image"
+        }
+      ],
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-green-800",
-      "value": "#275600",
-      "compiledValue": "#275600"
+      "name": "$gl-icon-chevron-right",
+      "value": "'data:image/svg+xml",
+      "mapValue": [
+        {
+          "name": "data",
+          "value": "image",
+          "compiledValue": "image"
+        }
+      ],
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-green-900",
-      "value": "#1a4500",
-      "compiledValue": "#1a4500"
+      "name": "$gl-icon-chevron-down",
+      "value": "'data:image/svg+xml",
+      "mapValue": [
+        {
+          "name": "data",
+          "value": "image",
+          "compiledValue": "image"
+        }
+      ],
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-green-950",
-      "value": "#133a03",
-      "compiledValue": "#133a03"
+      "name": "$gl-icon-select-chevron-down",
+      "value": "data:image/svg+xml,%3Csvg width=\"8\" height=\"5\" viewBox=\"0 0 8 5\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cpath fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.21967 0.21967C0.512563 -0.0732232 0.987437 -0.0732232 1.28033 0.21967L4 2.93934L6.71967 0.21967C7.01256 -0.073223 7.48744 -0.0732229 7.78033 0.21967C8.07322 0.512563 8.07322 0.987437 7.78033 1.28033L4.53033 4.53033C4.23744 4.82322 3.76256 4.82322 3.46967 4.53033L0.21967 1.28033C-0.0732233 0.987437 -0.0732233 0.512563 0.21967 0.21967Z\" fill=\"%23666666\"/%3E%3C/svg%3E%0A",
+      "mapValue": [
+        {
+          "name": "data",
+          "value": "image",
+          "compiledValue": "image"
+        }
+      ],
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-aqua-50",
-      "value": "#b5fefd",
-      "compiledValue": "#b5fefd"
+      "name": "$gl-icon-check",
+      "value": "data:image/svg+xml,%3Csvg width=\"10\" height=\"8\" viewBox=\"0 0 10 8\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cpath d=\"M0.75 4.76289L3.15312 7.24678L9.25 1.1499\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/%3E%3C/svg%3E%0A",
+      "mapValue": [
+        {
+          "name": "data",
+          "value": "image",
+          "compiledValue": "image"
+        }
+      ],
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-aqua-100",
-      "value": "#93f2ef",
-      "compiledValue": "#93f2ef"
+      "name": "$gl-icon-indeterminate",
+      "value": "data:image/svg+xml,%3Csvg width=\"10\" height=\"2\" viewBox=\"0 0 10 2\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cpath d=\"M1.75 1H8.25\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/%3E%3C/svg%3E%0A",
+      "mapValue": [
+        {
+          "name": "data",
+          "value": "image",
+          "compiledValue": "image"
+        }
+      ],
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-aqua-200",
-      "value": "#5edee3",
-      "compiledValue": "#5edee3"
+      "name": "$gl-icon-radio",
+      "value": "data:image/svg+xml,%3Csvg width=\"6\" height=\"6\" viewBox=\"0 0 6 6\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Ccircle cx=\"3\" cy=\"3\" r=\"3\" fill=\"white\"/%3E%3C/svg%3E%0A",
+      "mapValue": [
+        {
+          "name": "data",
+          "value": "image",
+          "compiledValue": "image"
+        }
+      ],
+      "compiledValue": ""
     },
     {
-      "name": "$data-viz-aqua-300",
-      "value": "#32c5d2",
-      "compiledValue": "#32c5d2"
+      "name": "$default-icon-size",
+      "value": "px-to-rem(16px)",
+      "compiledValue": "1rem"
     },
     {
-      "name": "$data-viz-aqua-400",
-      "value": "#00acc4",
-      "compiledValue": "#00acc4"
+      "name": "$gl-icon-sizes",
+      "value": "8 12 14 16 24 32 48 72",
+      "compiledValue": "8 12 14 16 24 32 48 72"
     },
     {
-      "name": "$data-viz-aqua-500",
-      "value": "#0090b1",
-      "compiledValue": "#0090b1"
+      "name": "$gl-dropdown-width",
+      "value": "px-to-rem(240px)",
+      "compiledValue": "15rem"
     },
     {
-      "name": "$data-viz-aqua-600",
-      "value": "#007b9b",
-      "compiledValue": "#007b9b"
+      "name": "$gl-new-dropdown-min-width",
+      "value": "px-to-rem(248px)",
+      "compiledValue": "15.5rem"
     },
     {
-      "name": "$data-viz-aqua-700",
-      "value": "#006381",
-      "compiledValue": "#006381"
+      "name": "$gl-new-dropdown-max-width",
+      "value": "px-to-rem(456px)",
+      "compiledValue": "28.5rem"
     },
     {
-      "name": "$data-viz-aqua-800",
-      "value": "#00516c",
-      "compiledValue": "#00516c"
+      "name": "$gl-dropdown-width-narrow",
+      "value": "px-to-rem(160px)",
+      "compiledValue": "10rem"
     },
     {
-      "name": "$data-viz-aqua-900",
-      "value": "#004059",
-      "compiledValue": "#004059"
+      "name": "$gl-dropdown-width-wide",
+      "value": "px-to-rem(400px)",
+      "compiledValue": "25rem"
     },
     {
-      "name": "$data-viz-aqua-950",
-      "value": "#00344b",
-      "compiledValue": "#00344b"
+      "name": "$gl-max-dropdown-max-height",
+      "value": "px-to-rem(312px)",
+      "compiledValue": "19.5rem"
     },
     {
-      "name": "$data-viz-blue-50",
-      "value": "#e9ebff",
-      "compiledValue": "#e9ebff"
+      "name": "$gl-broadcast-message-notification-max-width",
+      "value": "px-to-rem(300px)",
+      "compiledValue": "18.75rem"
     },
     {
-      "name": "$data-viz-blue-100",
-      "value": "#d2dcff",
-      "compiledValue": "#d2dcff"
+      "name": "$gl-modal-small-width",
+      "value": "px-to-rem(512px)",
+      "compiledValue": "32rem"
     },
     {
-      "name": "$data-viz-blue-200",
-      "value": "#b7c6ff",
-      "compiledValue": "#b7c6ff"
+      "name": "$gl-modal-medium-width",
+      "value": "px-to-rem(768px)",
+      "compiledValue": "48rem"
     },
     {
-      "name": "$data-viz-blue-300",
-      "value": "#97acff",
-      "compiledValue": "#97acff"
+      "name": "$gl-modal-large-width",
+      "value": "px-to-rem(990px)",
+      "compiledValue": "61.875rem"
     },
     {
-      "name": "$data-viz-blue-400",
-      "value": "#7992f5",
-      "compiledValue": "#7992f5"
+      "name": "$modal-header-border-color",
+      "value": "$gray-200",
+      "compiledValue": "#bfbfc3"
     },
     {
-      "name": "$data-viz-blue-500",
-      "value": "#617ae2",
-      "compiledValue": "#617ae2"
+      "name": "$modal-footer-border-color",
+      "value": "$gray-200",
+      "compiledValue": "#bfbfc3"
     },
     {
-      "name": "$data-viz-blue-600",
-      "value": "#4e65cd",
-      "compiledValue": "#4e65cd"
+      "name": "$modal-title-line-height",
+      "value": "$gl-line-height-20",
+      "compiledValue": "1.25rem"
     },
     {
-      "name": "$data-viz-blue-700",
-      "value": "#3f51ae",
-      "compiledValue": "#3f51ae"
+      "name": "$modal-backdrop-bg",
+      "value": "#000",
+      "compiledValue": "#000"
     },
     {
-      "name": "$data-viz-blue-800",
-      "value": "#374291",
-      "compiledValue": "#374291"
+      "name": "$modal-backdrop-opacity",
+      "value": "0.64",
+      "compiledValue": "0.64"
     },
     {
-      "name": "$data-viz-blue-900",
-      "value": "#303470",
-      "compiledValue": "#303470"
+      "name": "$body-color",
+      "value": "$gl-text-color",
+      "compiledValue": "#333238"
     },
     {
-      "name": "$data-viz-blue-950",
-      "value": "#2a2b59",
-      "compiledValue": "#2a2b59"
+      "name": "$enable-validation-icons",
+      "value": "false",
+      "compiledValue": "false"
     },
     {
-      "name": "$data-viz-magenta-50",
-      "value": "#ffe3eb",
-      "compiledValue": "#ffe3eb"
+      "name": "$secondary",
+      "value": "$gray-50",
+      "compiledValue": "#ececef"
     },
     {
-      "name": "$data-viz-magenta-100",
-      "value": "#ffccdb",
-      "compiledValue": "#ffccdb"
+      "name": "$success",
+      "value": "$green-500",
+      "compiledValue": "#108548"
     },
     {
-      "name": "$data-viz-magenta-200",
-      "value": "#fcacc5",
-      "compiledValue": "#fcacc5"
+      "name": "$info",
+      "value": "$blue-500",
+      "compiledValue": "#1f75cb"
     },
     {
-      "name": "$data-viz-magenta-300",
-      "value": "#f88aaf",
-      "compiledValue": "#f88aaf"
+      "name": "$warning",
+      "value": "$orange-500",
+      "compiledValue": "#ab6100"
     },
     {
-      "name": "$data-viz-magenta-400",
-      "value": "#e86e9a",
-      "compiledValue": "#e86e9a"
+      "name": "$danger",
+      "value": "$red-500",
+      "compiledValue": "#dd2b0e"
     },
     {
-      "name": "$data-viz-magenta-500",
-      "value": "#cf4d81",
-      "compiledValue": "#cf4d81"
+      "name": "$font-weight-bold",
+      "value": "$gl-font-weight-bold",
+      "compiledValue": "600"
     },
     {
-      "name": "$data-viz-magenta-600",
-      "value": "#b93d71",
-      "compiledValue": "#b93d71"
+      "name": "$font-family-sans-serif",
+      "value": "$gl-regular-font",
+      "compiledValue": "\"GitLab Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Noto Sans\", Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", Noto Color Emoji"
     },
     {
-      "name": "$data-viz-magenta-700",
-      "value": "#9a2e5d",
-      "compiledValue": "#9a2e5d"
+      "name": "$font-family-monospace",
+      "value": "$gl-monospace-font",
+      "compiledValue": "\"GitLab Mono\", \"JetBrains Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Liberation Mono\", \"Consolas\", \"Ubuntu Mono\", \"Courier New\", \"andale mono\", \"lucida console\", monospace"
     },
     {
-      "name": "$data-viz-magenta-800",
-      "value": "#7c214f",
-      "compiledValue": "#7c214f"
-    },
-    {
-      "name": "$data-viz-magenta-900",
-      "value": "#661e3a",
-      "compiledValue": "#661e3a"
+      "name": "$h1-font-size",
+      "value": "$gl-font-size * 2.5",
+      "compiledValue": "2.1875rem"
     },
     {
-      "name": "$data-viz-magenta-950",
-      "value": "#541d31",
-      "compiledValue": "#541d31"
+      "name": "$h2-font-size",
+      "value": "$gl-font-size * 2",
+      "compiledValue": "1.75rem"
     },
     {
-      "name": "$data-viz-orange-50",
-      "value": "#fae8d1",
-      "compiledValue": "#fae8d1"
+      "name": "$h3-font-size",
+      "value": "$gl-font-size * 1.75",
+      "compiledValue": "1.53125rem"
     },
     {
-      "name": "$data-viz-orange-100",
-      "value": "#f5d6b3",
-      "compiledValue": "#f5d6b3"
+      "name": "$h4-font-size",
+      "value": "$gl-font-size * 1.5",
+      "compiledValue": "1.3125rem"
     },
     {
-      "name": "$data-viz-orange-200",
-      "value": "#eebd8c",
-      "compiledValue": "#eebd8c"
+      "name": "$h5-font-size",
+      "value": "$gl-font-size * 1.25",
+      "compiledValue": "1.09375rem"
     },
     {
-      "name": "$data-viz-orange-300",
-      "value": "#e99b60",
-      "compiledValue": "#e99b60"
+      "name": "$h6-font-size",
+      "value": "$gl-font-size",
+      "compiledValue": "0.875rem"
     },
     {
-      "name": "$data-viz-orange-400",
-      "value": "#e07e41",
-      "compiledValue": "#e07e41"
+      "name": "$spacer",
+      "value": "$grid-size",
+      "compiledValue": "0.5rem"
     },
     {
-      "name": "$data-viz-orange-500",
-      "value": "#c95d2e",
-      "compiledValue": "#c95d2e"
+      "name": "$spacers",
+      "value": "( 1: $gl-spacing-scale-2, 2: $gl-spacing-scale-3, 3: $gl-spacing-scale-5, 4: $gl-spacing-scale-6, 5: $gl-spacing-scale-7, 6: $gl-spacing-scale-8, 7: $gl-spacing-scale-9, 8: $gl-spacing-scale-10, 9: $gl-spacing-scale-11, )",
+      "mapValue": [
+        {
+          "name": "1",
+          "value": "$gl-spacing-scale-2",
+          "compiledValue": "0.25rem"
+        },
+        {
+          "name": "2",
+          "value": "$gl-spacing-scale-3",
+          "compiledValue": "0.5rem"
+        },
+        {
+          "name": "3",
+          "value": "$gl-spacing-scale-5",
+          "compiledValue": "1rem"
+        },
+        {
+          "name": "4",
+          "value": "$gl-spacing-scale-6",
+          "compiledValue": "1.5rem"
+        },
+        {
+          "name": "5",
+          "value": "$gl-spacing-scale-7",
+          "compiledValue": "2rem"
+        },
+        {
+          "name": "6",
+          "value": "$gl-spacing-scale-8",
+          "compiledValue": "2.5rem"
+        },
+        {
+          "name": "7",
+          "value": "$gl-spacing-scale-9",
+          "compiledValue": "3rem"
+        },
+        {
+          "name": "8",
+          "value": "$gl-spacing-scale-10",
+          "compiledValue": "3.5rem"
+        },
+        {
+          "name": "9",
+          "value": "$gl-spacing-scale-11",
+          "compiledValue": "4rem"
+        }
+      ],
+      "compiledValue": "(1: 0.25rem, 2: 0.5rem, 3: 1rem, 4: 1.5rem, 5: 2rem, 6: 2.5rem, 7: 3rem, 8: 3.5rem, 9: 4rem)"
     },
     {
-      "name": "$data-viz-orange-600",
-      "value": "#b14f18",
-      "compiledValue": "#b14f18"
+      "name": "$table-accent-bg",
+      "value": "$gray-50",
+      "compiledValue": "#ececef"
     },
     {
-      "name": "$data-viz-orange-700",
-      "value": "#92430a",
-      "compiledValue": "#92430a"
+      "name": "$card-border-color",
+      "value": "$gray-100",
+      "compiledValue": "#dcdcde"
     },
     {
-      "name": "$data-viz-orange-800",
-      "value": "#6f3500",
-      "compiledValue": "#6f3500"
+      "name": "$card-cap-bg",
+      "value": "$gray-10",
+      "compiledValue": "#fbfafd"
     },
     {
-      "name": "$data-viz-orange-900",
-      "value": "#5e2f05",
-      "compiledValue": "#5e2f05"
+      "name": "$gl-form-input-sizes",
+      "value": "( xs: $grid-size * 10, sm: $grid-size * 20, md: $grid-size * 30, lg: $grid-size * 40, xl: $grid-size * 70, )",
+      "mapValue": [
+        {
+          "name": "xs",
+          "value": "$grid-size * 10",
+          "compiledValue": "5rem"
+        },
+        {
+          "name": "sm",
+          "value": "$grid-size * 20",
+          "compiledValue": "10rem"
+        },
+        {
+          "name": "md",
+          "value": "$grid-size * 30",
+          "compiledValue": "15rem"
+        },
+        {
+          "name": "lg",
+          "value": "$grid-size * 40",
+          "compiledValue": "20rem"
+        },
+        {
+          "name": "xl",
+          "value": "$grid-size * 70",
+          "compiledValue": "35rem"
+        }
+      ],
+      "compiledValue": "(xs: 5rem, sm: 10rem, md: 15rem, lg: 20rem, xl: 35rem)"
     },
     {
-      "name": "$data-viz-orange-950",
-      "value": "#4b2707",
-      "compiledValue": "#4b2707"
+      "name": "$popover-bg",
+      "value": "$white",
+      "compiledValue": "#fff"
     },
     {
-      "name": "$t-gray-a-02",
-      "value": "rgba($gray-950, 0.02)",
-      "compiledValue": "rgba(31, 30, 36, 0.02)"
+      "name": "$popover-arrow-width",
+      "value": "0.5rem",
+      "compiledValue": "0.5rem"
     },
     {
-      "name": "$t-gray-a-04",
-      "value": "rgba($gray-950, 0.04)",
-      "compiledValue": "rgba(31, 30, 36, 0.04)"
+      "name": "$popover-arrow-height",
+      "value": "0.25rem",
+      "compiledValue": "0.25rem"
     },
     {
-      "name": "$t-gray-a-06",
-      "value": "rgba($gray-950, 0.06)",
-      "compiledValue": "rgba(31, 30, 36, 0.06)"
+      "name": "$popover-arrow-color",
+      "value": "$popover-bg",
+      "compiledValue": "#fff"
     },
     {
-      "name": "$t-gray-a-08",
-      "value": "rgba($gray-950, 0.08)",
-      "compiledValue": "rgba(31, 30, 36, 0.08)"
+      "name": "$popover-arrow-outer-color",
+      "value": "$gray-100",
+      "compiledValue": "#dcdcde"
     },
     {
-      "name": "$t-gray-a-16",
-      "value": "rgba($gray-950, 0.16)",
-      "compiledValue": "rgba(31, 30, 36, 0.16)"
+      "name": "$tooltip-opacity",
+      "value": "1",
+      "compiledValue": "1"
     },
     {
-      "name": "$t-gray-a-24",
-      "value": "rgba($gray-950, 0.24)",
-      "compiledValue": "rgba(31, 30, 36, 0.24)"
+      "name": "$gl-line-height-52",
+      "value": "3.25rem",
+      "compiledValue": "3.25rem"
     },
     {
-      "name": "$gl-text-color",
-      "value": "$gray-900",
-      "compiledValue": "#333238"
+      "name": "$gl-line-height-44",
+      "value": "2.75rem",
+      "compiledValue": "2.75rem"
     },
     {
-      "name": "$gl-text-color-secondary",
-      "value": "$gray-500",
-      "compiledValue": "#737278"
+      "name": "$gl-line-height-42",
+      "value": "2.625rem",
+      "compiledValue": "2.625rem"
     },
     {
-      "name": "$gl-text-color-disabled",
-      "value": "$gray-400",
-      "compiledValue": "#89888d"
+      "name": "$gl-line-height-36",
+      "value": "2.25rem",
+      "compiledValue": "2.25rem"
     },
     {
-      "name": "$gl-font-weight-light",
-      "value": "300",
-      "compiledValue": "300"
+      "name": "$gl-line-height-32",
+      "value": "2rem",
+      "compiledValue": "2rem"
     },
     {
-      "name": "$gl-font-weight-normal",
-      "value": "400",
-      "compiledValue": "400"
+      "name": "$gl-line-height-28",
+      "value": "1.75rem",
+      "compiledValue": "1.75rem"
     },
     {
-      "name": "$gl-font-weight-semibold",
-      "value": "500",
-      "compiledValue": "500"
+      "name": "$gl-line-height-24",
+      "value": "1.5rem",
+      "compiledValue": "1.5rem"
     },
     {
-      "name": "$gl-font-weight-bold",
-      "value": "600",
-      "compiledValue": "600"
+      "name": "$gl-line-height-20",
+      "value": "1.25rem",
+      "compiledValue": "1.25rem"
     },
     {
-      "name": "$gl-font-weights",
-      "value": "( 'normal': $gl-font-weight-normal, 'bold': $gl-font-weight-bold, )",
-      "mapValue": [
-        {
-          "name": "normal",
-          "value": "$gl-font-weight-normal",
-          "compiledValue": "400"
-        },
-        {
-          "name": "bold",
-          "value": "$gl-font-weight-bold",
-          "compiledValue": "600"
-        }
-      ],
-      "compiledValue": "(\"normal\": 400, \"bold\": 600)"
+      "name": "$gl-line-height-16",
+      "value": "1rem",
+      "compiledValue": "1rem"
     },
     {
       "name": "$gl-line-height-12",
-      "value": "px-to-rem(12px)",
+      "value": "0.75rem",
       "compiledValue": "0.75rem"
     },
     {
-      "name": "$gl-line-height-16",
-      "value": "px-to-rem(16px)",
-      "compiledValue": "1rem"
+      "name": "$brand-gray-05",
+      "value": "#2b2838",
+      "compiledValue": "#2b2838"
     },
     {
-      "name": "$gl-line-height-20",
-      "value": "px-to-rem(20px)",
-      "compiledValue": "1.25rem"
+      "name": "$brand-gray-04",
+      "value": "#45424d",
+      "compiledValue": "#45424d"
     },
     {
-      "name": "$gl-line-height-24",
-      "value": "px-to-rem(24px)",
-      "compiledValue": "1.5rem"
+      "name": "$brand-gray-03",
+      "value": "#74717a",
+      "compiledValue": "#74717a"
     },
     {
-      "name": "$gl-line-height-28",
-      "value": "px-to-rem(28px)",
-      "compiledValue": "1.75rem"
+      "name": "$brand-gray-02",
+      "value": "#a2a1a6",
+      "compiledValue": "#a2a1a6"
     },
     {
-      "name": "$gl-line-height-32",
-      "value": "px-to-rem(32px)",
-      "compiledValue": "2rem"
+      "name": "$brand-gray-01",
+      "value": "#d1d0d3",
+      "compiledValue": "#d1d0d3"
     },
     {
-      "name": "$gl-line-height-36",
-      "value": "px-to-rem(36px)",
-      "compiledValue": "2.25rem"
+      "name": "$brand-purple-02",
+      "value": "#7759c2",
+      "compiledValue": "#7759c2"
     },
     {
-      "name": "$gl-line-height-42",
-      "value": "px-to-rem(42px)",
-      "compiledValue": "2.625rem"
+      "name": "$brand-purple-01",
+      "value": "#a989f5",
+      "compiledValue": "#a989f5"
     },
     {
-      "name": "$gl-line-height-44",
-      "value": "px-to-rem(44px)",
-      "compiledValue": "2.75rem"
+      "name": "$brand-orange-03",
+      "value": "#e24329",
+      "compiledValue": "#e24329"
     },
     {
-      "name": "$gl-line-height-52",
-      "value": "px-to-rem(52px)",
-      "compiledValue": "3.25rem"
+      "name": "$brand-orange-02",
+      "value": "#fc6d26",
+      "compiledValue": "#fc6d26"
     },
     {
-      "name": "$gl-monospace-font",
-      "value": "'GitLab Mono', 'JetBrains Mono', 'Menlo', 'DejaVu Sans Mono', 'Liberation Mono', 'Consolas', 'Ubuntu Mono', 'Courier New', 'andale mono', 'lucida console', monospace",
-      "compiledValue": ""
+      "name": "$brand-orange-01",
+      "value": "#fca326",
+      "compiledValue": "#fca326"
     },
     {
-      "name": "$gl-regular-font",
-      "value": "GitLab Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Noto Sans', Ubuntu, Cantarell, 'Helvetica Neue', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji",
-      "compiledValue": "GitLab Sans \", -apple-system, BlinkMacSystemFont, \" Segoe UI \", Roboto, \" Noto Sans \", Ubuntu, Cantarell, \" Helvetica Neue \", sans-serif, \" Apple Color Emoji \", \" Segoe UI Emoji \", \" Segoe UI Symbol \", \" Noto Color Emoji"
+      "name": "$brand-charcoal",
+      "value": "#171321",
+      "compiledValue": "#171321"
     },
     {
-      "name": "$gl-fonts",
-      "value": "( 'monospace': $gl-monospace-font, 'regular': $gl-regular-font, )",
-      "mapValue": [
-        {
-          "name": "monospace",
-          "value": "$gl-monospace-font",
-          "compiledValue": "\"GitLab Mono\", \"JetBrains Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Liberation Mono\", \"Consolas\", \"Ubuntu Mono\", \"Courier New\", \"andale mono\", \"lucida console\", monospace"
-        },
-        {
-          "name": "regular",
-          "value": "$gl-regular-font",
-          "compiledValue": "\"GitLab Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Noto Sans\", Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", Noto Color Emoji"
-        }
-      ],
-      "compiledValue": "(\"monospace\": (\"GitLab Mono\", \"JetBrains Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Liberation Mono\", \"Consolas\", \"Ubuntu Mono\", \"Courier New\", \"andale mono\", \"lucida console\", monospace), \"regular\": (\"GitLab Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Noto Sans\", Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"))"
+      "name": "$data-viz-orange-950",
+      "value": "#4b2707",
+      "compiledValue": "#4b2707"
     },
     {
-      "name": "$gl-font-sizes-fixed",
-      "value": "( 100: px-to-rem(12px), 200: px-to-rem(13px), 300: px-to-rem(14px), 400: px-to-rem(16px), 500: px-to-rem(18px), 600: px-to-rem(21px), 700: px-to-rem(24px), 800: px-to-rem(28px), )",
-      "mapValue": [
-        {
-          "name": "100",
-          "value": "px-to-rem(12px)",
-          "compiledValue": "0.75rem"
-        },
-        {
-          "name": "200",
-          "value": "px-to-rem(13px)",
-          "compiledValue": "0.8125rem"
-        },
-        {
-          "name": "300",
-          "value": "px-to-rem(14px)",
-          "compiledValue": "0.875rem"
-        },
-        {
-          "name": "400",
-          "value": "px-to-rem(16px)",
-          "compiledValue": "1rem"
-        },
-        {
-          "name": "500",
-          "value": "px-to-rem(18px)",
-          "compiledValue": "1.125rem"
-        },
-        {
-          "name": "600",
-          "value": "px-to-rem(21px)",
-          "compiledValue": "1.3125rem"
-        },
-        {
-          "name": "700",
-          "value": "px-to-rem(24px)",
-          "compiledValue": "1.5rem"
-        },
-        {
-          "name": "800",
-          "value": "px-to-rem(28px)",
-          "compiledValue": "1.75rem"
-        }
-      ],
-      "compiledValue": "(100: 0.75rem, 200: 0.8125rem, 300: 0.875rem, 400: 1rem, 500: 1.125rem, 600: 1.3125rem, 700: 1.5rem, 800: 1.75rem)"
+      "name": "$data-viz-orange-900",
+      "value": "#5e2f05",
+      "compiledValue": "#5e2f05"
     },
     {
-      "name": "$gl-font-sizes",
-      "value": "( 100: map-get($gl-font-sizes-fixed, 100), 200: map-get($gl-font-sizes-fixed, 200), 300: map-get($gl-font-sizes-fixed, 300), 400: map-get($gl-font-sizes-fixed, 400), 500: clamp-between(map-get($gl-font-sizes-fixed, 500), px-to-rem(20px)), 600: clamp-between(map-get($gl-font-sizes-fixed, 600), px-to-rem(25px)), 700: clamp-between(map-get($gl-font-sizes-fixed, 700), px-to-rem(30px)), 800: clamp-between(map-get($gl-font-sizes-fixed, 800), px-to-rem(36px)), )",
-      "mapValue": [
-        {
-          "name": "100",
-          "value": "map-get($gl-font-sizes-fixed, 100)",
-          "compiledValue": "0.75rem"
-        },
-        {
-          "name": "200",
-          "value": "map-get($gl-font-sizes-fixed, 200)",
-          "compiledValue": "0.8125rem"
-        },
-        {
-          "name": "300",
-          "value": "map-get($gl-font-sizes-fixed, 300)",
-          "compiledValue": "0.875rem"
-        },
-        {
-          "name": "400",
-          "value": "map-get($gl-font-sizes-fixed, 400)",
-          "compiledValue": "1rem"
-        },
-        {
-          "name": "500",
-          "value": "clamp-between(map-get($gl-font-sizes-fixed, 500)",
-          "compiledValue": ""
-        },
-        {
-          "name": "600",
-          "value": "clamp-between(map-get($gl-font-sizes-fixed, 600)",
-          "compiledValue": ""
-        },
-        {
-          "name": "700",
-          "value": "clamp-between(map-get($gl-font-sizes-fixed, 700)",
-          "compiledValue": ""
-        },
-        {
-          "name": "800",
-          "value": "clamp-between(map-get($gl-font-sizes-fixed, 800)",
-          "compiledValue": ""
-        }
-      ],
-      "compiledValue": "(100: 0.75rem, 200: 0.8125rem, 300: 0.875rem, 400: 1rem, 500: clamp(1.125rem, calc(0.9027777778rem + 0.462962963vw), 1.25rem), 600: clamp(1.3125rem, calc(0.8680555556rem + 0.9259259259vw), 1.5625rem), 700: clamp(1.5rem, calc(0.8333333333rem + 1.3888888889vw), 1.875rem), 800: clamp(1.75rem, calc(0.8611111111rem + 1.8518518519vw), 2.25rem))"
+      "name": "$data-viz-orange-800",
+      "value": "#6f3500",
+      "compiledValue": "#6f3500"
     },
     {
-      "name": "$gl-font-heading",
-      "value": "$gl-regular-font",
-      "compiledValue": "\"GitLab Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Noto Sans\", Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", Noto Color Emoji"
+      "name": "$data-viz-orange-700",
+      "value": "#92430a",
+      "compiledValue": "#92430a"
     },
     {
-      "name": "$gl-font-weight-heading",
-      "value": "600",
-      "compiledValue": "600"
+      "name": "$data-viz-orange-600",
+      "value": "#b14f18",
+      "compiledValue": "#b14f18"
     },
     {
-      "name": "$gl-letter-spacing-heading",
-      "value": "inherit",
-      "compiledValue": "inherit"
+      "name": "$data-viz-orange-500",
+      "value": "#c95d2e",
+      "compiledValue": "#c95d2e"
     },
     {
-      "name": "$gl-letter-spacing-heading-reduced",
-      "value": "-0.01em",
-      "compiledValue": "-0.01em"
+      "name": "$data-viz-orange-400",
+      "value": "#e07e41",
+      "compiledValue": "#e07e41"
     },
     {
-      "name": "$gl-line-height-heading",
-      "value": "1.25",
-      "compiledValue": "1.25"
+      "name": "$data-viz-orange-300",
+      "value": "#e99b60",
+      "compiledValue": "#e99b60"
     },
     {
-      "name": "$gl-line-height-heading-display",
-      "value": "1.125",
-      "compiledValue": "1.125"
+      "name": "$data-viz-orange-200",
+      "value": "#eebd8c",
+      "compiledValue": "#eebd8c"
     },
     {
-      "name": "$gl-mb-heading",
-      "value": "$gl-spacing-scale-5",
-      "compiledValue": "1rem"
+      "name": "$data-viz-orange-100",
+      "value": "#f5d6b3",
+      "compiledValue": "#f5d6b3"
     },
     {
-      "name": "$gl-mb-heading-display",
-      "value": "$gl-spacing-scale-6",
-      "compiledValue": "1.5rem"
+      "name": "$data-viz-orange-50",
+      "value": "#fae8d1",
+      "compiledValue": "#fae8d1"
     },
     {
-      "name": "$gl-text-color-heading",
-      "value": "$gl-text-color",
-      "compiledValue": "#333238"
+      "name": "$data-viz-magenta-950",
+      "value": "#541d31",
+      "compiledValue": "#541d31"
     },
     {
-      "name": "$gl-text-wrap-heading",
-      "value": "pretty",
-      "compiledValue": "pretty"
+      "name": "$data-viz-magenta-900",
+      "value": "#661e3a",
+      "compiledValue": "#661e3a"
+    },
+    {
+      "name": "$data-viz-magenta-800",
+      "value": "#7c214f",
+      "compiledValue": "#7c214f"
+    },
+    {
+      "name": "$data-viz-magenta-700",
+      "value": "#9a2e5d",
+      "compiledValue": "#9a2e5d"
+    },
+    {
+      "name": "$data-viz-magenta-600",
+      "value": "#b93d71",
+      "compiledValue": "#b93d71"
+    },
+    {
+      "name": "$data-viz-magenta-500",
+      "value": "#cf4d81",
+      "compiledValue": "#cf4d81"
     },
     {
-      "name": "$gl-font-size",
-      "value": "px-to-rem(14px)",
-      "compiledValue": "0.875rem"
+      "name": "$data-viz-magenta-400",
+      "value": "#e86e9a",
+      "compiledValue": "#e86e9a"
     },
     {
-      "name": "$gl-font-size-xs",
-      "value": "px-to-rem(10px)",
-      "compiledValue": "0.625rem"
+      "name": "$data-viz-magenta-300",
+      "value": "#f88aaf",
+      "compiledValue": "#f88aaf"
     },
     {
-      "name": "$gl-font-size-sm",
-      "value": "px-to-rem(12px)",
-      "compiledValue": "0.75rem"
+      "name": "$data-viz-magenta-200",
+      "value": "#fcacc5",
+      "compiledValue": "#fcacc5"
     },
     {
-      "name": "$gl-font-size-lg",
-      "value": "px-to-rem(16px)",
-      "compiledValue": "1rem"
+      "name": "$data-viz-magenta-100",
+      "value": "#ffccdb",
+      "compiledValue": "#ffccdb"
     },
     {
-      "name": "$gl-font-size-h-display",
-      "value": "px-to-rem(28px)",
-      "compiledValue": "1.75rem"
+      "name": "$data-viz-magenta-50",
+      "value": "#ffe3eb",
+      "compiledValue": "#ffe3eb"
     },
     {
-      "name": "$gl-font-size-h1",
-      "value": "px-to-rem(23px)",
-      "compiledValue": "1.4375rem"
+      "name": "$data-viz-blue-950",
+      "value": "#2a2b59",
+      "compiledValue": "#2a2b59"
     },
     {
-      "name": "$gl-font-size-h2",
-      "value": "px-to-rem(19px)",
-      "compiledValue": "1.1875rem"
+      "name": "$data-viz-blue-900",
+      "value": "#303470",
+      "compiledValue": "#303470"
     },
     {
-      "name": "$gl-font-size-h-display-md",
-      "value": "px-to-rem(31px)",
-      "compiledValue": "1.9375rem"
+      "name": "$data-viz-blue-800",
+      "value": "#374291",
+      "compiledValue": "#374291"
     },
     {
-      "name": "$gl-font-size-h1-md",
-      "value": "px-to-rem(25px)",
-      "compiledValue": "1.5625rem"
+      "name": "$data-viz-blue-700",
+      "value": "#3f51ae",
+      "compiledValue": "#3f51ae"
     },
     {
-      "name": "$gl-font-size-h2-md",
-      "value": "px-to-rem(20px)",
-      "compiledValue": "1.25rem"
+      "name": "$data-viz-blue-600",
+      "value": "#4e65cd",
+      "compiledValue": "#4e65cd"
     },
     {
-      "name": "$gl-font-size-h-display-xl",
-      "value": "px-to-rem(45px)",
-      "compiledValue": "2.8125rem"
+      "name": "$data-viz-blue-500",
+      "value": "#617ae2",
+      "compiledValue": "#617ae2"
     },
     {
-      "name": "$gl-font-size-h1-xl",
-      "value": "px-to-rem(32px)",
-      "compiledValue": "2rem"
+      "name": "$data-viz-blue-400",
+      "value": "#7992f5",
+      "compiledValue": "#7992f5"
     },
     {
-      "name": "$gl-font-size-h2-xl",
-      "value": "px-to-rem(23px)",
-      "compiledValue": "1.4375rem"
+      "name": "$data-viz-blue-300",
+      "value": "#97acff",
+      "compiledValue": "#97acff"
     },
     {
-      "name": "$gl-font-size-markdown",
-      "value": "px-to-rem(16px)",
-      "compiledValue": "1rem"
+      "name": "$data-viz-blue-200",
+      "value": "#b7c6ff",
+      "compiledValue": "#b7c6ff"
     },
     {
-      "name": "$gl-font-size-markdown-sm",
-      "value": "px-to-rem(14px)",
-      "compiledValue": "0.875rem"
+      "name": "$data-viz-blue-100",
+      "value": "#d2dcff",
+      "compiledValue": "#d2dcff"
     },
     {
-      "name": "$gl-font-size-markdown-h1",
-      "value": "px-to-rem(28px)",
-      "compiledValue": "1.75rem"
+      "name": "$data-viz-blue-50",
+      "value": "#e9ebff",
+      "compiledValue": "#e9ebff"
     },
     {
-      "name": "$gl-font-size-markdown-h2",
-      "value": "px-to-rem(23px)",
-      "compiledValue": "1.4375rem"
+      "name": "$data-viz-aqua-950",
+      "value": "#00344b",
+      "compiledValue": "#00344b"
     },
     {
-      "name": "$gl-font-size-markdown-h3",
-      "value": "px-to-rem(19px)",
-      "compiledValue": "1.1875rem"
+      "name": "$data-viz-aqua-900",
+      "value": "#004059",
+      "compiledValue": "#004059"
     },
     {
-      "name": "$gl-font-size-markdown-h1-md",
-      "value": "px-to-rem(31px)",
-      "compiledValue": "1.9375rem"
+      "name": "$data-viz-aqua-800",
+      "value": "#00516c",
+      "compiledValue": "#00516c"
     },
     {
-      "name": "$gl-font-size-markdown-h2-md",
-      "value": "px-to-rem(25px)",
-      "compiledValue": "1.5625rem"
+      "name": "$data-viz-aqua-700",
+      "value": "#006381",
+      "compiledValue": "#006381"
     },
     {
-      "name": "$gl-font-size-markdown-h3-md",
-      "value": "px-to-rem(20px)",
-      "compiledValue": "1.25rem"
+      "name": "$data-viz-aqua-600",
+      "value": "#007b9b",
+      "compiledValue": "#007b9b"
     },
     {
-      "name": "$gl-font-size-markdown-h1-xl",
-      "value": "px-to-rem(45px)",
-      "compiledValue": "2.8125rem"
+      "name": "$data-viz-aqua-500",
+      "value": "#0090b1",
+      "compiledValue": "#0090b1"
     },
     {
-      "name": "$gl-font-size-markdown-h2-xl",
-      "value": "px-to-rem(32px)",
-      "compiledValue": "2rem"
+      "name": "$data-viz-aqua-400",
+      "value": "#00acc4",
+      "compiledValue": "#00acc4"
     },
     {
-      "name": "$gl-font-size-markdown-h3-xl",
-      "value": "px-to-rem(23px)",
-      "compiledValue": "1.4375rem"
+      "name": "$data-viz-aqua-300",
+      "value": "#32c5d2",
+      "compiledValue": "#32c5d2"
     },
     {
-      "name": "$gl-font-size-compact-markdown-h1",
-      "value": "px-to-rem(19px)",
-      "compiledValue": "1.1875rem"
+      "name": "$data-viz-aqua-200",
+      "value": "#5edee3",
+      "compiledValue": "#5edee3"
     },
     {
-      "name": "$gl-font-size-compact-markdown-h1-md",
-      "value": "px-to-rem(20px)",
-      "compiledValue": "1.25rem"
+      "name": "$data-viz-aqua-100",
+      "value": "#93f2ef",
+      "compiledValue": "#93f2ef"
     },
     {
-      "name": "$gl-font-size-compact-markdown-h1-xl",
-      "value": "px-to-rem(23px)",
-      "compiledValue": "1.4375rem"
+      "name": "$data-viz-aqua-50",
+      "value": "#b5fefd",
+      "compiledValue": "#b5fefd"
     },
     {
-      "name": "$border-color",
-      "value": "$gray-100",
-      "compiledValue": "#dcdcde"
+      "name": "$data-viz-green-950",
+      "value": "#133a03",
+      "compiledValue": "#133a03"
     },
     {
-      "name": "$gl-border-size-1",
-      "value": "1px",
-      "compiledValue": "1px"
+      "name": "$data-viz-green-900",
+      "value": "#1a4500",
+      "compiledValue": "#1a4500"
     },
     {
-      "name": "$gl-border-size-2",
-      "value": "2px",
-      "compiledValue": "2px"
+      "name": "$data-viz-green-800",
+      "value": "#275600",
+      "compiledValue": "#275600"
     },
     {
-      "name": "$gl-border-size-3",
-      "value": "3px",
-      "compiledValue": "3px"
+      "name": "$data-viz-green-700",
+      "value": "#366800",
+      "compiledValue": "#366800"
     },
     {
-      "name": "$gl-border-size-4",
-      "value": "4px",
-      "compiledValue": "4px"
+      "name": "$data-viz-green-600",
+      "value": "#4e7f0e",
+      "compiledValue": "#4e7f0e"
     },
     {
-      "name": "$gl-border-size-5",
-      "value": "5px",
-      "compiledValue": "5px"
+      "name": "$data-viz-green-500",
+      "value": "#619025",
+      "compiledValue": "#619025"
     },
     {
-      "name": "$gl-border-size-8",
-      "value": "8px",
-      "compiledValue": "8px"
+      "name": "$data-viz-green-400",
+      "value": "#81ac41",
+      "compiledValue": "#81ac41"
     },
     {
-      "name": "$gl-border-radius-small",
-      "value": "$gl-spacing-scale-1",
-      "compiledValue": "0.125rem"
+      "name": "$data-viz-green-300",
+      "value": "#94c25e",
+      "compiledValue": "#94c25e"
     },
     {
-      "name": "$gl-border-radius-base",
-      "value": "$gl-spacing-scale-2",
-      "compiledValue": "0.25rem"
+      "name": "$data-viz-green-200",
+      "value": "#b0d97b",
+      "compiledValue": "#b0d97b"
     },
     {
-      "name": "$gl-border-radius-large",
-      "value": "$gl-spacing-scale-3",
-      "compiledValue": "0.5rem"
+      "name": "$data-viz-green-100",
+      "value": "#c6ed94",
+      "compiledValue": "#c6ed94"
     },
     {
-      "name": "$gl-border-radius-6",
-      "value": "$gl-spacing-scale-6",
-      "compiledValue": "1.5rem"
+      "name": "$data-viz-green-50",
+      "value": "#ddfab7",
+      "compiledValue": "#ddfab7"
     },
     {
-      "name": "$gl-border-radius-7",
-      "value": "$gl-spacing-scale-7",
-      "compiledValue": "2rem"
+      "name": "$red-950",
+      "value": "#4d0a00",
+      "compiledValue": "#4d0a00"
     },
     {
-      "name": "$gl-border-radius-full",
-      "value": "50%",
-      "compiledValue": "50%"
+      "name": "$red-900",
+      "value": "#660e00",
+      "compiledValue": "#660e00"
     },
     {
-      "name": "$gl-transition-duration-slow",
-      "value": "0.4s",
-      "compiledValue": "0.4s"
+      "name": "$red-800",
+      "value": "#8d1300",
+      "compiledValue": "#8d1300"
     },
     {
-      "name": "$gl-transition-duration-medium",
-      "value": "0.2s",
-      "compiledValue": "0.2s"
+      "name": "$red-700",
+      "value": "#ae1800",
+      "compiledValue": "#ae1800"
     },
     {
-      "name": "$gl-transition-duration-fast",
-      "value": "0.1s",
-      "compiledValue": "0.1s"
+      "name": "$red-600",
+      "value": "#c91c00",
+      "compiledValue": "#c91c00"
     },
     {
-      "name": "$outline-offset",
-      "value": "1px",
-      "compiledValue": "1px"
+      "name": "$red-500",
+      "value": "#dd2b0e",
+      "compiledValue": "#dd2b0e"
     },
     {
-      "name": "$outline-width",
-      "value": "2px",
-      "compiledValue": "2px"
+      "name": "$red-400",
+      "value": "#ec5941",
+      "compiledValue": "#ec5941"
     },
     {
-      "name": "$outline",
-      "value": "#{$outline-offset + $outline-width}",
-      "compiledValue": "3px"
+      "name": "$red-300",
+      "value": "#f57f6c",
+      "compiledValue": "#f57f6c"
     },
     {
-      "name": "$focus-ring",
-      "value": "0 0 0 $outline-offset $white, 0 0 0 #{$outline-offset + $outline-width} $blue-400",
-      "compiledValue": ""
+      "name": "$red-200",
+      "value": "#fcb5aa",
+      "compiledValue": "#fcb5aa"
     },
     {
-      "name": "$focus-ring-inset",
-      "value": "inset 0 0 0 #{$outline-width + $outline-offset} $white, inset 0 0 0 $outline-offset $white",
-      "compiledValue": ""
+      "name": "$red-100",
+      "value": "#fdd4cd",
+      "compiledValue": "#fdd4cd"
     },
     {
-      "name": "$focus-ring-dark",
-      "value": "0 0 0 $outline-offset rgba($black, 0.6), 0 0 0 #{$outline-offset + $outline-width} $blue-300",
-      "compiledValue": ""
+      "name": "$red-50",
+      "value": "#fcf1ef",
+      "compiledValue": "#fcf1ef"
     },
     {
-      "name": "$focus-ring-outline",
-      "value": "$outline-width solid $blue-400",
-      "compiledValue": "2px solid #428fdc"
+      "name": "$purple-950",
+      "value": "#232150",
+      "compiledValue": "#232150"
     },
     {
-      "name": "$toast-max-width",
-      "value": "px-to-rem(586px)",
-      "compiledValue": "36.625rem"
+      "name": "$purple-900",
+      "value": "#2f2a6b",
+      "compiledValue": "#2f2a6b"
     },
     {
-      "name": "$toast-padding-right",
-      "value": "px-to-rem(42px)",
-      "compiledValue": "2.625rem"
+      "name": "$purple-800",
+      "value": "#453894",
+      "compiledValue": "#453894"
     },
     {
-      "name": "$toast-background-color",
-      "value": "#303030",
-      "compiledValue": "#303030"
+      "name": "$purple-700",
+      "value": "#5943b6",
+      "compiledValue": "#5943b6"
     },
     {
-      "name": "$chart-tooltip-max-width",
-      "value": "px-to-rem(512px)",
-      "compiledValue": "32rem"
+      "name": "$purple-600",
+      "value": "#694cc0",
+      "compiledValue": "#694cc0"
     },
     {
-      "name": "$gl-icon-chevron-left",
-      "value": "'data:image/svg+xml",
-      "mapValue": [
-        {
-          "name": "data",
-          "value": "image",
-          "compiledValue": "image"
-        }
-      ],
-      "compiledValue": ""
+      "name": "$purple-500",
+      "value": "#7b58cf",
+      "compiledValue": "#7b58cf"
     },
     {
-      "name": "$gl-icon-chevron-right",
-      "value": "'data:image/svg+xml",
-      "mapValue": [
-        {
-          "name": "data",
-          "value": "image",
-          "compiledValue": "image"
-        }
-      ],
-      "compiledValue": ""
+      "name": "$purple-400",
+      "value": "#9475db",
+      "compiledValue": "#9475db"
     },
     {
-      "name": "$gl-icon-chevron-down",
-      "value": "'data:image/svg+xml",
-      "mapValue": [
-        {
-          "name": "data",
-          "value": "image",
-          "compiledValue": "image"
-        }
-      ],
-      "compiledValue": ""
+      "name": "$purple-300",
+      "value": "#ac93e6",
+      "compiledValue": "#ac93e6"
     },
     {
-      "name": "$gl-icon-select-chevron-down",
-      "value": "data:image/svg+xml,%3Csvg width=\"8\" height=\"5\" viewBox=\"0 0 8 5\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cpath fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.21967 0.21967C0.512563 -0.0732232 0.987437 -0.0732232 1.28033 0.21967L4 2.93934L6.71967 0.21967C7.01256 -0.073223 7.48744 -0.0732229 7.78033 0.21967C8.07322 0.512563 8.07322 0.987437 7.78033 1.28033L4.53033 4.53033C4.23744 4.82322 3.76256 4.82322 3.46967 4.53033L0.21967 1.28033C-0.0732233 0.987437 -0.0732233 0.512563 0.21967 0.21967Z\" fill=\"%23666666\"/%3E%3C/svg%3E%0A",
-      "mapValue": [
-        {
-          "name": "data",
-          "value": "image",
-          "compiledValue": "image"
-        }
-      ],
-      "compiledValue": ""
+      "name": "$purple-200",
+      "value": "#cbbbf2",
+      "compiledValue": "#cbbbf2"
     },
     {
-      "name": "$gl-icon-check",
-      "value": "data:image/svg+xml,%3Csvg width=\"10\" height=\"8\" viewBox=\"0 0 10 8\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cpath d=\"M0.75 4.76289L3.15312 7.24678L9.25 1.1499\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/%3E%3C/svg%3E%0A",
-      "mapValue": [
-        {
-          "name": "data",
-          "value": "image",
-          "compiledValue": "image"
-        }
-      ],
-      "compiledValue": ""
+      "name": "$purple-100",
+      "value": "#e1d8f9",
+      "compiledValue": "#e1d8f9"
     },
     {
-      "name": "$gl-icon-indeterminate",
-      "value": "data:image/svg+xml,%3Csvg width=\"10\" height=\"2\" viewBox=\"0 0 10 2\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cpath d=\"M1.75 1H8.25\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/%3E%3C/svg%3E%0A",
-      "mapValue": [
-        {
-          "name": "data",
-          "value": "image",
-          "compiledValue": "image"
-        }
-      ],
-      "compiledValue": ""
+      "name": "$purple-50",
+      "value": "#f4f0ff",
+      "compiledValue": "#f4f0ff"
     },
     {
-      "name": "$gl-icon-radio",
-      "value": "data:image/svg+xml,%3Csvg width=\"6\" height=\"6\" viewBox=\"0 0 6 6\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Ccircle cx=\"3\" cy=\"3\" r=\"3\" fill=\"white\"/%3E%3C/svg%3E%0A",
-      "mapValue": [
-        {
-          "name": "data",
-          "value": "image",
-          "compiledValue": "image"
-        }
-      ],
-      "compiledValue": ""
+      "name": "$orange-950",
+      "value": "#421f00",
+      "compiledValue": "#421f00"
     },
     {
-      "name": "$default-icon-size",
-      "value": "px-to-rem(16px)",
-      "compiledValue": "1rem"
+      "name": "$orange-900",
+      "value": "#5c2900",
+      "compiledValue": "#5c2900"
     },
     {
-      "name": "$gl-icon-sizes",
-      "value": "8 12 14 16 24 32 48 72",
-      "compiledValue": "8 12 14 16 24 32 48 72"
+      "name": "$orange-800",
+      "value": "#703800",
+      "compiledValue": "#703800"
     },
     {
-      "name": "$gl-dropdown-width",
-      "value": "px-to-rem(240px)",
-      "compiledValue": "15rem"
+      "name": "$orange-700",
+      "value": "#8f4700",
+      "compiledValue": "#8f4700"
     },
     {
-      "name": "$gl-new-dropdown-min-width",
-      "value": "px-to-rem(248px)",
-      "compiledValue": "15.5rem"
+      "name": "$orange-600",
+      "value": "#9e5400",
+      "compiledValue": "#9e5400"
     },
     {
-      "name": "$gl-new-dropdown-max-width",
-      "value": "px-to-rem(456px)",
-      "compiledValue": "28.5rem"
+      "name": "$orange-500",
+      "value": "#ab6100",
+      "compiledValue": "#ab6100"
     },
     {
-      "name": "$gl-dropdown-width-narrow",
-      "value": "px-to-rem(160px)",
-      "compiledValue": "10rem"
+      "name": "$orange-400",
+      "value": "#c17d10",
+      "compiledValue": "#c17d10"
     },
     {
-      "name": "$gl-dropdown-width-wide",
-      "value": "px-to-rem(400px)",
-      "compiledValue": "25rem"
+      "name": "$orange-300",
+      "value": "#d99530",
+      "compiledValue": "#d99530"
     },
     {
-      "name": "$gl-max-dropdown-max-height",
-      "value": "px-to-rem(312px)",
-      "compiledValue": "19.5rem"
+      "name": "$orange-200",
+      "value": "#e9be74",
+      "compiledValue": "#e9be74"
     },
     {
-      "name": "$gl-broadcast-message-notification-max-width",
-      "value": "px-to-rem(300px)",
-      "compiledValue": "18.75rem"
+      "name": "$orange-100",
+      "value": "#f5d9a8",
+      "compiledValue": "#f5d9a8"
     },
     {
-      "name": "$gl-modal-small-width",
-      "value": "px-to-rem(512px)",
-      "compiledValue": "32rem"
+      "name": "$orange-50",
+      "value": "#fdf1dd",
+      "compiledValue": "#fdf1dd"
     },
     {
-      "name": "$gl-modal-medium-width",
-      "value": "px-to-rem(768px)",
-      "compiledValue": "48rem"
+      "name": "$green-950",
+      "value": "#072b15",
+      "compiledValue": "#072b15"
     },
     {
-      "name": "$gl-modal-large-width",
-      "value": "px-to-rem(990px)",
-      "compiledValue": "61.875rem"
+      "name": "$green-900",
+      "value": "#0a4020",
+      "compiledValue": "#0a4020"
     },
     {
-      "name": "$modal-header-border-color",
-      "value": "$gray-200",
-      "compiledValue": "#bfbfc3"
+      "name": "$green-800",
+      "value": "#0d532a",
+      "compiledValue": "#0d532a"
     },
     {
-      "name": "$modal-footer-border-color",
-      "value": "$gray-200",
-      "compiledValue": "#bfbfc3"
+      "name": "$green-700",
+      "value": "#24663b",
+      "compiledValue": "#24663b"
     },
     {
-      "name": "$modal-title-line-height",
-      "value": "$gl-line-height-20",
-      "compiledValue": "1.25rem"
+      "name": "$green-600",
+      "value": "#217645",
+      "compiledValue": "#217645"
+    },
+    {
+      "name": "$green-500",
+      "value": "#108548",
+      "compiledValue": "#108548"
     },
     {
-      "name": "$modal-backdrop-bg",
-      "value": "#000",
-      "compiledValue": "#000"
+      "name": "$green-400",
+      "value": "#2da160",
+      "compiledValue": "#2da160"
     },
     {
-      "name": "$modal-backdrop-opacity",
-      "value": "0.64",
-      "compiledValue": "0.64"
+      "name": "$green-300",
+      "value": "#52b87a",
+      "compiledValue": "#52b87a"
     },
     {
-      "name": "$body-color",
-      "value": "$gl-text-color",
-      "compiledValue": "#333238"
+      "name": "$green-200",
+      "value": "#91d4a8",
+      "compiledValue": "#91d4a8"
     },
     {
-      "name": "$enable-validation-icons",
-      "value": "false",
-      "compiledValue": "false"
+      "name": "$green-100",
+      "value": "#c3e6cd",
+      "compiledValue": "#c3e6cd"
     },
     {
-      "name": "$secondary",
-      "value": "$gray-50",
-      "compiledValue": "#ececef"
+      "name": "$green-50",
+      "value": "#ecf4ee",
+      "compiledValue": "#ecf4ee"
     },
     {
-      "name": "$success",
-      "value": "$green-500",
-      "compiledValue": "#108548"
+      "name": "$gray-950",
+      "value": "#1f1e24",
+      "compiledValue": "#1f1e24"
     },
     {
-      "name": "$info",
-      "value": "$blue-500",
-      "compiledValue": "#1f75cb"
+      "name": "$gray-900",
+      "value": "#333238",
+      "compiledValue": "#333238"
     },
     {
-      "name": "$warning",
-      "value": "$orange-500",
-      "compiledValue": "#ab6100"
+      "name": "$gray-800",
+      "value": "#434248",
+      "compiledValue": "#434248"
     },
     {
-      "name": "$danger",
-      "value": "$red-500",
-      "compiledValue": "#dd2b0e"
+      "name": "$gray-700",
+      "value": "#535158",
+      "compiledValue": "#535158"
     },
     {
-      "name": "$font-weight-bold",
-      "value": "$gl-font-weight-bold",
-      "compiledValue": "600"
+      "name": "$gray-600",
+      "value": "#626168",
+      "compiledValue": "#626168"
     },
     {
-      "name": "$font-family-sans-serif",
-      "value": "$gl-regular-font",
-      "compiledValue": "\"GitLab Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Noto Sans\", Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", Noto Color Emoji"
+      "name": "$gray-500",
+      "value": "#737278",
+      "compiledValue": "#737278"
     },
     {
-      "name": "$font-family-monospace",
-      "value": "$gl-monospace-font",
-      "compiledValue": "\"GitLab Mono\", \"JetBrains Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Liberation Mono\", \"Consolas\", \"Ubuntu Mono\", \"Courier New\", \"andale mono\", \"lucida console\", monospace"
+      "name": "$gray-400",
+      "value": "#89888d",
+      "compiledValue": "#89888d"
     },
     {
-      "name": "$h1-font-size",
-      "value": "$gl-font-size * 2.5",
-      "compiledValue": "2.1875rem"
+      "name": "$gray-300",
+      "value": "#a4a3a8",
+      "compiledValue": "#a4a3a8"
     },
     {
-      "name": "$h2-font-size",
-      "value": "$gl-font-size * 2",
-      "compiledValue": "1.75rem"
+      "name": "$gray-200",
+      "value": "#bfbfc3",
+      "compiledValue": "#bfbfc3"
     },
     {
-      "name": "$h3-font-size",
-      "value": "$gl-font-size * 1.75",
-      "compiledValue": "1.53125rem"
+      "name": "$gray-100",
+      "value": "#dcdcde",
+      "compiledValue": "#dcdcde"
     },
     {
-      "name": "$h4-font-size",
-      "value": "$gl-font-size * 1.5",
-      "compiledValue": "1.3125rem"
+      "name": "$gray-50",
+      "value": "#ececef",
+      "compiledValue": "#ececef"
     },
     {
-      "name": "$h5-font-size",
-      "value": "$gl-font-size * 1.25",
-      "compiledValue": "1.09375rem"
+      "name": "$gray-10",
+      "value": "#fbfafd",
+      "compiledValue": "#fbfafd"
     },
     {
-      "name": "$h6-font-size",
-      "value": "$gl-font-size",
-      "compiledValue": "0.875rem"
+      "name": "$blue-950",
+      "value": "#002850",
+      "compiledValue": "#002850"
     },
     {
-      "name": "$spacer",
-      "value": "$grid-size",
-      "compiledValue": "0.5rem"
+      "name": "$blue-900",
+      "value": "#033464",
+      "compiledValue": "#033464"
     },
     {
-      "name": "$spacers",
-      "value": "( 1: $gl-spacing-scale-2, 2: $gl-spacing-scale-3, 3: $gl-spacing-scale-5, 4: $gl-spacing-scale-6, 5: $gl-spacing-scale-7, 6: $gl-spacing-scale-8, 7: $gl-spacing-scale-9, 8: $gl-spacing-scale-10, 9: $gl-spacing-scale-11, )",
-      "mapValue": [
-        {
-          "name": "1",
-          "value": "$gl-spacing-scale-2",
-          "compiledValue": "0.25rem"
-        },
-        {
-          "name": "2",
-          "value": "$gl-spacing-scale-3",
-          "compiledValue": "0.5rem"
-        },
-        {
-          "name": "3",
-          "value": "$gl-spacing-scale-5",
-          "compiledValue": "1rem"
-        },
-        {
-          "name": "4",
-          "value": "$gl-spacing-scale-6",
-          "compiledValue": "1.5rem"
-        },
-        {
-          "name": "5",
-          "value": "$gl-spacing-scale-7",
-          "compiledValue": "2rem"
-        },
-        {
-          "name": "6",
-          "value": "$gl-spacing-scale-8",
-          "compiledValue": "2.5rem"
-        },
-        {
-          "name": "7",
-          "value": "$gl-spacing-scale-9",
-          "compiledValue": "3rem"
-        },
-        {
-          "name": "8",
-          "value": "$gl-spacing-scale-10",
-          "compiledValue": "3.5rem"
-        },
-        {
-          "name": "9",
-          "value": "$gl-spacing-scale-11",
-          "compiledValue": "4rem"
-        }
-      ],
-      "compiledValue": "(1: 0.25rem, 2: 0.5rem, 3: 1rem, 4: 1.5rem, 5: 2rem, 6: 2.5rem, 7: 3rem, 8: 3.5rem, 9: 4rem)"
+      "name": "$blue-800",
+      "value": "#064787",
+      "compiledValue": "#064787"
     },
     {
-      "name": "$table-accent-bg",
-      "value": "$gray-50",
-      "compiledValue": "#ececef"
+      "name": "$blue-700",
+      "value": "#0b5cad",
+      "compiledValue": "#0b5cad"
     },
     {
-      "name": "$card-border-color",
-      "value": "$gray-100",
-      "compiledValue": "#dcdcde"
+      "name": "$blue-600",
+      "value": "#1068bf",
+      "compiledValue": "#1068bf"
     },
     {
-      "name": "$card-cap-bg",
-      "value": "$gray-10",
-      "compiledValue": "#fbfafd"
+      "name": "$blue-500",
+      "value": "#1f75cb",
+      "compiledValue": "#1f75cb"
     },
     {
-      "name": "$gl-form-input-sizes",
-      "value": "( xs: $grid-size * 10, sm: $grid-size * 20, md: $grid-size * 30, lg: $grid-size * 40, xl: $grid-size * 70, )",
-      "mapValue": [
-        {
-          "name": "xs",
-          "value": "$grid-size * 10",
-          "compiledValue": "5rem"
-        },
-        {
-          "name": "sm",
-          "value": "$grid-size * 20",
-          "compiledValue": "10rem"
-        },
-        {
-          "name": "md",
-          "value": "$grid-size * 30",
-          "compiledValue": "15rem"
-        },
-        {
-          "name": "lg",
-          "value": "$grid-size * 40",
-          "compiledValue": "20rem"
-        },
-        {
-          "name": "xl",
-          "value": "$grid-size * 70",
-          "compiledValue": "35rem"
-        }
-      ],
-      "compiledValue": "(xs: 5rem, sm: 10rem, md: 15rem, lg: 20rem, xl: 35rem)"
+      "name": "$blue-400",
+      "value": "#428fdc",
+      "compiledValue": "#428fdc"
     },
     {
-      "name": "$popover-bg",
-      "value": "$white",
-      "compiledValue": "#fff"
+      "name": "$blue-300",
+      "value": "#63a6e9",
+      "compiledValue": "#63a6e9"
     },
     {
-      "name": "$popover-arrow-width",
-      "value": "0.5rem",
-      "compiledValue": "0.5rem"
+      "name": "$blue-200",
+      "value": "#9dc7f1",
+      "compiledValue": "#9dc7f1"
     },
     {
-      "name": "$popover-arrow-height",
-      "value": "0.25rem",
-      "compiledValue": "0.25rem"
+      "name": "$blue-100",
+      "value": "#cbe2f9",
+      "compiledValue": "#cbe2f9"
     },
     {
-      "name": "$popover-arrow-color",
-      "value": "$popover-bg",
-      "compiledValue": "#fff"
+      "name": "$blue-50",
+      "value": "#e9f3fc",
+      "compiledValue": "#e9f3fc"
     },
     {
-      "name": "$popover-arrow-outer-color",
-      "value": "$gray-100",
-      "compiledValue": "#dcdcde"
+      "name": "$white",
+      "value": "#fff",
+      "compiledValue": "#fff"
     },
     {
-      "name": "$tooltip-opacity",
-      "value": "1",
-      "compiledValue": "1"
+      "name": "$black",
+      "value": "#000",
+      "compiledValue": "#000"
     }
   ]
 }