@rijkshuisstijl-community/design-tokens 1.0.0-alpha.163 → 1.0.0-alpha.165

package/dist/_variables.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Wed, 19 Feb 2025 12:46:33 GMT
+// Generated on Thu, 20 Feb 2025 09:00:19 GMT
 
 $nl-number-badge-padding-block: 0.5rem;
 $nl-number-badge-padding-inline: 0.5rem;
@@ -65,6 +65,34 @@ $nl-paragraph-font-weight: 400;
 $nl-paragraph-font-size: 1.25rem;
 $nl-paragraph-font-family: Fira Sans, Arial, Verdana, sans-serif;
 $nl-paragraph-color: #154273;
+$nl-skip-link-text-underline-offset: 0.125rem;
+$nl-skip-link-text-decoration: underline;
+$nl-skip-link-box-block-end-shadow-color: #0000001a;
+$nl-skip-link-box-block-end-shadow-spread-radius: 0;
+$nl-skip-link-box-block-end-shadow-blur-radius: 48px;
+$nl-skip-link-box-block-end-shadow-offset-y: 16px;
+$nl-skip-link-box-block-end-shadow-offset-x: 0;
+$nl-skip-link-border-width: 2px;
+$nl-skip-link-color: #fff;
+$nl-skip-link-border-color: transparent;
+$nl-skip-link-background-color: #154273;
+$nl-skip-link-focus-visible-outline-color: #000;
+$nl-skip-link-focus-text-decoration: None;
+$nl-skip-link-focus-color: #154273;
+$nl-skip-link-focus-border-width: 2px;
+$nl-skip-link-focus-border-style: solid;
+$nl-skip-link-focus-border-color: #154273;
+$nl-skip-link-focus-background-color: #fff;
+$nl-skip-link-padding-inline-start: 1rem;
+$nl-skip-link-padding-inline-end: 1rem;
+$nl-skip-link-padding-block-start: 0.75rem;
+$nl-skip-link-padding-block-end: 0.75rem;
+$nl-skip-link-min-inline-size: 48px;
+$nl-skip-link-min-block-size: 48px;
+$nl-skip-link-line-height: 150%;
+$nl-skip-link-font-size: 1.25rem;
+$nl-skip-link-font-family: Fira Sans, Arial, Verdana, sans-serif;
+$nl-skip-link-font-weight: 700;
 $utrecht-focus-inverse-outline-color: transparant;
 $utrecht-focus-outline-width: 2px;
 $utrecht-focus-outline-style: solid;
@@ -545,34 +573,6 @@ $utrecht-separator-margin-block-start: 0.75rem;
 $utrecht-separator-margin-block-end: 0.75rem;
 $utrecht-separator-block-size: 2px;
 $utrecht-separator-color: #CBD5E1;
-$utrecht-skip-link-text-underline-offset: 0.125rem;
-$utrecht-skip-link-text-decoration: underline;
-$utrecht-skip-link-box-block-end-shadow-color: #0000001a;
-$utrecht-skip-link-box-block-end-shadow-spread-radius: 0;
-$utrecht-skip-link-box-block-end-shadow-blur-radius: 48px;
-$utrecht-skip-link-box-block-end-shadow-offset-y: 16px;
-$utrecht-skip-link-box-block-end-shadow-offset-x: 0;
-$utrecht-skip-link-border-width: 2px;
-$utrecht-skip-link-color: #fff;
-$utrecht-skip-link-border-color: transparent;
-$utrecht-skip-link-background-color: #154273;
-$utrecht-skip-link-focus-visible-outline-color: #000;
-$utrecht-skip-link-focus-text-decoration: None;
-$utrecht-skip-link-focus-color: #154273;
-$utrecht-skip-link-focus-border-width: 2px;
-$utrecht-skip-link-focus-border-style: solid;
-$utrecht-skip-link-focus-border-color: #154273;
-$utrecht-skip-link-focus-background-color: #fff;
-$utrecht-skip-link-padding-inline-start: 1rem;
-$utrecht-skip-link-padding-inline-end: 1rem;
-$utrecht-skip-link-padding-block-start: 0.75rem;
-$utrecht-skip-link-padding-block-end: 0.75rem;
-$utrecht-skip-link-min-inline-size: 48px;
-$utrecht-skip-link-min-block-size: 48px;
-$utrecht-skip-link-line-height: 150%;
-$utrecht-skip-link-font-size: 1.25rem;
-$utrecht-skip-link-font-family: Fira Sans, Arial, Verdana, sans-serif;
-$utrecht-skip-link-font-weight: 700;
 $utrecht-table-font-size: 1.25rem;
 $utrecht-table-container-box-inline-start-shadow-color: #0000001a;
 $utrecht-table-container-box-inline-start-shadow-spread: 0;

package/dist/index.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 19 Feb 2025 12:46:33 GMT
+ * Generated on Thu, 20 Feb 2025 09:00:19 GMT
  */
 
 .rhc-theme {
@@ -67,6 +67,34 @@
   --nl-paragraph-font-size: 1.25rem;
   --nl-paragraph-font-family: Fira Sans, Arial, Verdana, sans-serif;
   --nl-paragraph-color: #154273;
+  --nl-skip-link-text-underline-offset: 0.125rem;
+  --nl-skip-link-text-decoration: underline;
+  --nl-skip-link-box-block-end-shadow-color: #0000001a;
+  --nl-skip-link-box-block-end-shadow-spread-radius: 0;
+  --nl-skip-link-box-block-end-shadow-blur-radius: 48px;
+  --nl-skip-link-box-block-end-shadow-offset-y: 16px;
+  --nl-skip-link-box-block-end-shadow-offset-x: 0;
+  --nl-skip-link-border-width: 2px;
+  --nl-skip-link-color: #fff;
+  --nl-skip-link-border-color: transparent;
+  --nl-skip-link-background-color: #154273;
+  --nl-skip-link-focus-visible-outline-color: #000;
+  --nl-skip-link-focus-text-decoration: None;
+  --nl-skip-link-focus-color: #154273;
+  --nl-skip-link-focus-border-width: 2px;
+  --nl-skip-link-focus-border-style: solid;
+  --nl-skip-link-focus-border-color: #154273;
+  --nl-skip-link-focus-background-color: #fff;
+  --nl-skip-link-padding-inline-start: 1rem;
+  --nl-skip-link-padding-inline-end: 1rem;
+  --nl-skip-link-padding-block-start: 0.75rem;
+  --nl-skip-link-padding-block-end: 0.75rem;
+  --nl-skip-link-min-inline-size: 48px;
+  --nl-skip-link-min-block-size: 48px;
+  --nl-skip-link-line-height: 150%;
+  --nl-skip-link-font-size: 1.25rem;
+  --nl-skip-link-font-family: Fira Sans, Arial, Verdana, sans-serif;
+  --nl-skip-link-font-weight: 700;
   --utrecht-focus-inverse-outline-color: transparant;
   --utrecht-focus-outline-width: 2px;
   --utrecht-focus-outline-style: solid;
@@ -547,34 +575,6 @@
   --utrecht-separator-margin-block-end: 0.75rem;
   --utrecht-separator-block-size: 2px;
   --utrecht-separator-color: #CBD5E1;
-  --utrecht-skip-link-text-underline-offset: 0.125rem;
-  --utrecht-skip-link-text-decoration: underline;
-  --utrecht-skip-link-box-block-end-shadow-color: #0000001a;
-  --utrecht-skip-link-box-block-end-shadow-spread-radius: 0;
-  --utrecht-skip-link-box-block-end-shadow-blur-radius: 48px;
-  --utrecht-skip-link-box-block-end-shadow-offset-y: 16px;
-  --utrecht-skip-link-box-block-end-shadow-offset-x: 0;
-  --utrecht-skip-link-border-width: 2px;
-  --utrecht-skip-link-color: #fff;
-  --utrecht-skip-link-border-color: transparent;
-  --utrecht-skip-link-background-color: #154273;
-  --utrecht-skip-link-focus-visible-outline-color: #000;
-  --utrecht-skip-link-focus-text-decoration: None;
-  --utrecht-skip-link-focus-color: #154273;
-  --utrecht-skip-link-focus-border-width: 2px;
-  --utrecht-skip-link-focus-border-style: solid;
-  --utrecht-skip-link-focus-border-color: #154273;
-  --utrecht-skip-link-focus-background-color: #fff;
-  --utrecht-skip-link-padding-inline-start: 1rem;
-  --utrecht-skip-link-padding-inline-end: 1rem;
-  --utrecht-skip-link-padding-block-start: 0.75rem;
-  --utrecht-skip-link-padding-block-end: 0.75rem;
-  --utrecht-skip-link-min-inline-size: 48px;
-  --utrecht-skip-link-min-block-size: 48px;
-  --utrecht-skip-link-line-height: 150%;
-  --utrecht-skip-link-font-size: 1.25rem;
-  --utrecht-skip-link-font-family: Fira Sans, Arial, Verdana, sans-serif;
-  --utrecht-skip-link-font-weight: 700;
   --utrecht-table-font-size: 1.25rem;
   --utrecht-table-container-box-inline-start-shadow-color: #0000001a;
   --utrecht-table-container-box-inline-start-shadow-spread: 0;

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 19 Feb 2025 12:46:33 GMT
+ * Generated on Thu, 20 Feb 2025 09:00:19 GMT
  */
 
 export const rhcSubNavBarBackgroundColor : string;
@@ -631,34 +631,6 @@ export const utrechtTableContainerBoxInlineStartShadowBlur : string;
 export const utrechtTableContainerBoxInlineStartShadowSpread : number;
 export const utrechtTableContainerBoxInlineStartShadowColor : string;
 export const utrechtTableFontSize : string;
-export const utrechtSkipLinkFontWeight : number;
-export const utrechtSkipLinkFontFamily : string;
-export const utrechtSkipLinkFontSize : string;
-export const utrechtSkipLinkLineHeight : string;
-export const utrechtSkipLinkMinBlockSize : string;
-export const utrechtSkipLinkMinInlineSize : string;
-export const utrechtSkipLinkPaddingBlockEnd : string;
-export const utrechtSkipLinkPaddingBlockStart : string;
-export const utrechtSkipLinkPaddingInlineEnd : string;
-export const utrechtSkipLinkPaddingInlineStart : string;
-export const utrechtSkipLinkFocusBackgroundColor : string;
-export const utrechtSkipLinkFocusBorderColor : string;
-export const utrechtSkipLinkFocusBorderStyle : string;
-export const utrechtSkipLinkFocusBorderWidth : string;
-export const utrechtSkipLinkFocusColor : string;
-export const utrechtSkipLinkFocusTextDecoration : string;
-export const utrechtSkipLinkFocusVisibleOutlineColor : string;
-export const utrechtSkipLinkBackgroundColor : string;
-export const utrechtSkipLinkBorderColor : string;
-export const utrechtSkipLinkColor : string;
-export const utrechtSkipLinkBorderWidth : string;
-export const utrechtSkipLinkBoxBlockEndShadowOffsetX : number;
-export const utrechtSkipLinkBoxBlockEndShadowOffsetY : string;
-export const utrechtSkipLinkBoxBlockEndShadowBlurRadius : string;
-export const utrechtSkipLinkBoxBlockEndShadowSpreadRadius : number;
-export const utrechtSkipLinkBoxBlockEndShadowColor : string;
-export const utrechtSkipLinkTextDecoration : string;
-export const utrechtSkipLinkTextUnderlineOffset : string;
 export const utrechtSeparatorColor : string;
 export const utrechtSeparatorBlockSize : string;
 export const utrechtSeparatorMarginBlockEnd : string;
@@ -1139,6 +1111,34 @@ export const utrechtFocusOutlineOffset : string;
 export const utrechtFocusOutlineStyle : string;
 export const utrechtFocusOutlineWidth : string;
 export const utrechtFocusInverseOutlineColor : string;
+export const nlSkipLinkFontWeight : number;
+export const nlSkipLinkFontFamily : string;
+export const nlSkipLinkFontSize : string;
+export const nlSkipLinkLineHeight : string;
+export const nlSkipLinkMinBlockSize : string;
+export const nlSkipLinkMinInlineSize : string;
+export const nlSkipLinkPaddingBlockEnd : string;
+export const nlSkipLinkPaddingBlockStart : string;
+export const nlSkipLinkPaddingInlineEnd : string;
+export const nlSkipLinkPaddingInlineStart : string;
+export const nlSkipLinkFocusBackgroundColor : string;
+export const nlSkipLinkFocusBorderColor : string;
+export const nlSkipLinkFocusBorderStyle : string;
+export const nlSkipLinkFocusBorderWidth : string;
+export const nlSkipLinkFocusColor : string;
+export const nlSkipLinkFocusTextDecoration : string;
+export const nlSkipLinkFocusVisibleOutlineColor : string;
+export const nlSkipLinkBackgroundColor : string;
+export const nlSkipLinkBorderColor : string;
+export const nlSkipLinkColor : string;
+export const nlSkipLinkBorderWidth : string;
+export const nlSkipLinkBoxBlockEndShadowOffsetX : number;
+export const nlSkipLinkBoxBlockEndShadowOffsetY : string;
+export const nlSkipLinkBoxBlockEndShadowBlurRadius : string;
+export const nlSkipLinkBoxBlockEndShadowSpreadRadius : number;
+export const nlSkipLinkBoxBlockEndShadowColor : string;
+export const nlSkipLinkTextDecoration : string;
+export const nlSkipLinkTextUnderlineOffset : string;
 export const nlParagraphColor : string;
 export const nlParagraphFontFamily : string;
 export const nlParagraphFontSize : string;

package/dist/index.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 19 Feb 2025 12:46:33 GMT
+ * Generated on Thu, 20 Feb 2025 09:00:19 GMT
  */
 
 export const rhcSubNavBarBackgroundColor = "#f2f4f6";
@@ -631,34 +631,6 @@ export const utrechtTableContainerBoxInlineStartShadowBlur = "48px";
 export const utrechtTableContainerBoxInlineStartShadowSpread = 0;
 export const utrechtTableContainerBoxInlineStartShadowColor = "#0000001a";
 export const utrechtTableFontSize = "1.25rem";
-export const utrechtSkipLinkFontWeight = 700;
-export const utrechtSkipLinkFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
-export const utrechtSkipLinkFontSize = "1.25rem";
-export const utrechtSkipLinkLineHeight = "150%";
-export const utrechtSkipLinkMinBlockSize = "48px";
-export const utrechtSkipLinkMinInlineSize = "48px";
-export const utrechtSkipLinkPaddingBlockEnd = "0.75rem";
-export const utrechtSkipLinkPaddingBlockStart = "0.75rem";
-export const utrechtSkipLinkPaddingInlineEnd = "1rem";
-export const utrechtSkipLinkPaddingInlineStart = "1rem";
-export const utrechtSkipLinkFocusBackgroundColor = "#fff";
-export const utrechtSkipLinkFocusBorderColor = "#154273";
-export const utrechtSkipLinkFocusBorderStyle = "solid";
-export const utrechtSkipLinkFocusBorderWidth = "2px";
-export const utrechtSkipLinkFocusColor = "#154273";
-export const utrechtSkipLinkFocusTextDecoration = "None";
-export const utrechtSkipLinkFocusVisibleOutlineColor = "#000";
-export const utrechtSkipLinkBackgroundColor = "#154273";
-export const utrechtSkipLinkBorderColor = "transparent";
-export const utrechtSkipLinkColor = "#fff";
-export const utrechtSkipLinkBorderWidth = "2px";
-export const utrechtSkipLinkBoxBlockEndShadowOffsetX = 0;
-export const utrechtSkipLinkBoxBlockEndShadowOffsetY = "16px";
-export const utrechtSkipLinkBoxBlockEndShadowBlurRadius = "48px";
-export const utrechtSkipLinkBoxBlockEndShadowSpreadRadius = 0;
-export const utrechtSkipLinkBoxBlockEndShadowColor = "#0000001a";
-export const utrechtSkipLinkTextDecoration = "underline";
-export const utrechtSkipLinkTextUnderlineOffset = "0.125rem";
 export const utrechtSeparatorColor = "#CBD5E1";
 export const utrechtSeparatorBlockSize = "2px";
 export const utrechtSeparatorMarginBlockEnd = "0.75rem";
@@ -1139,6 +1111,34 @@ export const utrechtFocusOutlineOffset = "0.125rem";
 export const utrechtFocusOutlineStyle = "solid";
 export const utrechtFocusOutlineWidth = "2px";
 export const utrechtFocusInverseOutlineColor = "transparant";
+export const nlSkipLinkFontWeight = 700;
+export const nlSkipLinkFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
+export const nlSkipLinkFontSize = "1.25rem";
+export const nlSkipLinkLineHeight = "150%";
+export const nlSkipLinkMinBlockSize = "48px";
+export const nlSkipLinkMinInlineSize = "48px";
+export const nlSkipLinkPaddingBlockEnd = "0.75rem";
+export const nlSkipLinkPaddingBlockStart = "0.75rem";
+export const nlSkipLinkPaddingInlineEnd = "1rem";
+export const nlSkipLinkPaddingInlineStart = "1rem";
+export const nlSkipLinkFocusBackgroundColor = "#fff";
+export const nlSkipLinkFocusBorderColor = "#154273";
+export const nlSkipLinkFocusBorderStyle = "solid";
+export const nlSkipLinkFocusBorderWidth = "2px";
+export const nlSkipLinkFocusColor = "#154273";
+export const nlSkipLinkFocusTextDecoration = "None";
+export const nlSkipLinkFocusVisibleOutlineColor = "#000";
+export const nlSkipLinkBackgroundColor = "#154273";
+export const nlSkipLinkBorderColor = "transparent";
+export const nlSkipLinkColor = "#fff";
+export const nlSkipLinkBorderWidth = "2px";
+export const nlSkipLinkBoxBlockEndShadowOffsetX = 0;
+export const nlSkipLinkBoxBlockEndShadowOffsetY = "16px";
+export const nlSkipLinkBoxBlockEndShadowBlurRadius = "48px";
+export const nlSkipLinkBoxBlockEndShadowSpreadRadius = 0;
+export const nlSkipLinkBoxBlockEndShadowColor = "#0000001a";
+export const nlSkipLinkTextDecoration = "underline";
+export const nlSkipLinkTextUnderlineOffset = "0.125rem";
 export const nlParagraphColor = "#154273";
 export const nlParagraphFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
 export const nlParagraphFontSize = "1.25rem";

package/dist/index.json

@@ -627,34 +627,6 @@
   "utrechtTableContainerBoxInlineStartShadowSpread": 0,
   "utrechtTableContainerBoxInlineStartShadowColor": "#0000001a",
   "utrechtTableFontSize": "1.25rem",
-  "utrechtSkipLinkFontWeight": 700,
-  "utrechtSkipLinkFontFamily": "Fira Sans, Arial, Verdana, sans-serif",
-  "utrechtSkipLinkFontSize": "1.25rem",
-  "utrechtSkipLinkLineHeight": "150%",
-  "utrechtSkipLinkMinBlockSize": "48px",
-  "utrechtSkipLinkMinInlineSize": "48px",
-  "utrechtSkipLinkPaddingBlockEnd": "0.75rem",
-  "utrechtSkipLinkPaddingBlockStart": "0.75rem",
-  "utrechtSkipLinkPaddingInlineEnd": "1rem",
-  "utrechtSkipLinkPaddingInlineStart": "1rem",
-  "utrechtSkipLinkFocusBackgroundColor": "#fff",
-  "utrechtSkipLinkFocusBorderColor": "#154273",
-  "utrechtSkipLinkFocusBorderStyle": "solid",
-  "utrechtSkipLinkFocusBorderWidth": "2px",
-  "utrechtSkipLinkFocusColor": "#154273",
-  "utrechtSkipLinkFocusTextDecoration": "None",
-  "utrechtSkipLinkFocusVisibleOutlineColor": "#000",
-  "utrechtSkipLinkBackgroundColor": "#154273",
-  "utrechtSkipLinkBorderColor": "transparent",
-  "utrechtSkipLinkColor": "#fff",
-  "utrechtSkipLinkBorderWidth": "2px",
-  "utrechtSkipLinkBoxBlockEndShadowOffsetX": 0,
-  "utrechtSkipLinkBoxBlockEndShadowOffsetY": "16px",
-  "utrechtSkipLinkBoxBlockEndShadowBlurRadius": "48px",
-  "utrechtSkipLinkBoxBlockEndShadowSpreadRadius": 0,
-  "utrechtSkipLinkBoxBlockEndShadowColor": "#0000001a",
-  "utrechtSkipLinkTextDecoration": "underline",
-  "utrechtSkipLinkTextUnderlineOffset": "0.125rem",
   "utrechtSeparatorColor": "#CBD5E1",
   "utrechtSeparatorBlockSize": "2px",
   "utrechtSeparatorMarginBlockEnd": "0.75rem",
@@ -1135,6 +1107,34 @@
   "utrechtFocusOutlineStyle": "solid",
   "utrechtFocusOutlineWidth": "2px",
   "utrechtFocusInverseOutlineColor": "transparant",
+  "nlSkipLinkFontWeight": 700,
+  "nlSkipLinkFontFamily": "Fira Sans, Arial, Verdana, sans-serif",
+  "nlSkipLinkFontSize": "1.25rem",
+  "nlSkipLinkLineHeight": "150%",
+  "nlSkipLinkMinBlockSize": "48px",
+  "nlSkipLinkMinInlineSize": "48px",
+  "nlSkipLinkPaddingBlockEnd": "0.75rem",
+  "nlSkipLinkPaddingBlockStart": "0.75rem",
+  "nlSkipLinkPaddingInlineEnd": "1rem",
+  "nlSkipLinkPaddingInlineStart": "1rem",
+  "nlSkipLinkFocusBackgroundColor": "#fff",
+  "nlSkipLinkFocusBorderColor": "#154273",
+  "nlSkipLinkFocusBorderStyle": "solid",
+  "nlSkipLinkFocusBorderWidth": "2px",
+  "nlSkipLinkFocusColor": "#154273",
+  "nlSkipLinkFocusTextDecoration": "None",
+  "nlSkipLinkFocusVisibleOutlineColor": "#000",
+  "nlSkipLinkBackgroundColor": "#154273",
+  "nlSkipLinkBorderColor": "transparent",
+  "nlSkipLinkColor": "#fff",
+  "nlSkipLinkBorderWidth": "2px",
+  "nlSkipLinkBoxBlockEndShadowOffsetX": 0,
+  "nlSkipLinkBoxBlockEndShadowOffsetY": "16px",
+  "nlSkipLinkBoxBlockEndShadowBlurRadius": "48px",
+  "nlSkipLinkBoxBlockEndShadowSpreadRadius": 0,
+  "nlSkipLinkBoxBlockEndShadowColor": "#0000001a",
+  "nlSkipLinkTextDecoration": "underline",
+  "nlSkipLinkTextUnderlineOffset": "0.125rem",
   "nlParagraphColor": "#154273",
   "nlParagraphFontFamily": "Fira Sans, Arial, Verdana, sans-serif",
   "nlParagraphFontSize": "1.25rem",

package/dist/index.tokens.json

@@ -988,42 +988,6 @@
       },
       "font-size": "1.25rem"
     },
-    "skip-link": {
-      "font-weight": 700,
-      "font-family": "Fira Sans, Arial, Verdana, sans-serif",
-      "font-size": "1.25rem",
-      "line-height": "150%",
-      "min-block-size": "48px",
-      "min-inline-size": "48px",
-      "padding-block-end": "0.75rem",
-      "padding-block-start": "0.75rem",
-      "padding-inline-end": "1rem",
-      "padding-inline-start": "1rem",
-      "focus": {
-        "background-color": "#fff",
-        "border-color": "#154273",
-        "border-style": "solid",
-        "border-width": "2px",
-        "color": "#154273",
-        "text-decoration": "None"
-      },
-      "focus-visible": {
-        "outline-color": "#000"
-      },
-      "background-color": "#154273",
-      "border-color": "transparent",
-      "color": "#fff",
-      "border-width": "2px",
-      "box-block-end-shadow": {
-        "offset-x": 0,
-        "offset-y": "16px",
-        "blur-radius": "48px",
-        "spread-radius": 0,
-        "color": "#0000001a"
-      },
-      "text-decoration": "underline",
-      "text-underline-offset": "0.125rem"
-    },
     "separator": {
       "color": "#CBD5E1",
       "block-size": "2px",
@@ -1774,6 +1738,42 @@
     }
   },
   "nl": {
+    "skip-link": {
+      "font-weight": 700,
+      "font-family": "Fira Sans, Arial, Verdana, sans-serif",
+      "font-size": "1.25rem",
+      "line-height": "150%",
+      "min-block-size": "48px",
+      "min-inline-size": "48px",
+      "padding-block-end": "0.75rem",
+      "padding-block-start": "0.75rem",
+      "padding-inline-end": "1rem",
+      "padding-inline-start": "1rem",
+      "focus": {
+        "background-color": "#fff",
+        "border-color": "#154273",
+        "border-style": "solid",
+        "border-width": "2px",
+        "color": "#154273",
+        "text-decoration": "None"
+      },
+      "focus-visible": {
+        "outline-color": "#000"
+      },
+      "background-color": "#154273",
+      "border-color": "transparent",
+      "color": "#fff",
+      "border-width": "2px",
+      "box-block-end-shadow": {
+        "offset-x": 0,
+        "offset-y": "16px",
+        "blur-radius": "48px",
+        "spread-radius": 0,
+        "color": "#0000001a"
+      },
+      "text-decoration": "underline",
+      "text-underline-offset": "0.125rem"
+    },
     "paragraph": {
       "color": "#154273",
       "font-family": "Fira Sans, Arial, Verdana, sans-serif",

package/dist/root.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 19 Feb 2025 12:46:33 GMT
+ * Generated on Thu, 20 Feb 2025 09:00:19 GMT
  */
 
 :root {
@@ -67,6 +67,34 @@
   --nl-paragraph-font-size: 1.25rem;
   --nl-paragraph-font-family: Fira Sans, Arial, Verdana, sans-serif;
   --nl-paragraph-color: #154273;
+  --nl-skip-link-text-underline-offset: 0.125rem;
+  --nl-skip-link-text-decoration: underline;
+  --nl-skip-link-box-block-end-shadow-color: #0000001a;
+  --nl-skip-link-box-block-end-shadow-spread-radius: 0;
+  --nl-skip-link-box-block-end-shadow-blur-radius: 48px;
+  --nl-skip-link-box-block-end-shadow-offset-y: 16px;
+  --nl-skip-link-box-block-end-shadow-offset-x: 0;
+  --nl-skip-link-border-width: 2px;
+  --nl-skip-link-color: #fff;
+  --nl-skip-link-border-color: transparent;
+  --nl-skip-link-background-color: #154273;
+  --nl-skip-link-focus-visible-outline-color: #000;
+  --nl-skip-link-focus-text-decoration: None;
+  --nl-skip-link-focus-color: #154273;
+  --nl-skip-link-focus-border-width: 2px;
+  --nl-skip-link-focus-border-style: solid;
+  --nl-skip-link-focus-border-color: #154273;
+  --nl-skip-link-focus-background-color: #fff;
+  --nl-skip-link-padding-inline-start: 1rem;
+  --nl-skip-link-padding-inline-end: 1rem;
+  --nl-skip-link-padding-block-start: 0.75rem;
+  --nl-skip-link-padding-block-end: 0.75rem;
+  --nl-skip-link-min-inline-size: 48px;
+  --nl-skip-link-min-block-size: 48px;
+  --nl-skip-link-line-height: 150%;
+  --nl-skip-link-font-size: 1.25rem;
+  --nl-skip-link-font-family: Fira Sans, Arial, Verdana, sans-serif;
+  --nl-skip-link-font-weight: 700;
   --utrecht-focus-inverse-outline-color: transparant;
   --utrecht-focus-outline-width: 2px;
   --utrecht-focus-outline-style: solid;
@@ -547,34 +575,6 @@
   --utrecht-separator-margin-block-end: 0.75rem;
   --utrecht-separator-block-size: 2px;
   --utrecht-separator-color: #CBD5E1;
-  --utrecht-skip-link-text-underline-offset: 0.125rem;
-  --utrecht-skip-link-text-decoration: underline;
-  --utrecht-skip-link-box-block-end-shadow-color: #0000001a;
-  --utrecht-skip-link-box-block-end-shadow-spread-radius: 0;
-  --utrecht-skip-link-box-block-end-shadow-blur-radius: 48px;
-  --utrecht-skip-link-box-block-end-shadow-offset-y: 16px;
-  --utrecht-skip-link-box-block-end-shadow-offset-x: 0;
-  --utrecht-skip-link-border-width: 2px;
-  --utrecht-skip-link-color: #fff;
-  --utrecht-skip-link-border-color: transparent;
-  --utrecht-skip-link-background-color: #154273;
-  --utrecht-skip-link-focus-visible-outline-color: #000;
-  --utrecht-skip-link-focus-text-decoration: None;
-  --utrecht-skip-link-focus-color: #154273;
-  --utrecht-skip-link-focus-border-width: 2px;
-  --utrecht-skip-link-focus-border-style: solid;
-  --utrecht-skip-link-focus-border-color: #154273;
-  --utrecht-skip-link-focus-background-color: #fff;
-  --utrecht-skip-link-padding-inline-start: 1rem;
-  --utrecht-skip-link-padding-inline-end: 1rem;
-  --utrecht-skip-link-padding-block-start: 0.75rem;
-  --utrecht-skip-link-padding-block-end: 0.75rem;
-  --utrecht-skip-link-min-inline-size: 48px;
-  --utrecht-skip-link-min-block-size: 48px;
-  --utrecht-skip-link-line-height: 150%;
-  --utrecht-skip-link-font-size: 1.25rem;
-  --utrecht-skip-link-font-family: Fira Sans, Arial, Verdana, sans-serif;
-  --utrecht-skip-link-font-weight: 700;
   --utrecht-table-font-size: 1.25rem;
   --utrecht-table-container-box-inline-start-shadow-color: #0000001a;
   --utrecht-table-container-box-inline-start-shadow-spread: 0;

package/dist/tokens.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 19 Feb 2025 12:46:33 GMT
+ * Generated on Thu, 20 Feb 2025 09:00:19 GMT
  */
 
 export default tokens;
@@ -1011,42 +1011,6 @@ declare const tokens: {
       },
       "font-size": DesignToken
     },
-    "skip-link": {
-      "font-weight": DesignToken,
-      "font-family": DesignToken,
-      "font-size": DesignToken,
-      "line-height": DesignToken,
-      "min-block-size": DesignToken,
-      "min-inline-size": DesignToken,
-      "padding-block-end": DesignToken,
-      "padding-block-start": DesignToken,
-      "padding-inline-end": DesignToken,
-      "padding-inline-start": DesignToken,
-      "focus": {
-        "background-color": DesignToken,
-        "border-color": DesignToken,
-        "border-style": DesignToken,
-        "border-width": DesignToken,
-        "color": DesignToken,
-        "text-decoration": DesignToken
-      },
-      "focus-visible": {
-        "outline-color": DesignToken
-      },
-      "background-color": DesignToken,
-      "border-color": DesignToken,
-      "color": DesignToken,
-      "border-width": DesignToken,
-      "box-block-end-shadow": {
-        "offset-x": DesignToken,
-        "offset-y": DesignToken,
-        "blur-radius": DesignToken,
-        "spread-radius": DesignToken,
-        "color": DesignToken
-      },
-      "text-decoration": DesignToken,
-      "text-underline-offset": DesignToken
-    },
     "separator": {
       "color": DesignToken,
       "block-size": DesignToken,
@@ -1797,6 +1761,42 @@ declare const tokens: {
     }
   },
   "nl": {
+    "skip-link": {
+      "font-weight": DesignToken,
+      "font-family": DesignToken,
+      "font-size": DesignToken,
+      "line-height": DesignToken,
+      "min-block-size": DesignToken,
+      "min-inline-size": DesignToken,
+      "padding-block-end": DesignToken,
+      "padding-block-start": DesignToken,
+      "padding-inline-end": DesignToken,
+      "padding-inline-start": DesignToken,
+      "focus": {
+        "background-color": DesignToken,
+        "border-color": DesignToken,
+        "border-style": DesignToken,
+        "border-width": DesignToken,
+        "color": DesignToken,
+        "text-decoration": DesignToken
+      },
+      "focus-visible": {
+        "outline-color": DesignToken
+      },
+      "background-color": DesignToken,
+      "border-color": DesignToken,
+      "color": DesignToken,
+      "border-width": DesignToken,
+      "box-block-end-shadow": {
+        "offset-x": DesignToken,
+        "offset-y": DesignToken,
+        "blur-radius": DesignToken,
+        "spread-radius": DesignToken,
+        "color": DesignToken
+      },
+      "text-decoration": DesignToken,
+      "text-underline-offset": DesignToken
+    },
     "paragraph": {
       "color": DesignToken,
       "font-family": DesignToken,