@rijkshuisstijl-community/design-tokens 7.0.0 → 8.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (104) hide show
  1. package/CHANGELOG.md +72 -0
  2. package/dist/_variables.scss +10 -48
  3. package/dist/index.css +10 -48
  4. package/dist/index.d.ts +8 -46
  5. package/dist/index.js +10 -48
  6. package/dist/index.json +9 -47
  7. package/dist/index.tokens.json +14 -64
  8. package/dist/koop/_variables.scss +23 -61
  9. package/dist/koop/index.css +23 -61
  10. package/dist/koop/index.d.ts +21 -59
  11. package/dist/koop/index.js +23 -61
  12. package/dist/koop/index.json +22 -60
  13. package/dist/koop/index.tokens.json +47 -97
  14. package/dist/koop/root.css +23 -61
  15. package/dist/koop/tokens.d.ts +46 -96
  16. package/dist/koop/tokens.js +528 -1396
  17. package/dist/root.css +10 -48
  18. package/dist/tokens.d.ts +13 -63
  19. package/dist/tokens.js +200 -1068
  20. package/dist/uitvoerend-groen/_variables.scss +23 -61
  21. package/dist/uitvoerend-groen/index.css +23 -61
  22. package/dist/uitvoerend-groen/index.d.ts +21 -59
  23. package/dist/uitvoerend-groen/index.js +23 -61
  24. package/dist/uitvoerend-groen/index.json +22 -60
  25. package/dist/uitvoerend-groen/index.tokens.json +47 -97
  26. package/dist/uitvoerend-groen/root.css +23 -61
  27. package/dist/uitvoerend-groen/tokens.d.ts +46 -96
  28. package/dist/uitvoerend-groen/tokens.js +528 -1396
  29. package/dist/uitvoerend-hemelblauw/_variables.scss +23 -61
  30. package/dist/uitvoerend-hemelblauw/index.css +23 -61
  31. package/dist/uitvoerend-hemelblauw/index.d.ts +21 -59
  32. package/dist/uitvoerend-hemelblauw/index.js +23 -61
  33. package/dist/uitvoerend-hemelblauw/index.json +22 -60
  34. package/dist/uitvoerend-hemelblauw/index.tokens.json +47 -97
  35. package/dist/uitvoerend-hemelblauw/root.css +23 -61
  36. package/dist/uitvoerend-hemelblauw/tokens.d.ts +46 -96
  37. package/dist/uitvoerend-hemelblauw/tokens.js +528 -1396
  38. package/dist/uitvoerend-mintgroen/_variables.scss +23 -61
  39. package/dist/uitvoerend-mintgroen/index.css +23 -61
  40. package/dist/uitvoerend-mintgroen/index.d.ts +21 -59
  41. package/dist/uitvoerend-mintgroen/index.js +23 -61
  42. package/dist/uitvoerend-mintgroen/index.json +22 -60
  43. package/dist/uitvoerend-mintgroen/index.tokens.json +47 -97
  44. package/dist/uitvoerend-mintgroen/root.css +23 -61
  45. package/dist/uitvoerend-mintgroen/tokens.d.ts +46 -96
  46. package/dist/uitvoerend-mintgroen/tokens.js +528 -1396
  47. package/dist/uitvoerend-oranje/_variables.scss +23 -61
  48. package/dist/uitvoerend-oranje/index.css +23 -61
  49. package/dist/uitvoerend-oranje/index.d.ts +21 -59
  50. package/dist/uitvoerend-oranje/index.js +23 -61
  51. package/dist/uitvoerend-oranje/index.json +22 -60
  52. package/dist/uitvoerend-oranje/index.tokens.json +47 -97
  53. package/dist/uitvoerend-oranje/root.css +23 -61
  54. package/dist/uitvoerend-oranje/tokens.d.ts +46 -96
  55. package/dist/uitvoerend-oranje/tokens.js +528 -1396
  56. package/dist/uitvoerend-paars/_variables.scss +23 -61
  57. package/dist/uitvoerend-paars/index.css +23 -61
  58. package/dist/uitvoerend-paars/index.d.ts +21 -59
  59. package/dist/uitvoerend-paars/index.js +23 -61
  60. package/dist/uitvoerend-paars/index.json +22 -60
  61. package/dist/uitvoerend-paars/index.tokens.json +47 -97
  62. package/dist/uitvoerend-paars/root.css +23 -61
  63. package/dist/uitvoerend-paars/tokens.d.ts +46 -96
  64. package/dist/uitvoerend-paars/tokens.js +528 -1396
  65. package/dist/uitvoerend-violet/_variables.scss +23 -61
  66. package/dist/uitvoerend-violet/index.css +23 -61
  67. package/dist/uitvoerend-violet/index.d.ts +21 -59
  68. package/dist/uitvoerend-violet/index.js +23 -61
  69. package/dist/uitvoerend-violet/index.json +22 -60
  70. package/dist/uitvoerend-violet/index.tokens.json +47 -97
  71. package/dist/uitvoerend-violet/root.css +23 -61
  72. package/dist/uitvoerend-violet/tokens.d.ts +46 -96
  73. package/dist/uitvoerend-violet/tokens.js +528 -1396
  74. package/dist/uitvoerend-violet-oud/_variables.scss +23 -61
  75. package/dist/uitvoerend-violet-oud/index.css +23 -61
  76. package/dist/uitvoerend-violet-oud/index.d.ts +21 -59
  77. package/dist/uitvoerend-violet-oud/index.js +23 -61
  78. package/dist/uitvoerend-violet-oud/index.json +22 -60
  79. package/dist/uitvoerend-violet-oud/index.tokens.json +47 -97
  80. package/dist/uitvoerend-violet-oud/root.css +23 -61
  81. package/dist/uitvoerend-violet-oud/tokens.d.ts +46 -96
  82. package/dist/uitvoerend-violet-oud/tokens.js +528 -1396
  83. package/dist/wetgevend/_variables.scss +23 -61
  84. package/dist/wetgevend/index.css +23 -61
  85. package/dist/wetgevend/index.d.ts +21 -59
  86. package/dist/wetgevend/index.js +23 -61
  87. package/dist/wetgevend/index.json +22 -60
  88. package/dist/wetgevend/index.tokens.json +47 -97
  89. package/dist/wetgevend/root.css +23 -61
  90. package/dist/wetgevend/tokens.d.ts +46 -96
  91. package/dist/wetgevend/tokens.js +528 -1396
  92. package/figma/figma.tokens.json +51 -270
  93. package/package.json +1 -1
  94. package/src/generated/base.tokens.json +35 -199
  95. package/src/generated/koop/tokens.json +105 -269
  96. package/src/generated/themes.json +945 -2421
  97. package/src/generated/uitvoerend-groen/tokens.json +105 -269
  98. package/src/generated/uitvoerend-hemelblauw/tokens.json +105 -269
  99. package/src/generated/uitvoerend-mintgroen/tokens.json +105 -269
  100. package/src/generated/uitvoerend-oranje/tokens.json +105 -269
  101. package/src/generated/uitvoerend-paars/tokens.json +105 -269
  102. package/src/generated/uitvoerend-violet/tokens.json +105 -269
  103. package/src/generated/uitvoerend-violet-oud/tokens.json +105 -269
  104. package/src/generated/wetgevend/tokens.json +105 -269
package/dist/index.json CHANGED
@@ -114,6 +114,7 @@
114
114
  "rhcNavBarLinkPaddingInlineEnd": "0.75rem",
115
115
  "rhcNavBarLinkPaddingInlineStart": "0.75rem",
116
116
  "rhcNavBarLinkColumnGap": "0.5rem",
117
+ "rhcNavBarLinkFontSize": "1.25rem",
117
118
  "rhcNavBarHeadingFontWeight": 700,
118
119
  "rhcNavBarBackgroundColor": "#fff",
119
120
  "rhcNavBarColor": "#154273",
@@ -350,7 +351,11 @@
350
351
  "rhcCardAsLinkHorizontalPaddingInlineStart": "1rem",
351
352
  "rhcCardAsLinkHorizontalHeadingInlineSize": "200px",
352
353
  "rhcBreadcrumbNavLinkCurrentColor": "#334155",
353
- "rhcKeepComment": "⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset components/blockquote.",
354
+ "rhcBlockquoteMarginBlockEnd": "0rem",
355
+ "rhcBlockquoteMarginBlockStart": "0rem",
356
+ "rhcBlockquoteMarginInlineEnd": "0rem",
357
+ "rhcBlockquoteMarginInlineStart": "0rem",
358
+ "rhcKeepComment": "⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset common/rounded-corner.",
354
359
  "rhcKeepTopLeftBorderRadiusTopLeft": "48px",
355
360
  "rhcKeepTopLeftBorderRadiusTopRight": 0,
356
361
  "rhcKeepTopLeftBorderRadiusBottomRight": 0,
@@ -381,7 +386,6 @@
381
386
  "rhcColorForegroundLink": "#01689b",
382
387
  "rhcColorForegroundOnDarkColor": "#fff",
383
388
  "rhcColorForegroundOnLightColor": "#000",
384
- "rhcColorBackdrop": "#0000004d",
385
389
  "rhcColorBorderDefault": "#64748B",
386
390
  "rhcColorBorderSubdued": "#94A3B8",
387
391
  "rhcColorBorderStrong": "#0F172A",
@@ -523,7 +527,6 @@
523
527
  "rhcColorLintblauw500": "#154273",
524
528
  "rhcColorWit": "#fff",
525
529
  "rhcColorZwart": "#000",
526
- "rhcColorTransparent30": "#0000004d",
527
530
  "rhcColorNone": "transparent",
528
531
  "rhcFocusOutlineOffset": "0.125rem",
529
532
  "rhcFocusOutlineStyle": "solid",
@@ -567,7 +570,7 @@
567
570
  "rhcSizeHalfLint": "24px",
568
571
  "rhcSizeLint": "48px",
569
572
  "rhcSize2Lint": "96px",
570
- "rhcSize3Lint": "1440px",
573
+ "rhcSize3Lint": "144px",
571
574
  "rhcFontFamilyPrimary": "'Fira Sans', Arial, Verdana, sans-serif",
572
575
  "rhcFontFamilySecondary": "RijksoverheidSerifWeb, 'Times New Roman', serif",
573
576
  "rhcBorderWidthDefault": "1px",
@@ -866,8 +869,6 @@
866
869
  "utrechtFormLabelRadioFontWeight": 400,
867
870
  "utrechtFormLabelCheckedFontWeight": 400,
868
871
  "utrechtFormLabelDisabledColor": "#94A3B8",
869
- "utrechtFormFieldErrorMessageIconMarginInlineEnd": "0.5rem",
870
- "utrechtFormFieldErrorMessageIconSize": "24px",
871
872
  "utrechtFormFieldErrorMessageBackgroundColor": "transparent",
872
873
  "utrechtFormFieldErrorMessageColor": "#d52b1e",
873
874
  "utrechtFormFieldErrorMessageFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
@@ -880,7 +881,6 @@
880
881
  "utrechtFormFieldErrorMessagePaddingBlockStart": "0rem",
881
882
  "utrechtFormFieldErrorMessagePaddingInlineEnd": "0rem",
882
883
  "utrechtFormFieldErrorMessagePaddingInlineStart": "0rem",
883
- "utrechtFormFieldDescriptionPaddingBlockEnd": "0.5rem",
884
884
  "utrechtFormFieldDescriptionColor": "#334155",
885
885
  "utrechtFormFieldDescriptionFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
886
886
  "utrechtFormFieldDescriptionFontSize": "1.25rem",
@@ -1116,46 +1116,6 @@
1116
1116
  "utrechtBreadcrumbNavLinkHoverTextDecoration": "underline",
1117
1117
  "utrechtBreadcrumbNavLinkHoverColor": "#01496c",
1118
1118
  "utrechtBreadcrumbNavLinkIconSize": "24px",
1119
- "utrechtBlockquoteBorderBlockEndWidth": 0,
1120
- "utrechtBlockquoteBorderBlockStartWidth": 0,
1121
- "utrechtBlockquoteBorderEndEndRadius": 0,
1122
- "utrechtBlockquoteBorderEndStartRadius": 0,
1123
- "utrechtBlockquoteBorderInlineEndWidth": 0,
1124
- "utrechtBlockquoteBorderStartEndRadius": 0,
1125
- "utrechtBlockquoteBorderStartStartRadius": 0,
1126
- "utrechtBlockquoteMarginBlockEnd": 0,
1127
- "utrechtBlockquoteMarginBlockStart": 0,
1128
- "utrechtBlockquoteMarginInlineEnd": 0,
1129
- "utrechtBlockquoteMarginInlineStart": 0,
1130
- "utrechtBlockquoteBlueCornerBorderVariationBorderBlockEndWidth": "2px",
1131
- "utrechtBlockquoteBlueCornerBorderVariationBorderColor": "#154273",
1132
- "utrechtBlockquoteBlueCornerBorderVariationBorderEndEndRadius": "3rem",
1133
- "utrechtBlockquoteBlueCornerBorderVariationBorderInlineEndWidth": "2px",
1134
- "utrechtBlockquoteCaptionColor": "#154273",
1135
- "utrechtBlockquoteCaptionFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
1136
- "utrechtBlockquoteCaptionFontSize": "1.25rem",
1137
- "utrechtBlockquoteCaptionFontWeight": 400,
1138
- "utrechtBlockquoteCaptionLineHeight": "150%",
1139
- "utrechtBlockquoteCaptionPaddingBlockStart": "0.75rem",
1140
- "utrechtBlockquoteContentFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
1141
- "utrechtBlockquoteContentFontWeight": 400,
1142
- "utrechtBlockquoteContentLineHeight": "150%",
1143
- "utrechtBlockquoteContentColor": "#154273",
1144
- "utrechtBlockquoteContentFontSize": "1.25rem",
1145
- "utrechtBlockquotePinkBackgroundVariationBackgroundColor": "#F6BDE1",
1146
- "utrechtBlockquotePinkBackgroundVariationBorderEndStartRadius": "3rem",
1147
- "utrechtBlockquotePinkBackgroundVariationPadding": "2.5rem",
1148
- "utrechtBlockquotePinkCornerBorderVariationBorderBlockStartWidth": "0.25rem",
1149
- "utrechtBlockquotePinkCornerBorderVariationBorderColor": "#F6BDE1",
1150
- "utrechtBlockquotePinkCornerBorderVariationBorderInlineStartWidth": "0.25rem",
1151
- "utrechtBlockquotePinkCornerBorderVariationBorderStartStartRadius": "3rem",
1152
- "utrechtBlockquotePinkCornerBorderVariationPadding": "2.5rem",
1153
- "utrechtBlockquotePinkLeftBorderVariationBorderColor": "#F6BDE1",
1154
- "utrechtBlockquotePinkLeftBorderVariationBorderInlineStartWidth": "0.75rem",
1155
- "utrechtBlockquotePinkLeftBorderVariationPaddingBlockEnd": "1.5rem",
1156
- "utrechtBlockquotePinkLeftBorderVariationPaddingBlockStart": "1.5rem",
1157
- "utrechtBlockquotePinkLeftBorderVariationPaddingInlineEnd": "2.5rem",
1158
- "utrechtBlockquotePinkLeftBorderVariationPaddingInlineStart": "2.5rem",
1159
1119
  "utrechtBlockquoteBackgroundColor": "transparent",
1160
1120
  "utrechtBlockquoteBorderInlineStartWidth": "0px",
1161
1121
  "utrechtBlockquoteBorderColor": "transparent",
@@ -1171,6 +1131,8 @@
1171
1131
  "utrechtBlockquoteRowGap": "0.75rem",
1172
1132
  "utrechtBlockquoteAttributionColor": "#154273",
1173
1133
  "utrechtBlockquoteAttributionFontSize": "1.25rem",
1134
+ "utrechtBlockquoteContentColor": "#154273",
1135
+ "utrechtBlockquoteContentFontSize": "1.25rem",
1174
1136
  "utrechtBackdropBackgroundColor": "#0000004d",
1175
1137
  "utrechtBackdropColor": "#0F172A",
1176
1138
  "utrechtBackdropOpacity": 0.8,
@@ -202,7 +202,8 @@
202
202
  "padding-block-start": "1rem",
203
203
  "padding-inline-end": "0.75rem",
204
204
  "padding-inline-start": "0.75rem",
205
- "column-gap": "0.5rem"
205
+ "column-gap": "0.5rem",
206
+ "font-size": "1.25rem"
206
207
  },
207
208
  "heading": {
208
209
  "font-weight": 700
@@ -599,8 +600,14 @@
599
600
  }
600
601
  }
601
602
  },
603
+ "blockquote": {
604
+ "margin-block-end": "0rem",
605
+ "margin-block-start": "0rem",
606
+ "margin-inline-end": "0rem",
607
+ "margin-inline-start": "0rem"
608
+ },
602
609
  "keep": {
603
- "_comment": "⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset components/blockquote.",
610
+ "_comment": "⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset common/rounded-corner.",
604
611
  "top-left": {
605
612
  "borderRadiusTopLeft": "48px",
606
613
  "borderRadiusTopRight": 0,
@@ -655,7 +662,6 @@
655
662
  "on-dark-color": "#fff",
656
663
  "on-light-color": "#000"
657
664
  },
658
- "backdrop": "#0000004d",
659
665
  "border": {
660
666
  "default": "#64748B",
661
667
  "subdued": "#94A3B8",
@@ -853,9 +859,6 @@
853
859
  },
854
860
  "wit": "#fff",
855
861
  "zwart": "#000",
856
- "transparent": {
857
- "30": "#0000004d"
858
- },
859
862
  "none": "transparent"
860
863
  },
861
864
  "focus": {
@@ -925,7 +928,7 @@
925
928
  "half-lint": "24px",
926
929
  "lint": "48px",
927
930
  "2-lint": "96px",
928
- "3-lint": "1440px"
931
+ "3-lint": "144px"
929
932
  },
930
933
  "font-family": {
931
934
  "primary": "'Fira Sans', Arial, Verdana, sans-serif",
@@ -1374,10 +1377,6 @@
1374
1377
  }
1375
1378
  },
1376
1379
  "form-field-error-message": {
1377
- "icon": {
1378
- "margin-inline-end": "0.5rem",
1379
- "size": "24px"
1380
- },
1381
1380
  "background-color": "transparent",
1382
1381
  "color": "#d52b1e",
1383
1382
  "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
@@ -1392,7 +1391,6 @@
1392
1391
  "padding-inline-start": "0rem"
1393
1392
  },
1394
1393
  "form-field-description": {
1395
- "padding-block-end": "0.5rem",
1396
1394
  "color": "#334155",
1397
1395
  "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1398
1396
  "font-size": "1.25rem",
@@ -1770,58 +1768,6 @@
1770
1768
  }
1771
1769
  },
1772
1770
  "blockquote": {
1773
- "border-block-end-width": 0,
1774
- "border-block-start-width": 0,
1775
- "border-end-end-radius": 0,
1776
- "border-end-start-radius": 0,
1777
- "border-inline-end-width": 0,
1778
- "border-start-end-radius": 0,
1779
- "border-start-start-radius": 0,
1780
- "margin-block-end": 0,
1781
- "margin-block-start": 0,
1782
- "margin-inline-end": 0,
1783
- "margin-inline-start": 0,
1784
- "blue-corner-border-variation": {
1785
- "border-block-end-width": "2px",
1786
- "border-color": "#154273",
1787
- "border-end-end-radius": "3rem",
1788
- "border-inline-end-width": "2px"
1789
- },
1790
- "caption": {
1791
- "color": "#154273",
1792
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1793
- "font-size": "1.25rem",
1794
- "font-weight": 400,
1795
- "line-height": "150%",
1796
- "padding-block-start": "0.75rem"
1797
- },
1798
- "content": {
1799
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
1800
- "font-weight": 400,
1801
- "line-height": "150%",
1802
- "color": "#154273",
1803
- "font-size": "1.25rem"
1804
- },
1805
- "pink-background-variation": {
1806
- "background-color": "#F6BDE1",
1807
- "border-end-start-radius": "3rem",
1808
- "padding": "2.5rem"
1809
- },
1810
- "pink-corner-border-variation": {
1811
- "border-block-start-width": "0.25rem",
1812
- "border-color": "#F6BDE1",
1813
- "border-inline-start-width": "0.25rem",
1814
- "border-start-start-radius": "3rem",
1815
- "padding": "2.5rem"
1816
- },
1817
- "pink-left-border-variation": {
1818
- "border-color": "#F6BDE1",
1819
- "border-inline-start-width": "0.75rem",
1820
- "padding-block-end": "1.5rem",
1821
- "padding-block-start": "1.5rem",
1822
- "padding-inline-end": "2.5rem",
1823
- "padding-inline-start": "2.5rem"
1824
- },
1825
1771
  "background-color": "transparent",
1826
1772
  "border-inline-start-width": "0px",
1827
1773
  "border-color": "transparent",
@@ -1838,6 +1784,10 @@
1838
1784
  "attribution": {
1839
1785
  "color": "#154273",
1840
1786
  "font-size": "1.25rem"
1787
+ },
1788
+ "content": {
1789
+ "color": "#154273",
1790
+ "font-size": "1.25rem"
1841
1791
  }
1842
1792
  },
1843
1793
  "backdrop": {
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 09 Sep 2025 07:01:24 GMT
3
+ // Generated on Fri, 26 Sep 2025 23:36:53 GMT
4
4
 
5
5
  $figma-link-icon-size: 1.25rem;
6
6
  $rhc-space-700: 3.5rem;
@@ -17,7 +17,7 @@ $rhc-space-0: 0rem;
17
17
  $rhc-border-width-none: 0px;
18
18
  $rhc-border-width-m: 2px;
19
19
  $rhc-border-width-default: 1px;
20
- $rhc-size-3-lint: 1440px;
20
+ $rhc-size-3-lint: 144px;
21
21
  $rhc-size-2-lint: 96px;
22
22
  $rhc-size-lint: 48px;
23
23
  $rhc-size-half-lint: 24px;
@@ -61,7 +61,6 @@ $rhc-focus-outline-width: 2px;
61
61
  $rhc-focus-outline-style: solid;
62
62
  $rhc-focus-outline-offset: 0.125rem;
63
63
  $rhc-color-none: transparent;
64
- $rhc-color-transparent-30: #0000004d;
65
64
  $rhc-color-zwart: #000;
66
65
  $rhc-color-wit: #fff;
67
66
  $rhc-color-lintblauw-500: #154273;
@@ -203,7 +202,6 @@ $rhc-color-canvas: #fff;
203
202
  $rhc-color-border-strong: #0F172A;
204
203
  $rhc-color-border-subdued: #94A3B8;
205
204
  $rhc-color-border-default: #64748B;
206
- $rhc-color-backdrop: #0000004d;
207
205
  $rhc-color-foreground-on-light-color: #000;
208
206
  $rhc-color-foreground-on-dark-color: #fff;
209
207
  $rhc-color-foreground-link: #01689b;
@@ -485,6 +483,7 @@ $rhc-nav-bar-border-block-end-width: 1px;
485
483
  $rhc-nav-bar-border-color: #154273;
486
484
  $rhc-nav-bar-color: #154273;
487
485
  $rhc-nav-bar-background-color: #fff;
486
+ $rhc-nav-bar-link-font-size: 1.25rem;
488
487
  $rhc-nav-bar-link-column-gap: 0.5rem;
489
488
  $rhc-nav-bar-link-padding-inline-start: 0.75rem;
490
489
  $rhc-nav-bar-link-padding-inline-end: 0.75rem;
@@ -508,10 +507,6 @@ $rhc-rounded-corner-border-width: 2px;
508
507
  $rhc-rounded-corner-xl-border-radius: 96px;
509
508
  $rhc-rounded-corner-md-border-radius: 48px;
510
509
  $rhc-rounded-corner-xs-border-radius: 24px;
511
- $rhc-breadcrumb-nav-link-current-color: #334155;
512
- $rhc-data-badge-button-hover-color: #fff;
513
- $rhc-data-badge-button-hover-background-color: #154273;
514
- $rhc-data-badge-button-column-gap: 0.125rem;
515
510
  $rhc-keep-bottom-left-border-radius-bottom-left: 48px;
516
511
  $rhc-keep-bottom-left-border-radius-bottom-right: 0;
517
512
  $rhc-keep-bottom-left-border-radius-top-right: 0;
@@ -528,7 +523,15 @@ $rhc-keep-top-left-border-radius-bottom-left: 0;
528
523
  $rhc-keep-top-left-border-radius-bottom-right: 0;
529
524
  $rhc-keep-top-left-border-radius-top-right: 0;
530
525
  $rhc-keep-top-left-border-radius-top-left: 48px;
531
- $rhc-keep-comment: ⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset components/blockquote.;
526
+ $rhc-keep-comment: ⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset common/rounded-corner.;
527
+ $rhc-breadcrumb-nav-link-current-color: #334155;
528
+ $rhc-data-badge-button-hover-color: #fff;
529
+ $rhc-data-badge-button-hover-background-color: #154273;
530
+ $rhc-data-badge-button-column-gap: 0.125rem;
531
+ $rhc-blockquote-margin-inline-start: 0rem;
532
+ $rhc-blockquote-margin-inline-end: 0rem;
533
+ $rhc-blockquote-margin-block-start: 0rem;
534
+ $rhc-blockquote-margin-block-end: 0rem;
532
535
  $nl-heading-level-6-margin-block-start: 0rem;
533
536
  $nl-heading-level-6-margin-block-end: 0rem;
534
537
  $nl-heading-level-6-line-height: 150%;
@@ -1030,6 +1033,8 @@ $utrecht-alert-border-width: 0px;
1030
1033
  $utrecht-alert-border-radius: 5px;
1031
1034
  $utrecht-alert-border-color: transparent;
1032
1035
  $utrecht-alert-background-color: #d9ebf7;
1036
+ $utrecht-blockquote-content-font-size: 1.25rem;
1037
+ $utrecht-blockquote-content-color: #154273;
1033
1038
  $utrecht-blockquote-attribution-font-size: 1.25rem;
1034
1039
  $utrecht-blockquote-attribution-color: #154273;
1035
1040
  $utrecht-blockquote-row-gap: 0.75rem;
@@ -1045,46 +1050,6 @@ $utrecht-blockquote-border-radius: 0px;
1045
1050
  $utrecht-blockquote-border-color: transparent;
1046
1051
  $utrecht-blockquote-border-inline-start-width: 0px;
1047
1052
  $utrecht-blockquote-background-color: transparent;
1048
- $utrecht-blockquote-pink-left-border-variation-padding-inline-start: 2.5rem;
1049
- $utrecht-blockquote-pink-left-border-variation-padding-inline-end: 2.5rem;
1050
- $utrecht-blockquote-pink-left-border-variation-padding-block-start: 1.5rem;
1051
- $utrecht-blockquote-pink-left-border-variation-padding-block-end: 1.5rem;
1052
- $utrecht-blockquote-pink-left-border-variation-border-inline-start-width: 0.75rem;
1053
- $utrecht-blockquote-pink-left-border-variation-border-color: #F6BDE1;
1054
- $utrecht-blockquote-pink-corner-border-variation-padding: 2.5rem;
1055
- $utrecht-blockquote-pink-corner-border-variation-border-start-start-radius: 3rem;
1056
- $utrecht-blockquote-pink-corner-border-variation-border-inline-start-width: 0.25rem;
1057
- $utrecht-blockquote-pink-corner-border-variation-border-color: #F6BDE1;
1058
- $utrecht-blockquote-pink-corner-border-variation-border-block-start-width: 0.25rem;
1059
- $utrecht-blockquote-pink-background-variation-padding: 2.5rem;
1060
- $utrecht-blockquote-pink-background-variation-border-end-start-radius: 3rem;
1061
- $utrecht-blockquote-pink-background-variation-background-color: #F6BDE1;
1062
- $utrecht-blockquote-content-font-size: 1.25rem;
1063
- $utrecht-blockquote-content-color: #154273;
1064
- $utrecht-blockquote-content-line-height: 150%;
1065
- $utrecht-blockquote-content-font-weight: 400;
1066
- $utrecht-blockquote-content-font-family: RijksSans, Arial, Verdana, sans-serif;
1067
- $utrecht-blockquote-caption-padding-block-start: 0.75rem;
1068
- $utrecht-blockquote-caption-line-height: 150%;
1069
- $utrecht-blockquote-caption-font-weight: 400;
1070
- $utrecht-blockquote-caption-font-size: 1.25rem;
1071
- $utrecht-blockquote-caption-font-family: RijksSans, Arial, Verdana, sans-serif;
1072
- $utrecht-blockquote-caption-color: #154273;
1073
- $utrecht-blockquote-blue-corner-border-variation-border-inline-end-width: 2px;
1074
- $utrecht-blockquote-blue-corner-border-variation-border-end-end-radius: 3rem;
1075
- $utrecht-blockquote-blue-corner-border-variation-border-color: #154273;
1076
- $utrecht-blockquote-blue-corner-border-variation-border-block-end-width: 2px;
1077
- $utrecht-blockquote-margin-inline-start: 0;
1078
- $utrecht-blockquote-margin-inline-end: 0;
1079
- $utrecht-blockquote-margin-block-start: 0;
1080
- $utrecht-blockquote-margin-block-end: 0;
1081
- $utrecht-blockquote-border-start-start-radius: 0;
1082
- $utrecht-blockquote-border-start-end-radius: 0;
1083
- $utrecht-blockquote-border-inline-end-width: 0;
1084
- $utrecht-blockquote-border-end-start-radius: 0;
1085
- $utrecht-blockquote-border-end-end-radius: 0;
1086
- $utrecht-blockquote-border-block-start-width: 0;
1087
- $utrecht-blockquote-border-block-end-width: 0;
1088
1053
  $utrecht-number-badge-padding-inline: 0.5rem;
1089
1054
  $utrecht-number-badge-padding-block: 0.125rem;
1090
1055
  $utrecht-number-badge-min-inline-size: 24px;
@@ -1109,22 +1074,12 @@ $utrecht-figure-caption-padding-block-start: 0.5rem;
1109
1074
  $utrecht-figure-caption-padding-block-end: 0.5rem;
1110
1075
  $utrecht-figure-caption-border-width: 4px;
1111
1076
  $utrecht-figure-caption-border-color: #CBD5E1;
1112
- $utrecht-form-label-disabled-color: #94A3B8;
1113
- $utrecht-form-label-checked-font-weight: 400;
1114
- $utrecht-form-label-radio-font-weight: 400;
1115
- $utrecht-form-label-radio-color: #0F172A;
1116
- $utrecht-form-label-checkbox-font-weight: 400;
1117
- $utrecht-form-label-checkbox-color: #0F172A;
1118
- $utrecht-form-label-font-weight: 700;
1119
- $utrecht-form-label-font-size: 1.25rem;
1120
- $utrecht-form-label-color: #0F172A;
1121
1077
  $utrecht-form-field-description-margin-block-start: -0.5rem;
1122
1078
  $utrecht-form-field-description-margin-block-end: 0.5rem;
1123
1079
  $utrecht-form-field-description-line-height: 150%;
1124
1080
  $utrecht-form-field-description-font-size: 1.25rem;
1125
1081
  $utrecht-form-field-description-font-family: RijksSans, Arial, Verdana, sans-serif;
1126
1082
  $utrecht-form-field-description-color: #334155;
1127
- $utrecht-form-field-description-padding-block-end: 0.5rem;
1128
1083
  $utrecht-form-field-error-message-padding-inline-start: 0rem;
1129
1084
  $utrecht-form-field-error-message-padding-inline-end: 0rem;
1130
1085
  $utrecht-form-field-error-message-padding-block-start: 0rem;
@@ -1137,8 +1092,15 @@ $utrecht-form-field-error-message-font-size: 1.25rem;
1137
1092
  $utrecht-form-field-error-message-font-family: RijksSans, Arial, Verdana, sans-serif;
1138
1093
  $utrecht-form-field-error-message-color: #d52b1e;
1139
1094
  $utrecht-form-field-error-message-background-color: transparent;
1140
- $utrecht-form-field-error-message-icon-size: 24px;
1141
- $utrecht-form-field-error-message-icon-margin-inline-end: 0.5rem;
1095
+ $utrecht-form-label-disabled-color: #94A3B8;
1096
+ $utrecht-form-label-checked-font-weight: 400;
1097
+ $utrecht-form-label-radio-font-weight: 400;
1098
+ $utrecht-form-label-radio-color: #0F172A;
1099
+ $utrecht-form-label-checkbox-font-weight: 400;
1100
+ $utrecht-form-label-checkbox-color: #0F172A;
1101
+ $utrecht-form-label-font-weight: 700;
1102
+ $utrecht-form-label-font-size: 1.25rem;
1103
+ $utrecht-form-label-color: #0F172A;
1142
1104
  $utrecht-textarea-disabled-color: #475569;
1143
1105
  $utrecht-textarea-disabled-border-color: #94A3B8;
1144
1106
  $utrecht-textarea-disabled-background-color: #CBD5E1;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 09 Sep 2025 07:01:24 GMT
3
+ * Generated on Fri, 26 Sep 2025 23:36:53 GMT
4
4
  */
5
5
 
6
6
  .koop {
@@ -19,7 +19,7 @@
19
19
  --rhc-border-width-none: 0px;
20
20
  --rhc-border-width-m: 2px;
21
21
  --rhc-border-width-default: 1px;
22
- --rhc-size-3-lint: 1440px;
22
+ --rhc-size-3-lint: 144px;
23
23
  --rhc-size-2-lint: 96px;
24
24
  --rhc-size-lint: 48px;
25
25
  --rhc-size-half-lint: 24px;
@@ -63,7 +63,6 @@
63
63
  --rhc-focus-outline-style: solid;
64
64
  --rhc-focus-outline-offset: 0.125rem;
65
65
  --rhc-color-none: transparent;
66
- --rhc-color-transparent-30: #0000004d;
67
66
  --rhc-color-zwart: #000;
68
67
  --rhc-color-wit: #fff;
69
68
  --rhc-color-lintblauw-500: #154273;
@@ -205,7 +204,6 @@
205
204
  --rhc-color-border-strong: #0F172A;
206
205
  --rhc-color-border-subdued: #94A3B8;
207
206
  --rhc-color-border-default: #64748B;
208
- --rhc-color-backdrop: #0000004d;
209
207
  --rhc-color-foreground-on-light-color: #000;
210
208
  --rhc-color-foreground-on-dark-color: #fff;
211
209
  --rhc-color-foreground-link: #01689b;
@@ -487,6 +485,7 @@
487
485
  --rhc-nav-bar-border-color: #154273;
488
486
  --rhc-nav-bar-color: #154273;
489
487
  --rhc-nav-bar-background-color: #fff;
488
+ --rhc-nav-bar-link-font-size: 1.25rem;
490
489
  --rhc-nav-bar-link-column-gap: 0.5rem;
491
490
  --rhc-nav-bar-link-padding-inline-start: 0.75rem;
492
491
  --rhc-nav-bar-link-padding-inline-end: 0.75rem;
@@ -510,10 +509,6 @@
510
509
  --rhc-rounded-corner-xl-border-radius: 96px;
511
510
  --rhc-rounded-corner-md-border-radius: 48px;
512
511
  --rhc-rounded-corner-xs-border-radius: 24px;
513
- --rhc-breadcrumb-nav-link-current-color: #334155;
514
- --rhc-data-badge-button-hover-color: #fff;
515
- --rhc-data-badge-button-hover-background-color: #154273;
516
- --rhc-data-badge-button-column-gap: 0.125rem;
517
512
  --rhc-keep-bottom-left-border-radius-bottom-left: 48px;
518
513
  --rhc-keep-bottom-left-border-radius-bottom-right: 0;
519
514
  --rhc-keep-bottom-left-border-radius-top-right: 0;
@@ -530,7 +525,15 @@
530
525
  --rhc-keep-top-left-border-radius-bottom-right: 0;
531
526
  --rhc-keep-top-left-border-radius-top-right: 0;
532
527
  --rhc-keep-top-left-border-radius-top-left: 48px;
533
- --rhc-keep-comment: ⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset components/blockquote.;
528
+ --rhc-keep-comment: ⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset common/rounded-corner.;
529
+ --rhc-breadcrumb-nav-link-current-color: #334155;
530
+ --rhc-data-badge-button-hover-color: #fff;
531
+ --rhc-data-badge-button-hover-background-color: #154273;
532
+ --rhc-data-badge-button-column-gap: 0.125rem;
533
+ --rhc-blockquote-margin-inline-start: 0rem;
534
+ --rhc-blockquote-margin-inline-end: 0rem;
535
+ --rhc-blockquote-margin-block-start: 0rem;
536
+ --rhc-blockquote-margin-block-end: 0rem;
534
537
  --nl-heading-level-6-margin-block-start: 0rem;
535
538
  --nl-heading-level-6-margin-block-end: 0rem;
536
539
  --nl-heading-level-6-line-height: 150%;
@@ -1032,6 +1035,8 @@
1032
1035
  --utrecht-alert-border-radius: 5px;
1033
1036
  --utrecht-alert-border-color: transparent;
1034
1037
  --utrecht-alert-background-color: #d9ebf7;
1038
+ --utrecht-blockquote-content-font-size: 1.25rem;
1039
+ --utrecht-blockquote-content-color: #154273;
1035
1040
  --utrecht-blockquote-attribution-font-size: 1.25rem;
1036
1041
  --utrecht-blockquote-attribution-color: #154273;
1037
1042
  --utrecht-blockquote-row-gap: 0.75rem;
@@ -1047,46 +1052,6 @@
1047
1052
  --utrecht-blockquote-border-color: transparent;
1048
1053
  --utrecht-blockquote-border-inline-start-width: 0px;
1049
1054
  --utrecht-blockquote-background-color: transparent;
1050
- --utrecht-blockquote-pink-left-border-variation-padding-inline-start: 2.5rem;
1051
- --utrecht-blockquote-pink-left-border-variation-padding-inline-end: 2.5rem;
1052
- --utrecht-blockquote-pink-left-border-variation-padding-block-start: 1.5rem;
1053
- --utrecht-blockquote-pink-left-border-variation-padding-block-end: 1.5rem;
1054
- --utrecht-blockquote-pink-left-border-variation-border-inline-start-width: 0.75rem;
1055
- --utrecht-blockquote-pink-left-border-variation-border-color: #F6BDE1;
1056
- --utrecht-blockquote-pink-corner-border-variation-padding: 2.5rem;
1057
- --utrecht-blockquote-pink-corner-border-variation-border-start-start-radius: 3rem;
1058
- --utrecht-blockquote-pink-corner-border-variation-border-inline-start-width: 0.25rem;
1059
- --utrecht-blockquote-pink-corner-border-variation-border-color: #F6BDE1;
1060
- --utrecht-blockquote-pink-corner-border-variation-border-block-start-width: 0.25rem;
1061
- --utrecht-blockquote-pink-background-variation-padding: 2.5rem;
1062
- --utrecht-blockquote-pink-background-variation-border-end-start-radius: 3rem;
1063
- --utrecht-blockquote-pink-background-variation-background-color: #F6BDE1;
1064
- --utrecht-blockquote-content-font-size: 1.25rem;
1065
- --utrecht-blockquote-content-color: #154273;
1066
- --utrecht-blockquote-content-line-height: 150%;
1067
- --utrecht-blockquote-content-font-weight: 400;
1068
- --utrecht-blockquote-content-font-family: RijksSans, Arial, Verdana, sans-serif;
1069
- --utrecht-blockquote-caption-padding-block-start: 0.75rem;
1070
- --utrecht-blockquote-caption-line-height: 150%;
1071
- --utrecht-blockquote-caption-font-weight: 400;
1072
- --utrecht-blockquote-caption-font-size: 1.25rem;
1073
- --utrecht-blockquote-caption-font-family: RijksSans, Arial, Verdana, sans-serif;
1074
- --utrecht-blockquote-caption-color: #154273;
1075
- --utrecht-blockquote-blue-corner-border-variation-border-inline-end-width: 2px;
1076
- --utrecht-blockquote-blue-corner-border-variation-border-end-end-radius: 3rem;
1077
- --utrecht-blockquote-blue-corner-border-variation-border-color: #154273;
1078
- --utrecht-blockquote-blue-corner-border-variation-border-block-end-width: 2px;
1079
- --utrecht-blockquote-margin-inline-start: 0;
1080
- --utrecht-blockquote-margin-inline-end: 0;
1081
- --utrecht-blockquote-margin-block-start: 0;
1082
- --utrecht-blockquote-margin-block-end: 0;
1083
- --utrecht-blockquote-border-start-start-radius: 0;
1084
- --utrecht-blockquote-border-start-end-radius: 0;
1085
- --utrecht-blockquote-border-inline-end-width: 0;
1086
- --utrecht-blockquote-border-end-start-radius: 0;
1087
- --utrecht-blockquote-border-end-end-radius: 0;
1088
- --utrecht-blockquote-border-block-start-width: 0;
1089
- --utrecht-blockquote-border-block-end-width: 0;
1090
1055
  --utrecht-number-badge-padding-inline: 0.5rem;
1091
1056
  --utrecht-number-badge-padding-block: 0.125rem;
1092
1057
  --utrecht-number-badge-min-inline-size: 24px;
@@ -1111,22 +1076,12 @@
1111
1076
  --utrecht-figure-caption-padding-block-end: 0.5rem;
1112
1077
  --utrecht-figure-caption-border-width: 4px;
1113
1078
  --utrecht-figure-caption-border-color: #CBD5E1;
1114
- --utrecht-form-label-disabled-color: #94A3B8;
1115
- --utrecht-form-label-checked-font-weight: 400;
1116
- --utrecht-form-label-radio-font-weight: 400;
1117
- --utrecht-form-label-radio-color: #0F172A;
1118
- --utrecht-form-label-checkbox-font-weight: 400;
1119
- --utrecht-form-label-checkbox-color: #0F172A;
1120
- --utrecht-form-label-font-weight: 700;
1121
- --utrecht-form-label-font-size: 1.25rem;
1122
- --utrecht-form-label-color: #0F172A;
1123
1079
  --utrecht-form-field-description-margin-block-start: -0.5rem;
1124
1080
  --utrecht-form-field-description-margin-block-end: 0.5rem;
1125
1081
  --utrecht-form-field-description-line-height: 150%;
1126
1082
  --utrecht-form-field-description-font-size: 1.25rem;
1127
1083
  --utrecht-form-field-description-font-family: RijksSans, Arial, Verdana, sans-serif;
1128
1084
  --utrecht-form-field-description-color: #334155;
1129
- --utrecht-form-field-description-padding-block-end: 0.5rem;
1130
1085
  --utrecht-form-field-error-message-padding-inline-start: 0rem;
1131
1086
  --utrecht-form-field-error-message-padding-inline-end: 0rem;
1132
1087
  --utrecht-form-field-error-message-padding-block-start: 0rem;
@@ -1139,8 +1094,15 @@
1139
1094
  --utrecht-form-field-error-message-font-family: RijksSans, Arial, Verdana, sans-serif;
1140
1095
  --utrecht-form-field-error-message-color: #d52b1e;
1141
1096
  --utrecht-form-field-error-message-background-color: transparent;
1142
- --utrecht-form-field-error-message-icon-size: 24px;
1143
- --utrecht-form-field-error-message-icon-margin-inline-end: 0.5rem;
1097
+ --utrecht-form-label-disabled-color: #94A3B8;
1098
+ --utrecht-form-label-checked-font-weight: 400;
1099
+ --utrecht-form-label-radio-font-weight: 400;
1100
+ --utrecht-form-label-radio-color: #0F172A;
1101
+ --utrecht-form-label-checkbox-font-weight: 400;
1102
+ --utrecht-form-label-checkbox-color: #0F172A;
1103
+ --utrecht-form-label-font-weight: 700;
1104
+ --utrecht-form-label-font-size: 1.25rem;
1105
+ --utrecht-form-label-color: #0F172A;
1144
1106
  --utrecht-textarea-disabled-color: #475569;
1145
1107
  --utrecht-textarea-disabled-border-color: #94A3B8;
1146
1108
  --utrecht-textarea-disabled-background-color: #CBD5E1;