@amsterdam/design-system-tokens 0.1.6 → 0.1.7

package/dist/tokens.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 10 Oct 2023 11:59:09 GMT
+ * Generated on Fri, 17 Nov 2023 13:11:47 GMT
  */
 
 module.exports = {
@@ -83,11 +83,11 @@ module.exports = {
         ]
       },
       "dark-blue": {
-        "value": "#00387A",
+        "value": "#102E62",
         "filePath": "./src/brand/amsterdam/color.tokens.json",
         "isSource": true,
         "original": {
-          "value": "#00387A"
+          "value": "#102E62"
         },
         "name": "amsterdamColorDarkBlue",
         "attributes": {
@@ -312,23 +312,23 @@ module.exports = {
       }
     },
     "proportion": {
-      "extra-tall": {
+      "x-tall": {
         "value": "9 / 16",
         "filePath": "./src/brand/amsterdam/proportion.tokens.json",
         "isSource": true,
         "original": {
           "value": "9 / 16"
         },
-        "name": "amsterdamProportionExtraTall",
+        "name": "amsterdamProportionXTall",
         "attributes": {
           "category": "amsterdam",
           "type": "proportion",
-          "item": "extra-tall"
+          "item": "x-tall"
         },
         "path": [
           "amsterdam",
           "proportion",
-          "extra-tall"
+          "x-tall"
         ]
       },
       "tall": {
@@ -388,23 +388,42 @@ module.exports = {
           "wide"
         ]
       },
-      "extra-wide": {
+      "x-wide": {
         "value": "16 / 9",
         "filePath": "./src/brand/amsterdam/proportion.tokens.json",
         "isSource": true,
         "original": {
           "value": "16 / 9"
         },
-        "name": "amsterdamProportionExtraWide",
+        "name": "amsterdamProportionXWide",
         "attributes": {
           "category": "amsterdam",
           "type": "proportion",
-          "item": "extra-wide"
+          "item": "x-wide"
         },
         "path": [
           "amsterdam",
           "proportion",
-          "extra-wide"
+          "x-wide"
+        ]
+      },
+      "2x-wide": {
+        "value": "32 / 9",
+        "filePath": "./src/brand/amsterdam/proportion.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "32 / 9"
+        },
+        "name": "amsterdamProportion2xWide",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "proportion",
+          "item": "2x-wide"
+        },
+        "path": [
+          "amsterdam",
+          "proportion",
+          "2x-wide"
         ]
       }
     },
@@ -1876,23 +1895,23 @@ module.exports = {
       }
     },
     "aspect-ratio": {
-      "extra-tall": {
+      "x-tall": {
         "value": "9 / 16",
         "filePath": "./src/components/amsterdam/aspect-ratio.tokens.json",
         "isSource": true,
         "original": {
-          "value": "{amsterdam.proportion.extra-tall}"
+          "value": "{amsterdam.proportion.x-tall}"
         },
-        "name": "amsterdamAspectRatioExtraTall",
+        "name": "amsterdamAspectRatioXTall",
         "attributes": {
           "category": "amsterdam",
           "type": "aspect-ratio",
-          "item": "extra-tall"
+          "item": "x-tall"
         },
         "path": [
           "amsterdam",
           "aspect-ratio",
-          "extra-tall"
+          "x-tall"
         ]
       },
       "tall": {
@@ -1952,23 +1971,42 @@ module.exports = {
           "wide"
         ]
       },
-      "extra-wide": {
+      "x-wide": {
         "value": "16 / 9",
         "filePath": "./src/components/amsterdam/aspect-ratio.tokens.json",
         "isSource": true,
         "original": {
-          "value": "{amsterdam.proportion.extra-wide}"
+          "value": "{amsterdam.proportion.x-wide}"
+        },
+        "name": "amsterdamAspectRatioXWide",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "aspect-ratio",
+          "item": "x-wide"
+        },
+        "path": [
+          "amsterdam",
+          "aspect-ratio",
+          "x-wide"
+        ]
+      },
+      "2x-wide": {
+        "value": "32 / 9",
+        "filePath": "./src/components/amsterdam/aspect-ratio.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.proportion.2x-wide}"
         },
-        "name": "amsterdamAspectRatioExtraWide",
+        "name": "amsterdamAspectRatio2xWide",
         "attributes": {
           "category": "amsterdam",
           "type": "aspect-ratio",
-          "item": "extra-wide"
+          "item": "2x-wide"
         },
         "path": [
           "amsterdam",
           "aspect-ratio",
-          "extra-wide"
+          "2x-wide"
         ]
       }
     },
@@ -2154,6 +2192,25 @@ module.exports = {
           "font-family"
         ]
       },
+      "font-weight": {
+        "value": 400,
+        "filePath": "./src/components/amsterdam/breadcrumb.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.typography.font-weight.normal}"
+        },
+        "name": "amsterdamBreadcrumbFontWeight",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "breadcrumb",
+          "item": "font-weight"
+        },
+        "path": [
+          "amsterdam",
+          "breadcrumb",
+          "font-weight"
+        ]
+      },
       "line-height": {
         "value": "1.6",
         "filePath": "./src/components/amsterdam/breadcrumb.tokens.json",
@@ -2243,7 +2300,7 @@ module.exports = {
         },
         "hover": {
           "color": {
-            "value": "#00387A",
+            "value": "#102E62",
             "filePath": "./src/components/amsterdam/breadcrumb.tokens.json",
             "isSource": true,
             "original": {
@@ -2266,7 +2323,7 @@ module.exports = {
             ]
           },
           "box-shadow": {
-            "value": "inset 0 -2px 0 0 #00387A",
+            "value": "inset 0 -2px 0 0 #102E62",
             "filePath": "./src/components/amsterdam/breadcrumb.tokens.json",
             "isSource": true,
             "original": {
@@ -2291,7 +2348,7 @@ module.exports = {
         },
         "focus": {
           "color": {
-            "value": "#00387A",
+            "value": "#102E62",
             "filePath": "./src/components/amsterdam/breadcrumb.tokens.json",
             "isSource": true,
             "original": {
@@ -2410,7 +2467,7 @@ module.exports = {
         },
         "hover": {
           "box-shadow": {
-            "value": "inset 0 0 0 3px #00387A",
+            "value": "inset 0 0 0 3px #102E62",
             "filePath": "./src/components/amsterdam/button.tokens.json",
             "isSource": true,
             "original": {
@@ -2460,11 +2517,11 @@ module.exports = {
         },
         "focus": {
           "box-shadow": {
-            "value": "inset 0 0 0 3px #00387A",
+            "value": "inset 0 0 0 2px #004699",
             "filePath": "./src/components/amsterdam/button.tokens.json",
             "isSource": true,
             "original": {
-              "value": "inset 0 0 0 3px {amsterdam.color.dark-blue}"
+              "value": "inset 0 0 0 2px {amsterdam.color.primary-blue}"
             },
             "name": "amsterdamButtonSecondaryFocusBoxShadow",
             "attributes": {
@@ -2481,29 +2538,6 @@ module.exports = {
               "focus",
               "box-shadow"
             ]
-          },
-          "color": {
-            "value": "#00387A",
-            "filePath": "./src/components/amsterdam/button.tokens.json",
-            "isSource": true,
-            "original": {
-              "value": "{amsterdam.color.dark-blue}"
-            },
-            "name": "amsterdamButtonSecondaryFocusColor",
-            "attributes": {
-              "category": "amsterdam",
-              "type": "button",
-              "item": "secondary",
-              "subitem": "focus",
-              "state": "color"
-            },
-            "path": [
-              "amsterdam",
-              "button",
-              "secondary",
-              "focus",
-              "color"
-            ]
           }
         }
       },
@@ -2532,32 +2566,76 @@ module.exports = {
               "box-shadow"
             ]
           }
+        }
+      }
+    },
+    "card": {
+      "link": {
+        "color": {
+          "value": "#004699",
+          "filePath": "./src/components/amsterdam/card.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.primary-blue}"
+          },
+          "name": "amsterdamCardLinkColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "card",
+            "item": "link",
+            "subitem": "color"
+          },
+          "path": [
+            "amsterdam",
+            "card",
+            "link",
+            "color"
+          ]
         },
-        "focus": {
-          "box-shadow": {
-            "value": "inset 0 0 0 2px #767676",
-            "filePath": "./src/components/amsterdam/button.tokens.json",
+        "hover": {
+          "color": {
+            "value": "#102E62",
+            "filePath": "./src/components/amsterdam/card.tokens.json",
             "isSource": true,
             "original": {
-              "value": "inset 0 0 0 2px {amsterdam.color.neutral-grey3}"
+              "value": "{amsterdam.color.dark-blue}"
             },
-            "name": "amsterdamButtonTertiaryFocusBoxShadow",
+            "name": "amsterdamCardLinkHoverColor",
             "attributes": {
               "category": "amsterdam",
-              "type": "button",
-              "item": "tertiary",
-              "subitem": "focus",
-              "state": "box-shadow"
+              "type": "card",
+              "item": "link",
+              "subitem": "hover",
+              "state": "color"
             },
             "path": [
               "amsterdam",
-              "button",
-              "tertiary",
-              "focus",
-              "box-shadow"
+              "card",
+              "link",
+              "hover",
+              "color"
             ]
           }
         }
+      },
+      "outline-offset": {
+        "value": "2px",
+        "filePath": "./src/components/amsterdam/card.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.focus.outline-offset}"
+        },
+        "name": "amsterdamCardOutlineOffset",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "card",
+          "item": "outline-offset"
+        },
+        "path": [
+          "amsterdam",
+          "card",
+          "outline-offset"
+        ]
       }
     },
     "checkbox": {
@@ -2628,7 +2706,7 @@ module.exports = {
           },
           "hover": {
             "background-color": {
-              "value": "#00387A",
+              "value": "#102E62",
               "filePath": "./src/components/amsterdam/checkbox.tokens.json",
               "isSource": true,
               "original": {
@@ -2786,7 +2864,7 @@ module.exports = {
         },
         "hover": {
           "border-color": {
-            "value": "#00387A",
+            "value": "#102E62",
             "filePath": "./src/components/amsterdam/checkbox.tokens.json",
             "isSource": true,
             "original": {
@@ -2992,7 +3070,7 @@ module.exports = {
           },
           "hover": {
             "background-color": {
-              "value": "#00387A",
+              "value": "#102E62",
               "filePath": "./src/components/amsterdam/checkbox.tokens.json",
               "isSource": true,
               "original": {
@@ -3152,7 +3230,7 @@ module.exports = {
       },
       "hover": {
         "color": {
-          "value": "#00387A",
+          "value": "#102E62",
           "filePath": "./src/components/amsterdam/checkbox.tokens.json",
           "isSource": true,
           "original": {
@@ -3407,6 +3485,169 @@ module.exports = {
         }
       }
     },
+    "grid": {
+      "column-count": {
+        "value": "4",
+        "filePath": "./src/components/amsterdam/grid.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "4"
+        },
+        "name": "amsterdamGridColumnCount",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "grid",
+          "item": "column-count"
+        },
+        "path": [
+          "amsterdam",
+          "grid",
+          "column-count"
+        ]
+      },
+      "density-low": {
+        "gap": {
+          "value": "clamp(1rem, 3.125vw + 0.375rem, 3.5rem)",
+          "comment": "Grows from 16px at 320px wide to 56px at 1600px wide.",
+          "filePath": "./src/components/amsterdam/grid.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "clamp(1rem, 3.125vw + 0.375rem, 3.5rem)",
+            "comment": "Grows from 16px at 320px wide to 56px at 1600px wide."
+          },
+          "name": "amsterdamGridDensityLowGap",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "grid",
+            "item": "density-low",
+            "subitem": "gap"
+          },
+          "path": [
+            "amsterdam",
+            "grid",
+            "density-low",
+            "gap"
+          ]
+        },
+        "padding-inline": {
+          "value": "clamp(1.5rem, 4.6875vw + 0.5625rem, 5.25rem)",
+          "comment": "Equals 1.5 times the gap.",
+          "filePath": "./src/components/amsterdam/grid.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "clamp(1.5rem, 4.6875vw + 0.5625rem, 5.25rem)",
+            "comment": "Equals 1.5 times the gap."
+          },
+          "name": "amsterdamGridDensityLowPaddingInline",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "grid",
+            "item": "density-low",
+            "subitem": "padding-inline"
+          },
+          "path": [
+            "amsterdam",
+            "grid",
+            "density-low",
+            "padding-inline"
+          ]
+        }
+      },
+      "density-high": {
+        "gap": {
+          "value": "clamp(1rem, 1.5625vw - 0.0625rem, 2.5rem)",
+          "comment": "Grows from 16px at 1088px wide to 40px at 2624px wide.",
+          "filePath": "./src/components/amsterdam/grid.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "clamp(1rem, 1.5625vw - 0.0625rem, 2.5rem)",
+            "comment": "Grows from 16px at 1088px wide to 40px at 2624px wide."
+          },
+          "name": "amsterdamGridDensityHighGap",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "grid",
+            "item": "density-high",
+            "subitem": "gap"
+          },
+          "path": [
+            "amsterdam",
+            "grid",
+            "density-high",
+            "gap"
+          ]
+        },
+        "padding-inline": {
+          "value": "clamp(1rem, 1.5625vw - 0.0625rem, 2.5rem)",
+          "comment": "Equals the gap.",
+          "filePath": "./src/components/amsterdam/grid.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "clamp(1rem, 1.5625vw - 0.0625rem, 2.5rem)",
+            "comment": "Equals the gap."
+          },
+          "name": "amsterdamGridDensityHighPaddingInline",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "grid",
+            "item": "density-high",
+            "subitem": "padding-inline"
+          },
+          "path": [
+            "amsterdam",
+            "grid",
+            "density-high",
+            "padding-inline"
+          ]
+        }
+      },
+      "medium": {
+        "column-count": {
+          "value": "8",
+          "filePath": "./src/components/amsterdam/grid.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "8"
+          },
+          "name": "amsterdamGridMediumColumnCount",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "grid",
+            "item": "medium",
+            "subitem": "column-count"
+          },
+          "path": [
+            "amsterdam",
+            "grid",
+            "medium",
+            "column-count"
+          ]
+        }
+      },
+      "wide": {
+        "column-count": {
+          "value": "12",
+          "filePath": "./src/components/amsterdam/grid.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "12"
+          },
+          "name": "amsterdamGridWideColumnCount",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "grid",
+            "item": "wide",
+            "subitem": "column-count"
+          },
+          "path": [
+            "amsterdam",
+            "grid",
+            "wide",
+            "column-count"
+          ]
+        }
+      }
+    },
     "heading": {
       "1": {
         "line-height": {
@@ -3777,50 +4018,236 @@ module.exports = {
         ]
       }
     },
-    "icon": {
-      "size-3": {
-        "icon-size": {
-          "narrow": {
-            "value": "clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem)",
-            "filePath": "./src/components/amsterdam/icon.tokens.json",
-            "isSource": true,
-            "original": {
-              "value": "{amsterdam.typography.text-level.3.narrow.font-size}"
-            },
-            "name": "amsterdamIconSize3IconSizeNarrow",
-            "attributes": {
-              "category": "amsterdam",
-              "type": "icon",
-              "item": "size-3",
-              "subitem": "icon-size",
-              "state": "narrow"
-            },
-            "path": [
-              "amsterdam",
-              "icon",
-              "size-3",
-              "icon-size",
-              "narrow"
-            ]
+    "highlight": {
+      "blue": {
+        "background-color": {
+          "value": "#004699",
+          "filePath": "./src/components/amsterdam/highlight.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.primary-blue}"
           },
-          "wide": {
-            "value": "clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem)",
-            "filePath": "./src/components/amsterdam/icon.tokens.json",
-            "isSource": true,
-            "original": {
-              "value": "{amsterdam.typography.text-level.3.wide.font-size}"
-            },
-            "name": "amsterdamIconSize3IconSizeWide",
-            "attributes": {
-              "category": "amsterdam",
-              "type": "icon",
-              "item": "size-3",
-              "subitem": "icon-size",
-              "state": "wide"
-            },
-            "path": [
-              "amsterdam",
-              "icon",
+          "name": "amsterdamHighlightBlueBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "highlight",
+            "item": "blue",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "highlight",
+            "blue",
+            "background-color"
+          ]
+        }
+      },
+      "dark-green": {
+        "background-color": {
+          "value": "#00A03C",
+          "filePath": "./src/components/amsterdam/highlight.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.dark-green}"
+          },
+          "name": "amsterdamHighlightDarkGreenBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "highlight",
+            "item": "dark-green",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "highlight",
+            "dark-green",
+            "background-color"
+          ]
+        }
+      },
+      "green": {
+        "background-color": {
+          "value": "#BED200",
+          "filePath": "./src/components/amsterdam/highlight.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.green}"
+          },
+          "name": "amsterdamHighlightGreenBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "highlight",
+            "item": "green",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "highlight",
+            "green",
+            "background-color"
+          ]
+        }
+      },
+      "light-blue": {
+        "background-color": {
+          "value": "#009DEC",
+          "filePath": "./src/components/amsterdam/highlight.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.blue}"
+          },
+          "name": "amsterdamHighlightLightBlueBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "highlight",
+            "item": "light-blue",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "highlight",
+            "light-blue",
+            "background-color"
+          ]
+        }
+      },
+      "magenta": {
+        "background-color": {
+          "value": "#E50082",
+          "filePath": "./src/components/amsterdam/highlight.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.magenta}"
+          },
+          "name": "amsterdamHighlightMagentaBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "highlight",
+            "item": "magenta",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "highlight",
+            "magenta",
+            "background-color"
+          ]
+        }
+      },
+      "orange": {
+        "background-color": {
+          "value": "#FF9100",
+          "filePath": "./src/components/amsterdam/highlight.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.orange}"
+          },
+          "name": "amsterdamHighlightOrangeBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "highlight",
+            "item": "orange",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "highlight",
+            "orange",
+            "background-color"
+          ]
+        }
+      },
+      "purple": {
+        "background-color": {
+          "value": "#A00078",
+          "filePath": "./src/components/amsterdam/highlight.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.purple}"
+          },
+          "name": "amsterdamHighlightPurpleBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "highlight",
+            "item": "purple",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "highlight",
+            "purple",
+            "background-color"
+          ]
+        }
+      },
+      "yellow": {
+        "background-color": {
+          "value": "#FFE600",
+          "filePath": "./src/components/amsterdam/highlight.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.yellow}"
+          },
+          "name": "amsterdamHighlightYellowBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "highlight",
+            "item": "yellow",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "highlight",
+            "yellow",
+            "background-color"
+          ]
+        }
+      }
+    },
+    "icon": {
+      "size-3": {
+        "icon-size": {
+          "narrow": {
+            "value": "clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem)",
+            "filePath": "./src/components/amsterdam/icon.tokens.json",
+            "isSource": true,
+            "original": {
+              "value": "{amsterdam.typography.text-level.3.narrow.font-size}"
+            },
+            "name": "amsterdamIconSize3IconSizeNarrow",
+            "attributes": {
+              "category": "amsterdam",
+              "type": "icon",
+              "item": "size-3",
+              "subitem": "icon-size",
+              "state": "narrow"
+            },
+            "path": [
+              "amsterdam",
+              "icon",
+              "size-3",
+              "icon-size",
+              "narrow"
+            ]
+          },
+          "wide": {
+            "value": "clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem)",
+            "filePath": "./src/components/amsterdam/icon.tokens.json",
+            "isSource": true,
+            "original": {
+              "value": "{amsterdam.typography.text-level.3.wide.font-size}"
+            },
+            "name": "amsterdamIconSize3IconSizeWide",
+            "attributes": {
+              "category": "amsterdam",
+              "type": "icon",
+              "item": "size-3",
+              "subitem": "icon-size",
+              "state": "wide"
+            },
+            "path": [
+              "amsterdam",
+              "icon",
               "size-3",
               "icon-size",
               "wide"
@@ -4211,31 +4638,31 @@ module.exports = {
           "font-weight"
         ]
       },
-      "focus": {
+      "hover": {
         "color": {
-          "value": "#00387A",
+          "value": "#102E62",
           "filePath": "./src/components/amsterdam/link.tokens.json",
           "isSource": true,
           "original": {
             "value": "{amsterdam.color.dark-blue}"
           },
-          "name": "amsterdamLinkFocusColor",
+          "name": "amsterdamLinkHoverColor",
           "attributes": {
             "category": "amsterdam",
             "type": "link",
-            "item": "focus",
+            "item": "hover",
             "subitem": "color"
           },
           "path": [
             "amsterdam",
             "link",
-            "focus",
+            "hover",
             "color"
           ]
         }
       },
       "inline": {
-        "focus": {
+        "hover": {
           "text-decoration": {
             "value": "underline",
             "filePath": "./src/components/amsterdam/link.tokens.json",
@@ -4243,19 +4670,19 @@ module.exports = {
             "original": {
               "value": "underline"
             },
-            "name": "amsterdamLinkInlineFocusTextDecoration",
+            "name": "amsterdamLinkInlineHoverTextDecoration",
             "attributes": {
               "category": "amsterdam",
               "type": "link",
               "item": "inline",
-              "subitem": "focus",
+              "subitem": "hover",
               "state": "text-decoration"
             },
             "path": [
               "amsterdam",
               "link",
               "inline",
-              "focus",
+              "hover",
               "text-decoration"
             ]
           },
@@ -4266,19 +4693,19 @@ module.exports = {
             "original": {
               "value": "3px"
             },
-            "name": "amsterdamLinkInlineFocusTextUnderlineOffset",
+            "name": "amsterdamLinkInlineHoverTextUnderlineOffset",
             "attributes": {
               "category": "amsterdam",
               "type": "link",
               "item": "inline",
-              "subitem": "focus",
+              "subitem": "hover",
               "state": "text-underline-offset"
             },
             "path": [
               "amsterdam",
               "link",
               "inline",
-              "focus",
+              "hover",
               "text-underline-offset"
             ]
           }
@@ -4367,6 +4794,27 @@ module.exports = {
             "text-decoration"
           ]
         },
+        "text-decoration-thickness": {
+          "value": "2px",
+          "filePath": "./src/components/amsterdam/link.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "2px"
+          },
+          "name": "amsterdamLinkInlineTextDecorationThickness",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "link",
+            "item": "inline",
+            "subitem": "text-decoration-thickness"
+          },
+          "path": [
+            "amsterdam",
+            "link",
+            "inline",
+            "text-decoration-thickness"
+          ]
+        },
         "visited": {
           "color": {
             "value": "#A00078",
@@ -4415,7 +4863,7 @@ module.exports = {
             "gap"
           ]
         },
-        "focus": {
+        "hover": {
           "text-decoration": {
             "value": "underline",
             "filePath": "./src/components/amsterdam/link.tokens.json",
@@ -4423,19 +4871,19 @@ module.exports = {
             "original": {
               "value": "underline"
             },
-            "name": "amsterdamLinkInListFocusTextDecoration",
+            "name": "amsterdamLinkInListHoverTextDecoration",
             "attributes": {
               "category": "amsterdam",
               "type": "link",
               "item": "in-list",
-              "subitem": "focus",
+              "subitem": "hover",
               "state": "text-decoration"
             },
             "path": [
               "amsterdam",
               "link",
               "in-list",
-              "focus",
+              "hover",
               "text-decoration"
             ]
           },
@@ -4446,19 +4894,19 @@ module.exports = {
             "original": {
               "value": "2px"
             },
-            "name": "amsterdamLinkInListFocusTextDecorationThickness",
+            "name": "amsterdamLinkInListHoverTextDecorationThickness",
             "attributes": {
               "category": "amsterdam",
               "type": "link",
               "item": "in-list",
-              "subitem": "focus",
+              "subitem": "hover",
               "state": "text-decoration-thickness"
             },
             "path": [
               "amsterdam",
               "link",
               "in-list",
-              "focus",
+              "hover",
               "text-decoration-thickness"
             ]
           },
@@ -4469,19 +4917,19 @@ module.exports = {
             "original": {
               "value": "7px"
             },
-            "name": "amsterdamLinkInListFocusTextUnderlineOffset",
+            "name": "amsterdamLinkInListHoverTextUnderlineOffset",
             "attributes": {
               "category": "amsterdam",
               "type": "link",
               "item": "in-list",
-              "subitem": "focus",
+              "subitem": "hover",
               "state": "text-underline-offset"
             },
             "path": [
               "amsterdam",
               "link",
               "in-list",
-              "focus",
+              "hover",
               "text-underline-offset"
             ]
           }
@@ -4622,7 +5070,7 @@ module.exports = {
             "text-decoration-thickness"
           ]
         },
-        "focus": {
+        "hover": {
           "text-decoration-thickness": {
             "value": "3px",
             "filePath": "./src/components/amsterdam/link.tokens.json",
@@ -4630,19 +5078,19 @@ module.exports = {
             "original": {
               "value": "3px"
             },
-            "name": "amsterdamLinkStandaloneFocusTextDecorationThickness",
+            "name": "amsterdamLinkStandaloneHoverTextDecorationThickness",
             "attributes": {
               "category": "amsterdam",
               "type": "link",
               "item": "standalone",
-              "subitem": "focus",
+              "subitem": "hover",
               "state": "text-decoration-thickness"
             },
             "path": [
               "amsterdam",
               "link",
               "standalone",
-              "focus",
+              "hover",
               "text-decoration-thickness"
             ]
           },
@@ -4653,19 +5101,19 @@ module.exports = {
             "original": {
               "value": "7px"
             },
-            "name": "amsterdamLinkStandaloneFocusTextUnderlineOffset",
+            "name": "amsterdamLinkStandaloneHoverTextUnderlineOffset",
             "attributes": {
               "category": "amsterdam",
               "type": "link",
               "item": "standalone",
-              "subitem": "focus",
+              "subitem": "hover",
               "state": "text-underline-offset"
             },
             "path": [
               "amsterdam",
               "link",
               "standalone",
-              "focus",
+              "hover",
               "text-underline-offset"
             ]
           }
@@ -5174,90 +5622,6 @@ module.exports = {
         }
       }
     },
-    "page-grid": {
-      "column-count": {
-        "narrow": {
-          "value": "4",
-          "filePath": "./src/components/amsterdam/page-grid.tokens.json",
-          "isSource": true,
-          "original": {
-            "value": "4"
-          },
-          "name": "amsterdamPageGridColumnCountNarrow",
-          "attributes": {
-            "category": "amsterdam",
-            "type": "page-grid",
-            "item": "column-count",
-            "subitem": "narrow"
-          },
-          "path": [
-            "amsterdam",
-            "page-grid",
-            "column-count",
-            "narrow"
-          ]
-        },
-        "wide": {
-          "value": "12",
-          "filePath": "./src/components/amsterdam/page-grid.tokens.json",
-          "isSource": true,
-          "original": {
-            "value": "12"
-          },
-          "name": "amsterdamPageGridColumnCountWide",
-          "attributes": {
-            "category": "amsterdam",
-            "type": "page-grid",
-            "item": "column-count",
-            "subitem": "wide"
-          },
-          "path": [
-            "amsterdam",
-            "page-grid",
-            "column-count",
-            "wide"
-          ]
-        }
-      },
-      "column-gap": {
-        "value": "clamp(0.5rem, calc(0.5rem + 0.0142857143 * (100vw - 20rem)), 1.5rem)",
-        "filePath": "./src/components/amsterdam/page-grid.tokens.json",
-        "isSource": true,
-        "original": {
-          "value": "clamp(0.5rem, calc(0.5rem + 0.0142857143 * (100vw - 20rem)), 1.5rem)"
-        },
-        "name": "amsterdamPageGridColumnGap",
-        "attributes": {
-          "category": "amsterdam",
-          "type": "page-grid",
-          "item": "column-gap"
-        },
-        "path": [
-          "amsterdam",
-          "page-grid",
-          "column-gap"
-        ]
-      },
-      "max-width": {
-        "value": "1440px",
-        "filePath": "./src/components/amsterdam/page-grid.tokens.json",
-        "isSource": true,
-        "original": {
-          "value": "1440px"
-        },
-        "name": "amsterdamPageGridMaxWidth",
-        "attributes": {
-          "category": "amsterdam",
-          "type": "page-grid",
-          "item": "max-width"
-        },
-        "path": [
-          "amsterdam",
-          "page-grid",
-          "max-width"
-        ]
-      }
-    },
     "page-heading": {
       "color": {
         "value": "#000000",
@@ -5598,72 +5962,269 @@ module.exports = {
             "filePath": "./src/components/amsterdam/page-menu.tokens.json",
             "isSource": true,
             "original": {
-              "value": "{amsterdam.typography.text-level.7.wide.font-size}"
+              "value": "{amsterdam.typography.text-level.7.wide.font-size}"
+            },
+            "name": "amsterdamPageMenuItemWideFontSize",
+            "attributes": {
+              "category": "amsterdam",
+              "type": "page-menu",
+              "item": "item",
+              "subitem": "wide",
+              "state": "font-size"
+            },
+            "path": [
+              "amsterdam",
+              "page-menu",
+              "item",
+              "wide",
+              "font-size"
+            ]
+          }
+        },
+        "hover": {
+          "color": {
+            "value": "#000000",
+            "filePath": "./src/components/amsterdam/page-menu.tokens.json",
+            "isSource": true,
+            "original": {
+              "value": "{amsterdam.color.primary-black}"
+            },
+            "name": "amsterdamPageMenuItemHoverColor",
+            "attributes": {
+              "category": "amsterdam",
+              "type": "page-menu",
+              "item": "item",
+              "subitem": "hover",
+              "state": "color"
+            },
+            "path": [
+              "amsterdam",
+              "page-menu",
+              "item",
+              "hover",
+              "color"
+            ]
+          },
+          "text-decoration": {
+            "value": "underline",
+            "filePath": "./src/components/amsterdam/page-menu.tokens.json",
+            "isSource": true,
+            "original": {
+              "value": "underline"
+            },
+            "name": "amsterdamPageMenuItemHoverTextDecoration",
+            "attributes": {
+              "category": "amsterdam",
+              "type": "page-menu",
+              "item": "item",
+              "subitem": "hover",
+              "state": "text-decoration"
+            },
+            "path": [
+              "amsterdam",
+              "page-menu",
+              "item",
+              "hover",
+              "text-decoration"
+            ]
+          }
+        }
+      }
+    },
+    "pagination": {
+      "color": {
+        "value": "#004699",
+        "filePath": "./src/components/amsterdam/pagination.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.color.primary-blue}"
+        },
+        "name": "amsterdamPaginationColor",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "pagination",
+          "item": "color"
+        },
+        "path": [
+          "amsterdam",
+          "pagination",
+          "color"
+        ]
+      },
+      "font-family": {
+        "value": "'Amsterdam Sans', Arial, sans-serif",
+        "filePath": "./src/components/amsterdam/pagination.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.typography.font-family}"
+        },
+        "name": "amsterdamPaginationFontFamily",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "pagination",
+          "item": "font-family"
+        },
+        "path": [
+          "amsterdam",
+          "pagination",
+          "font-family"
+        ]
+      },
+      "font-weight": {
+        "value": 400,
+        "filePath": "./src/components/amsterdam/pagination.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.typography.font-weight.normal}"
+        },
+        "name": "amsterdamPaginationFontWeight",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "pagination",
+          "item": "font-weight"
+        },
+        "path": [
+          "amsterdam",
+          "pagination",
+          "font-weight"
+        ]
+      },
+      "line-height": {
+        "value": "1.6",
+        "filePath": "./src/components/amsterdam/pagination.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.typography.text-level.6.line-height}"
+        },
+        "name": "amsterdamPaginationLineHeight",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "pagination",
+          "item": "line-height"
+        },
+        "path": [
+          "amsterdam",
+          "pagination",
+          "line-height"
+        ]
+      },
+      "narrow": {
+        "font-size": {
+          "value": "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)",
+          "filePath": "./src/components/amsterdam/pagination.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.typography.text-level.6.narrow.font-size}"
+          },
+          "name": "amsterdamPaginationNarrowFontSize",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "pagination",
+            "item": "narrow",
+            "subitem": "font-size"
+          },
+          "path": [
+            "amsterdam",
+            "pagination",
+            "narrow",
+            "font-size"
+          ]
+        }
+      },
+      "wide": {
+        "font-size": {
+          "value": "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)",
+          "filePath": "./src/components/amsterdam/pagination.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.typography.text-level.6.wide.font-size}"
+          },
+          "name": "amsterdamPaginationWideFontSize",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "pagination",
+            "item": "wide",
+            "subitem": "font-size"
+          },
+          "path": [
+            "amsterdam",
+            "pagination",
+            "wide",
+            "font-size"
+          ]
+        }
+      },
+      "button": {
+        "current": {
+          "font-weight": {
+            "value": 800,
+            "filePath": "./src/components/amsterdam/pagination.tokens.json",
+            "isSource": true,
+            "original": {
+              "value": "{amsterdam.typography.font-weight.bold}"
             },
-            "name": "amsterdamPageMenuItemWideFontSize",
+            "name": "amsterdamPaginationButtonCurrentFontWeight",
             "attributes": {
               "category": "amsterdam",
-              "type": "page-menu",
-              "item": "item",
-              "subitem": "wide",
-              "state": "font-size"
+              "type": "pagination",
+              "item": "button",
+              "subitem": "current",
+              "state": "font-weight"
             },
             "path": [
               "amsterdam",
-              "page-menu",
-              "item",
-              "wide",
-              "font-size"
+              "pagination",
+              "button",
+              "current",
+              "font-weight"
             ]
           }
         },
         "hover": {
           "color": {
-            "value": "#000000",
-            "filePath": "./src/components/amsterdam/page-menu.tokens.json",
+            "value": "#102E62",
+            "filePath": "./src/components/amsterdam/pagination.tokens.json",
             "isSource": true,
             "original": {
-              "value": "{amsterdam.color.primary-black}"
+              "value": "{amsterdam.color.dark-blue}"
             },
-            "name": "amsterdamPageMenuItemHoverColor",
+            "name": "amsterdamPaginationButtonHoverColor",
             "attributes": {
               "category": "amsterdam",
-              "type": "page-menu",
-              "item": "item",
+              "type": "pagination",
+              "item": "button",
               "subitem": "hover",
               "state": "color"
             },
             "path": [
               "amsterdam",
-              "page-menu",
-              "item",
+              "pagination",
+              "button",
               "hover",
               "color"
             ]
-          },
-          "text-decoration": {
-            "value": "underline",
-            "filePath": "./src/components/amsterdam/page-menu.tokens.json",
-            "isSource": true,
-            "original": {
-              "value": "underline"
-            },
-            "name": "amsterdamPageMenuItemHoverTextDecoration",
-            "attributes": {
-              "category": "amsterdam",
-              "type": "page-menu",
-              "item": "item",
-              "subitem": "hover",
-              "state": "text-decoration"
-            },
-            "path": [
-              "amsterdam",
-              "page-menu",
-              "item",
-              "hover",
-              "text-decoration"
-            ]
           }
+        },
+        "outline-offset": {
+          "value": "2px",
+          "filePath": "./src/components/amsterdam/pagination.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.focus.outline-offset}"
+          },
+          "name": "amsterdamPaginationButtonOutlineOffset",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "pagination",
+            "item": "button",
+            "subitem": "outline-offset"
+          },
+          "path": [
+            "amsterdam",
+            "pagination",
+            "button",
+            "outline-offset"
+          ]
         }
       }
     },
@@ -5956,6 +6517,268 @@ module.exports = {
         }
       }
     },
+    "screen": {
+      "wide": {
+        "max-width": {
+          "value": "100rem",
+          "filePath": "./src/components/amsterdam/screen.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "100rem"
+          },
+          "name": "amsterdamScreenWideMaxWidth",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "screen",
+            "item": "wide",
+            "subitem": "max-width"
+          },
+          "path": [
+            "amsterdam",
+            "screen",
+            "wide",
+            "max-width"
+          ]
+        }
+      },
+      "x-wide": {
+        "max-width": {
+          "value": "132rem",
+          "filePath": "./src/components/amsterdam/screen.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "132rem"
+          },
+          "name": "amsterdamScreenXWideMaxWidth",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "screen",
+            "item": "x-wide",
+            "subitem": "max-width"
+          },
+          "path": [
+            "amsterdam",
+            "screen",
+            "x-wide",
+            "max-width"
+          ]
+        }
+      }
+    },
+    "switch": {
+      "font-family": {
+        "value": "'Amsterdam Sans', Arial, sans-serif",
+        "filePath": "./src/components/amsterdam/switch.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.typography.font-family}"
+        },
+        "name": "amsterdamSwitchFontFamily",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "switch",
+          "item": "font-family"
+        },
+        "path": [
+          "amsterdam",
+          "switch",
+          "font-family"
+        ]
+      },
+      "background-color": {
+        "value": "#767676",
+        "filePath": "./src/components/amsterdam/switch.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.color.neutral-grey3}"
+        },
+        "name": "amsterdamSwitchBackgroundColor",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "switch",
+          "item": "background-color"
+        },
+        "path": [
+          "amsterdam",
+          "switch",
+          "background-color"
+        ]
+      },
+      "width": {
+        "value": "3.5rem",
+        "filePath": "./src/components/amsterdam/switch.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "3.5rem"
+        },
+        "name": "amsterdamSwitchWidth",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "switch",
+          "item": "width"
+        },
+        "path": [
+          "amsterdam",
+          "switch",
+          "width"
+        ]
+      },
+      "thumb": {
+        "background-color": {
+          "value": "#ffffff",
+          "filePath": "./src/components/amsterdam/switch.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.primary-white}"
+          },
+          "name": "amsterdamSwitchThumbBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "switch",
+            "item": "thumb",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "switch",
+            "thumb",
+            "background-color"
+          ]
+        },
+        "width": {
+          "value": "1.75rem",
+          "filePath": "./src/components/amsterdam/switch.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "1.75rem"
+          },
+          "name": "amsterdamSwitchThumbWidth",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "switch",
+            "item": "thumb",
+            "subitem": "width"
+          },
+          "path": [
+            "amsterdam",
+            "switch",
+            "thumb",
+            "width"
+          ]
+        },
+        "height": {
+          "value": "1.75rem",
+          "filePath": "./src/components/amsterdam/switch.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "1.75rem"
+          },
+          "name": "amsterdamSwitchThumbHeight",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "switch",
+            "item": "thumb",
+            "subitem": "height"
+          },
+          "path": [
+            "amsterdam",
+            "switch",
+            "thumb",
+            "height"
+          ]
+        },
+        "hover": {
+          "color": {
+            "value": "#102E62",
+            "filePath": "./src/components/amsterdam/switch.tokens.json",
+            "isSource": true,
+            "original": {
+              "value": "{amsterdam.color.dark-blue}"
+            },
+            "name": "amsterdamSwitchThumbHoverColor",
+            "attributes": {
+              "category": "amsterdam",
+              "type": "switch",
+              "item": "thumb",
+              "subitem": "hover",
+              "state": "color"
+            },
+            "path": [
+              "amsterdam",
+              "switch",
+              "thumb",
+              "hover",
+              "color"
+            ]
+          }
+        }
+      },
+      "checked": {
+        "background-color": {
+          "value": "#004699",
+          "filePath": "./src/components/amsterdam/switch.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.primary-blue}"
+          },
+          "name": "amsterdamSwitchCheckedBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "switch",
+            "item": "checked",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "switch",
+            "checked",
+            "background-color"
+          ]
+        }
+      },
+      "outline-offset": {
+        "value": "2px",
+        "filePath": "./src/components/amsterdam/switch.tokens.json",
+        "isSource": true,
+        "original": {
+          "value": "{amsterdam.focus.outline-offset}"
+        },
+        "name": "amsterdamSwitchOutlineOffset",
+        "attributes": {
+          "category": "amsterdam",
+          "type": "switch",
+          "item": "outline-offset"
+        },
+        "path": [
+          "amsterdam",
+          "switch",
+          "outline-offset"
+        ]
+      },
+      "disabled": {
+        "background-color": {
+          "value": "#B4B4B4",
+          "filePath": "./src/components/amsterdam/switch.tokens.json",
+          "isSource": true,
+          "original": {
+            "value": "{amsterdam.color.neutral-grey2}"
+          },
+          "name": "amsterdamSwitchDisabledBackgroundColor",
+          "attributes": {
+            "category": "amsterdam",
+            "type": "switch",
+            "item": "disabled",
+            "subitem": "background-color"
+          },
+          "path": [
+            "amsterdam",
+            "switch",
+            "disabled",
+            "background-color"
+          ]
+        }
+      }
+    },
     "top-task-link": {
       "description": {
         "color": {
@@ -6159,7 +6982,7 @@ module.exports = {
         },
         "hover": {
           "color": {
-            "value": "#00387A",
+            "value": "#102E62",
             "filePath": "./src/components/amsterdam/top-task-link.tokens.json",
             "isSource": true,
             "original": {
@@ -7011,7 +7834,7 @@ module.exports = {
         },
         "hover": {
           "background-color": {
-            "value": "#00387A",
+            "value": "#102E62",
             "filePath": "./src/components/utrecht/button.tokens.json",
             "isSource": true,
             "original": {
@@ -7037,29 +7860,7 @@ module.exports = {
           "color": {}
         },
         "focus": {
-          "background-color": {
-            "value": "#00387A",
-            "filePath": "./src/components/utrecht/button.tokens.json",
-            "isSource": true,
-            "original": {
-              "value": "{amsterdam.color.dark-blue}"
-            },
-            "name": "utrechtButtonPrimaryActionFocusBackgroundColor",
-            "attributes": {
-              "category": "utrecht",
-              "type": "button",
-              "item": "primary-action",
-              "subitem": "focus",
-              "state": "background-color"
-            },
-            "path": [
-              "utrecht",
-              "button",
-              "primary-action",
-              "focus",
-              "background-color"
-            ]
-          },
+          "background-color": {},
           "border-color": {},
           "border-width": {}
         },
@@ -7163,7 +7964,7 @@ module.exports = {
         "hover": {
           "background-color": {},
           "color": {
-            "value": "#00387A",
+            "value": "#102E62",
             "filePath": "./src/components/utrecht/button.tokens.json",
             "isSource": true,
             "original": {
@@ -7337,7 +8138,7 @@ module.exports = {
         "hover": {
           "background-color": {},
           "color": {
-            "value": "#00387A",
+            "value": "#102E62",
             "filePath": "./src/components/utrecht/button.tokens.json",
             "isSource": true,
             "original": {
@@ -7364,7 +8165,7 @@ module.exports = {
         "focus": {
           "background-color": {},
           "color": {
-            "value": "#00387A",
+            "value": "#102E62",
             "filePath": "./src/components/utrecht/button.tokens.json",
             "isSource": true,
             "original": {