@rijkshuisstijl-community/design-tokens 1.2.0 → 2.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 (95) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/README.md +153 -12
  3. package/dist/_variables.scss +94 -78
  4. package/dist/index.css +94 -78
  5. package/dist/index.d.ts +48 -32
  6. package/dist/index.js +94 -78
  7. package/dist/index.json +93 -77
  8. package/dist/index.tokens.json +113 -85
  9. package/dist/root.css +94 -78
  10. package/dist/tokens.d.ts +67 -39
  11. package/dist/tokens.js +1285 -921
  12. package/dist/uitvoerend-groen/_variables.scss +1337 -0
  13. package/dist/uitvoerend-groen/index.css +1340 -0
  14. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-groen}/index.d.ts +922 -911
  15. package/dist/uitvoerend-groen/index.js +1338 -0
  16. package/dist/uitvoerend-groen/index.json +1335 -0
  17. package/dist/uitvoerend-groen/index.tokens.json +2049 -0
  18. package/dist/uitvoerend-groen/root.css +1340 -0
  19. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-groen}/tokens.d.ts +1508 -1513
  20. package/dist/uitvoerend-groen/tokens.js +31258 -0
  21. package/dist/uitvoerend-hemelblauw/_variables.scss +1337 -0
  22. package/dist/uitvoerend-hemelblauw/index.css +1340 -0
  23. package/dist/uitvoerend-hemelblauw/index.d.ts +1338 -0
  24. package/dist/uitvoerend-hemelblauw/index.js +1338 -0
  25. package/dist/uitvoerend-hemelblauw/index.json +1335 -0
  26. package/dist/uitvoerend-hemelblauw/index.tokens.json +2049 -0
  27. package/dist/uitvoerend-hemelblauw/root.css +1340 -0
  28. package/dist/uitvoerend-hemelblauw/tokens.d.ts +2072 -0
  29. package/dist/uitvoerend-hemelblauw/tokens.js +31258 -0
  30. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/_variables.scss +778 -767
  31. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/index.css +779 -768
  32. package/dist/uitvoerend-mintgroen/index.d.ts +1338 -0
  33. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/index.js +981 -970
  34. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/index.json +980 -969
  35. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/index.tokens.json +1611 -1616
  36. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/root.css +778 -767
  37. package/dist/uitvoerend-mintgroen/tokens.d.ts +2072 -0
  38. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/tokens.js +22466 -22247
  39. package/dist/uitvoerend-oranje/_variables.scss +1337 -0
  40. package/dist/uitvoerend-oranje/index.css +1340 -0
  41. package/dist/uitvoerend-oranje/index.d.ts +1338 -0
  42. package/dist/uitvoerend-oranje/index.js +1338 -0
  43. package/dist/uitvoerend-oranje/index.json +1335 -0
  44. package/dist/uitvoerend-oranje/index.tokens.json +2049 -0
  45. package/dist/uitvoerend-oranje/root.css +1340 -0
  46. package/dist/uitvoerend-oranje/tokens.d.ts +2072 -0
  47. package/dist/uitvoerend-oranje/tokens.js +31258 -0
  48. package/dist/uitvoerend-paars/_variables.scss +1337 -0
  49. package/dist/uitvoerend-paars/index.css +1340 -0
  50. package/dist/uitvoerend-paars/index.d.ts +1338 -0
  51. package/dist/uitvoerend-paars/index.js +1338 -0
  52. package/dist/uitvoerend-paars/index.json +1335 -0
  53. package/dist/uitvoerend-paars/index.tokens.json +2049 -0
  54. package/dist/uitvoerend-paars/root.css +1340 -0
  55. package/dist/uitvoerend-paars/tokens.d.ts +2072 -0
  56. package/dist/uitvoerend-paars/tokens.js +31258 -0
  57. package/dist/uitvoerend-violet/_variables.scss +191 -175
  58. package/dist/uitvoerend-violet/index.css +191 -175
  59. package/dist/uitvoerend-violet/index.d.ts +88 -72
  60. package/dist/uitvoerend-violet/index.js +191 -175
  61. package/dist/uitvoerend-violet/index.json +190 -174
  62. package/dist/uitvoerend-violet/index.tokens.json +227 -199
  63. package/dist/uitvoerend-violet/root.css +191 -175
  64. package/dist/uitvoerend-violet/tokens.d.ts +123 -95
  65. package/dist/uitvoerend-violet/tokens.js +16557 -16193
  66. package/dist/uitvoerend-violet-oud/_variables.scss +191 -174
  67. package/dist/uitvoerend-violet-oud/index.css +191 -174
  68. package/dist/uitvoerend-violet-oud/index.d.ts +88 -71
  69. package/dist/uitvoerend-violet-oud/index.js +191 -174
  70. package/dist/uitvoerend-violet-oud/index.json +190 -173
  71. package/dist/uitvoerend-violet-oud/index.tokens.json +227 -198
  72. package/dist/uitvoerend-violet-oud/root.css +191 -174
  73. package/dist/uitvoerend-violet-oud/tokens.d.ts +123 -94
  74. package/dist/uitvoerend-violet-oud/tokens.js +12703 -12318
  75. package/dist/wetgevend/_variables.scss +131 -115
  76. package/dist/wetgevend/index.css +131 -115
  77. package/dist/wetgevend/index.d.ts +88 -72
  78. package/dist/wetgevend/index.js +131 -115
  79. package/dist/wetgevend/index.json +130 -114
  80. package/dist/wetgevend/index.tokens.json +167 -139
  81. package/dist/wetgevend/root.css +131 -115
  82. package/dist/wetgevend/tokens.d.ts +123 -95
  83. package/dist/wetgevend/tokens.js +12053 -11689
  84. package/figma/figma.tokens.json +840 -294
  85. package/package.json +1 -1
  86. package/src/generated/base.tokens.json +240 -163
  87. package/src/generated/themes.json +30580 -5292
  88. package/src/generated/uitvoerend-groen/tokens.json +6252 -0
  89. package/src/generated/uitvoerend-hemelblauw/tokens.json +6252 -0
  90. package/src/generated/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/tokens.json +4384 -4355
  91. package/src/generated/uitvoerend-oranje/tokens.json +6252 -0
  92. package/src/generated/uitvoerend-paars/tokens.json +6252 -0
  93. package/src/generated/uitvoerend-violet/tokens.json +506 -429
  94. package/src/generated/uitvoerend-violet-oud/tokens.json +512 -431
  95. package/src/generated/wetgevend/tokens.json +467 -390
package/dist/index.js CHANGED
@@ -1,13 +1,17 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 29 Apr 2025 12:01:02 GMT
3
+ * Generated on Tue, 27 May 2025 13:07:13 GMT
4
4
  */
5
5
 
6
+ export const utrechtColumnLayoutColumnRuleColor = "transparent";
7
+ export const utrechtColumnLayoutColumnRuleWidth = "0px";
8
+ export const utrechtColumnLayoutColumnWidth = "400px";
9
+ export const utrechtColumnLayoutGap = "0.75rem";
6
10
  export const utrechtUnorderedListPaddingInlineStart = "1.5rem";
7
11
  export const utrechtUnorderedListMarginBlockEnd = "0.25rem";
8
12
  export const utrechtUnorderedListMarginBlockStart = "0.25rem";
9
13
  export const utrechtUnorderedListColor = "#0F172A";
10
- export const utrechtUnorderedListFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
14
+ export const utrechtUnorderedListFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
11
15
  export const utrechtUnorderedListFontWeight = 400;
12
16
  export const utrechtUnorderedListFontSize = "1.25rem";
13
17
  export const utrechtUnorderedListLineHeight = "150%";
@@ -17,7 +21,7 @@ export const utrechtUnorderedListItemMarginBlockStart = "0.25rem";
17
21
  export const utrechtUnorderedListMarkerColor = "#0F172A";
18
22
  export const utrechtUnorderedListMarkerBorderColor = "#0F172A";
19
23
  export const utrechtTextboxBorderRadius = "2.5px";
20
- export const utrechtTextboxFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
24
+ export const utrechtTextboxFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
21
25
  export const utrechtTextboxFontSize = "1.25rem";
22
26
  export const utrechtTextboxFontWeight = 400;
23
27
  export const utrechtTextboxLineHeight = "150%";
@@ -80,19 +84,19 @@ export const utrechtTextareaHoverBorderWidth = "1px";
80
84
  export const utrechtTextareaBorderRadius = "2.5px";
81
85
  export const utrechtTextareaBorderBottomWidth = "1px";
82
86
  export const utrechtTextareaBorderWidth = "1px";
83
- export const utrechtTextareaFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
87
+ export const utrechtTextareaFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
84
88
  export const utrechtTextareaFontWeight = 400;
85
89
  export const utrechtTextareaLineHeight = "150%";
86
90
  export const utrechtTextareaFontSize = "1.25rem";
87
91
  export const utrechtTableHeaderCellLineHeight = "150%";
88
92
  export const utrechtTableHeaderCellColor = "#0F172A";
89
- export const utrechtTableHeaderCellFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
93
+ export const utrechtTableHeaderCellFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
90
94
  export const utrechtTableHeaderCellFontWeight = 700;
91
95
  export const utrechtTableHeaderCellFontSize = "1.25rem";
92
96
  export const utrechtTableCaptionLineHeight = "125%";
93
97
  export const utrechtTableCaptionMarginBlockEnd = "1.5rem";
94
98
  export const utrechtTableCaptionColor = "#0F172A";
95
- export const utrechtTableCaptionFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
99
+ export const utrechtTableCaptionFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
96
100
  export const utrechtTableCaptionFontWeight = 700;
97
101
  export const utrechtTableCaptionFontSize = "1.875rem";
98
102
  export const utrechtTableCellPaddingBlockEnd = "0.75rem";
@@ -101,7 +105,7 @@ export const utrechtTableCellPaddingInlineEnd = "1rem";
101
105
  export const utrechtTableCellPaddingInlineStart = "1rem";
102
106
  export const utrechtTableCellLineHeight = "150%";
103
107
  export const utrechtTableDataCellColor = "#0F172A";
104
- export const utrechtTableDataCellFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
108
+ export const utrechtTableDataCellFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
105
109
  export const utrechtTableDataCellFontWeight = 400;
106
110
  export const utrechtTableDataCellLineHeight = "150%";
107
111
  export const utrechtTableDataCellFontSize = "1.25rem";
@@ -117,7 +121,7 @@ export const utrechtTableRowBackgroundColor = "transparent";
117
121
  export const utrechtTableFooterCellFontWeight = 700;
118
122
  export const utrechtTableFooterCellFontSize = "1.25rem";
119
123
  export const utrechtTableFooterCellColor = "#0F172A";
120
- export const utrechtTableFooterCellFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
124
+ export const utrechtTableFooterCellFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
121
125
  export const utrechtTableFooterCellLineHeight = "150%";
122
126
  export const utrechtTableContainerBoxInlineEndShadowX = 0;
123
127
  export const utrechtTableContainerBoxInlineEndShadowY = "16px";
@@ -131,7 +135,7 @@ export const utrechtTableContainerBoxInlineStartShadowSpread = 0;
131
135
  export const utrechtTableContainerBoxInlineStartShadowColor = "#0000001a";
132
136
  export const utrechtTableFontSize = "1.25rem";
133
137
  export const utrechtSkipLinkFontWeight = 700;
134
- export const utrechtSkipLinkFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
138
+ export const utrechtSkipLinkFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
135
139
  export const utrechtSkipLinkFontSize = "1.25rem";
136
140
  export const utrechtSkipLinkLineHeight = "150%";
137
141
  export const utrechtSkipLinkMinBlockSize = "48px";
@@ -189,7 +193,7 @@ export const utrechtSelectPaddingInlineStart = "0.75rem";
189
193
  export const utrechtSelectBorderRadius = "2.5px";
190
194
  export const utrechtSelectBorderBottomWidth = "auto";
191
195
  export const utrechtSelectBorderWidth = "1px";
192
- export const utrechtSelectFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
196
+ export const utrechtSelectFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
193
197
  export const utrechtSelectFontWeight = 400;
194
198
  export const utrechtSelectLineHeight = "150%";
195
199
  export const utrechtSelectFontSize = "1.25rem";
@@ -235,12 +239,12 @@ export const utrechtRadioButtonHoverBorderWidth = "1px";
235
239
  export const utrechtRadioButtonBorderRadius = "999px";
236
240
  export const utrechtRadioButtonBorderWidth = "1px";
237
241
  export const utrechtPreHeadingColor = "#0F172A";
238
- export const utrechtPreHeadingFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
242
+ export const utrechtPreHeadingFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
239
243
  export const utrechtPreHeadingFontWeight = 700;
240
244
  export const utrechtPreHeadingLineHeight = "125%";
241
245
  export const utrechtPreHeadingFontSize = "1rem";
242
246
  export const utrechtParagraphColor = "#0F172A";
243
- export const utrechtParagraphFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
247
+ export const utrechtParagraphFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
244
248
  export const utrechtParagraphFontSize = "1.25rem";
245
249
  export const utrechtParagraphFontWeight = 400;
246
250
  export const utrechtParagraphLineHeight = "150%";
@@ -258,7 +262,7 @@ export const utrechtOrderedListItemPaddingInlineStart = 0;
258
262
  export const utrechtOrderedListItemMarginBlockEnd = "0.25rem";
259
263
  export const utrechtOrderedListItemMarginBlockStart = "0.25rem";
260
264
  export const utrechtOrderedListColor = "#0F172A";
261
- export const utrechtOrderedListFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
265
+ export const utrechtOrderedListFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
262
266
  export const utrechtOrderedListFontWeight = 400;
263
267
  export const utrechtOrderedListFontSize = "1.25rem";
264
268
  export const utrechtOrderedListLineHeight = "150%";
@@ -287,7 +291,7 @@ export const utrechtLinkIconSize = "24px";
287
291
  export const utrechtLinkColumnGap = "0.25rem";
288
292
  export const utrechtLinkTextDecorationThickness = "auto";
289
293
  export const utrechtLinkTextUnderlineOffset = "0.125rem";
290
- export const utrechtLinkFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
294
+ export const utrechtLinkFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
291
295
  export const utrechtLinkFontWeight = 400;
292
296
  export const utrechtLinkFontSize = "1.25rem";
293
297
  export const utrechtLinkLineHeight = "150%";
@@ -295,35 +299,35 @@ export const utrechtIconColor = "inherit";
295
299
  export const utrechtIconSize = "24px";
296
300
  export const utrechtIconInsetBlockStart = 0;
297
301
  export const utrechtHeading1Color = "#154273";
298
- export const utrechtHeading1FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
302
+ export const utrechtHeading1FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
299
303
  export const utrechtHeading1FontWeight = 700;
300
304
  export const utrechtHeading1LineHeight = "125%";
301
305
  export const utrechtHeading1FontSize = "3.125rem";
302
306
  export const utrechtHeading1MarginBlockEnd = 0;
303
307
  export const utrechtHeading1MarginBlockStart = 0;
304
308
  export const utrechtHeading2Color = "#154273";
305
- export const utrechtHeading2FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
309
+ export const utrechtHeading2FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
306
310
  export const utrechtHeading2FontWeight = 700;
307
311
  export const utrechtHeading2LineHeight = "125%";
308
312
  export const utrechtHeading2FontSize = "2.5rem";
309
313
  export const utrechtHeading2MarginBlockEnd = 0;
310
314
  export const utrechtHeading2MarginBlockStart = 0;
311
315
  export const utrechtHeading3Color = "#154273";
312
- export const utrechtHeading3FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
316
+ export const utrechtHeading3FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
313
317
  export const utrechtHeading3FontWeight = 700;
314
318
  export const utrechtHeading3LineHeight = "125%";
315
319
  export const utrechtHeading3FontSize = "1.875rem";
316
320
  export const utrechtHeading3MarginBlockEnd = 0;
317
321
  export const utrechtHeading3MarginBlockStart = 0;
318
322
  export const utrechtHeading4Color = "#154273";
319
- export const utrechtHeading4FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
323
+ export const utrechtHeading4FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
320
324
  export const utrechtHeading4FontWeight = 700;
321
325
  export const utrechtHeading4LineHeight = "125%";
322
326
  export const utrechtHeading4FontSize = "1.5rem";
323
327
  export const utrechtHeading4MarginBlockEnd = 0;
324
328
  export const utrechtHeading4MarginBlockStart = 0;
325
329
  export const utrechtHeading5Color = "#154273";
326
- export const utrechtHeading5FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
330
+ export const utrechtHeading5FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
327
331
  export const utrechtHeading5FontWeight = 700;
328
332
  export const utrechtHeading5LineHeight = "125%";
329
333
  export const utrechtHeading5FontSize = "1.25rem";
@@ -333,20 +337,20 @@ export const utrechtFormLabelColor = "#0F172A";
333
337
  export const utrechtFormLabelFontSize = "1.25rem";
334
338
  export const utrechtFormLabelFontWeight = 700;
335
339
  export const utrechtFormFieldLabelColor = "#0F172A";
336
- export const utrechtFormFieldLabelFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
340
+ export const utrechtFormFieldLabelFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
337
341
  export const utrechtFormFieldLabelFontSize = "1.25rem";
338
342
  export const utrechtFormFieldLabelFontWeight = 700;
339
343
  export const utrechtFormFieldLabelLineHeight = "150%";
340
344
  export const utrechtFormFieldErrorMessageIconSize = "24px";
341
345
  export const utrechtFormFieldErrorMessageIconMarginInlineEnd = "0.5rem";
342
346
  export const utrechtFormFieldErrorMessageColor = "#d52b1e";
343
- export const utrechtFormFieldErrorMessageFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
347
+ export const utrechtFormFieldErrorMessageFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
344
348
  export const utrechtFormFieldErrorMessageFontSize = "1.25rem";
345
349
  export const utrechtFormFieldErrorMessageFontWeight = 400;
346
350
  export const utrechtFormFieldErrorMessageMarginBlockEnd = "0.5rem";
347
351
  export const utrechtFormFieldErrorMessagePaddingBlockEnd = "0.5rem";
348
352
  export const utrechtFormFieldDescriptionColor = "#334155";
349
- export const utrechtFormFieldDescriptionFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
353
+ export const utrechtFormFieldDescriptionFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
350
354
  export const utrechtFormFieldDescriptionFontSize = "1.25rem";
351
355
  export const utrechtFormFieldDescriptionLineHeight = "150%";
352
356
  export const utrechtFormFieldDescriptionMarginBlockStart = "-0.5rem";
@@ -378,7 +382,7 @@ export const utrechtFigureImgBorderEndStartRadius = 0;
378
382
  export const utrechtFigureImgBorderStartEndRadius = 0;
379
383
  export const utrechtFigureImgBorderStartStartRadius = 0;
380
384
  export const utrechtFormFieldsetLegendColor = "#0F172A";
381
- export const utrechtFormFieldsetLegendFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
385
+ export const utrechtFormFieldsetLegendFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
382
386
  export const utrechtFormFieldsetLegendFontSize = "1.25rem";
383
387
  export const utrechtFormFieldsetLegendFontWeight = 700;
384
388
  export const utrechtFormFieldsetLegendLineHeight = "150%";
@@ -395,7 +399,7 @@ export const utrechtNumberBadgeMinInlineSize = "24px";
395
399
  export const utrechtNumberBadgeFontWeight = 700;
396
400
  export const utrechtNumberBadgeBorderWidth = "0px";
397
401
  export const utrechtNumberBadgeBorderRadius = "999px";
398
- export const utrechtNumberBadgeFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
402
+ export const utrechtNumberBadgeFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
399
403
  export const utrechtNumberBadgeBackgroundColor = "#154273";
400
404
  export const utrechtNumberBadgeBorderColor = "transparent";
401
405
  export const utrechtNumberBadgeColor = "#fff";
@@ -473,7 +477,7 @@ export const utrechtButtonBorderRadius = "5px";
473
477
  export const utrechtButtonBorderWidth = "1px";
474
478
  export const utrechtButtonIconGap = "0.5rem";
475
479
  export const utrechtButtonIconSize = "24px";
476
- export const utrechtButtonFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
480
+ export const utrechtButtonFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
477
481
  export const utrechtButtonFontSize = "1.25rem";
478
482
  export const utrechtButtonFontWeight = 700;
479
483
  export const utrechtButtonLineHeight = "150%";
@@ -585,39 +589,45 @@ export const utrechtBreadcrumbNavDividerSize = "24px";
585
589
  export const utrechtBreadcrumbNavDividerColor = "#334155";
586
590
  export const utrechtBreadcrumbNavDividerInsetBlockStart = 0;
587
591
  export const utrechtBreadcrumbNavMarginInline = "0.5rem";
588
- export const utrechtBreadcrumbNavFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
592
+ export const utrechtBreadcrumbNavFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
589
593
  export const utrechtBreadcrumbNavFontWeight = 400;
594
+ export const utrechtBlockquoteBackgroundColor = "transparent";
595
+ export const utrechtBlockquoteBorderInlineStartWidth = 0;
596
+ export const utrechtBlockquoteBorderColor = "transparent";
597
+ export const utrechtBlockquoteBorderRadius = 0;
598
+ export const utrechtBlockquoteBorderWidth = 0;
599
+ export const utrechtBlockquoteColor = "#154273";
600
+ export const utrechtBlockquoteFontSize = "1.25rem";
601
+ export const utrechtBlockquoteFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
602
+ export const utrechtBlockquotePaddingBlockEnd = "2rem";
603
+ export const utrechtBlockquotePaddingBlockStart = "2rem";
604
+ export const utrechtBlockquotePaddingInlineEnd = "2rem";
605
+ export const utrechtBlockquotePaddingInlineStart = "2rem";
606
+ export const utrechtBlockquoteRowGap = "0.75rem";
607
+ export const utrechtBlockquoteAttributionColor = "#154273";
608
+ export const utrechtBlockquoteAttributionFontSize = "1.25rem";
609
+ export const utrechtBlockquoteContentColor = "#154273";
610
+ export const utrechtBlockquoteContentFontSize = "1.25rem";
611
+ export const utrechtBlockquoteContentFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
612
+ export const utrechtBlockquoteContentLineHeight = "150%";
613
+ export const utrechtBlockquoteContentFontWeight = 400;
590
614
  export const utrechtBlockquoteCaptionFontSize = "1.25rem";
591
- export const utrechtBlockquoteCaptionFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
615
+ export const utrechtBlockquoteCaptionFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
592
616
  export const utrechtBlockquoteCaptionLineHeight = "150%";
593
617
  export const utrechtBlockquoteCaptionFontWeight = 400;
594
618
  export const utrechtBlockquoteCaptionPaddingBlockStart = "0.75rem";
595
- export const utrechtBlockquoteCaptionColor = "#334155";
596
- export const utrechtBlockquoteContentFontFamily = "RijksoverheidSerifWeb, 'Times New Roman', serif";
597
- export const utrechtBlockquoteContentLineHeight = "150%";
598
- export const utrechtBlockquoteContentFontWeight = 400;
599
- export const utrechtBlockquoteContentFontSize = "1.5rem";
600
- export const utrechtBlockquoteContentColor = "#0F172A";
619
+ export const utrechtBlockquoteCaptionColor = "#154273";
601
620
  export const utrechtBlockquoteMarginBlockEnd = 0;
602
621
  export const utrechtBlockquoteMarginBlockStart = 0;
603
622
  export const utrechtBlockquoteMarginInlineEnd = 0;
604
623
  export const utrechtBlockquoteMarginInlineStart = 0;
605
- export const utrechtBlockquotePaddingBlockEnd = "2rem";
606
- export const utrechtBlockquotePaddingBlockStart = "2rem";
607
- export const utrechtBlockquotePaddingInlineEnd = "2rem";
608
- export const utrechtBlockquotePaddingInlineStart = "2rem";
609
- export const utrechtBlockquoteRowGap = "0.75rem";
610
- export const utrechtBlockquoteBackgroundColor = "transparent";
611
- export const utrechtBlockquoteBorderColor = "#154273";
612
624
  export const utrechtBlockquoteBorderBlockStartWidth = 0;
613
625
  export const utrechtBlockquoteBorderBlockEndWidth = 0;
614
- export const utrechtBlockquoteBorderInlineStartWidth = 0;
615
626
  export const utrechtBlockquoteBorderInlineEndWidth = 0;
616
627
  export const utrechtBlockquoteBorderStartStartRadius = 0;
617
628
  export const utrechtBlockquoteBorderStartEndRadius = 0;
618
629
  export const utrechtBlockquoteBorderEndStartRadius = 0;
619
630
  export const utrechtBlockquoteBorderEndEndRadius = 0;
620
- export const utrechtBlockquoteBorderWidth = "2px";
621
631
  export const utrechtBlockquoteBlueCornerBorderVariationBorderColor = "#154273";
622
632
  export const utrechtBlockquoteBlueCornerBorderVariationBorderBlockEndWidth = "2px";
623
633
  export const utrechtBlockquoteBlueCornerBorderVariationBorderInlineEndWidth = "2px";
@@ -637,7 +647,7 @@ export const utrechtBlockquotePinkCornerBorderVariationBorderInlineStartWidth =
637
647
  export const utrechtBlockquotePinkCornerBorderVariationBorderStartStartRadius = "3rem";
638
648
  export const utrechtBlockquotePinkCornerBorderVariationPadding = "2.5rem";
639
649
  export const utrechtArticleMaxInlineSize = "75ch";
640
- export const utrechtAlertHeadingFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
650
+ export const utrechtAlertHeadingFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
641
651
  export const utrechtAlertHeadingFontWeight = 700;
642
652
  export const utrechtAlertHeadingLineHeight = "150%";
643
653
  export const utrechtAlertHeadingFontSize = "1.25rem";
@@ -697,7 +707,7 @@ export const utrechtAccordionButtonActiveColor = "#0F172A";
697
707
  export const utrechtAccordionButtonActiveRowGap = 0;
698
708
  export const utrechtDocumentBackgroundColor = "#fff";
699
709
  export const utrechtDocumentColor = "#0F172A";
700
- export const utrechtDocumentFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
710
+ export const utrechtDocumentFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
701
711
  export const utrechtDocumentFontSize = "1.25rem";
702
712
  export const utrechtDocumentLineHeight = "150%";
703
713
  export const utrechtDocumentFontWeight = 400;
@@ -741,7 +751,7 @@ export const rhcSidenavLinkLineHeight = "150%";
741
751
  export const rhcSidenavLinkIconSize = "24px";
742
752
  export const rhcSidenavLinkIconMarginInline = "0.5rem";
743
753
  export const rhcSidenavLinkFontSize = "1.25rem";
744
- export const rhcSidenavLinkFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
754
+ export const rhcSidenavLinkFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
745
755
  export const rhcSidenavLinkFontWeight = 400;
746
756
  export const rhcSidenavLinkCurrentFontWeight = 700;
747
757
  export const rhcSidenavLinkCurrentColor = "#0F172A";
@@ -773,7 +783,7 @@ export const rhcNavigationListItemIconSize = "24px";
773
783
  export const rhcNavigationListItemContentFontSize = "1.125rem";
774
784
  export const rhcNavigationListItemContentColumnGap = "0.5rem";
775
785
  export const rhcNavigationListItemContentRowGap = "0.25rem";
776
- export const rhcNavigationListItemLabelFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
786
+ export const rhcNavigationListItemLabelFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
777
787
  export const rhcNavigationListItemLabelFontSize = "1.875rem";
778
788
  export const rhcNavigationListItemLabelFontWeight = 700;
779
789
  export const rhcNavigationListItemLabelLineHeight = "150%";
@@ -827,7 +837,7 @@ export const rhcMessageListItemPaddingInline = "1rem";
827
837
  export const rhcMessageListItemContentFontSize = "1.125rem";
828
838
  export const rhcMessageListItemContentColumnGap = "0.5rem";
829
839
  export const rhcMessageListItemContentRowGap = "0.5rem";
830
- export const rhcMessageListItemLabelFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
840
+ export const rhcMessageListItemLabelFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
831
841
  export const rhcMessageListItemLabelFontSize = "1.25rem";
832
842
  export const rhcMessageListItemLabelFontWeight = 700;
833
843
  export const rhcMessageListItemLabelLineHeight = "150%";
@@ -844,7 +854,7 @@ export const rhcLogoSubtitleFontWeight = 400;
844
854
  export const rhcLogoSubtitleLineHeight = "1rem";
845
855
  export const rhcLogoSubtitleFontSize = "0.775rem";
846
856
  export const rhcLogoColumnGap = "12px";
847
- export const rhcLogoFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
857
+ export const rhcLogoFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
848
858
  export const rhcLogoColor = "#154273";
849
859
  export const rhcLinkListCardBackgroundColor = "#fff";
850
860
  export const rhcLinkListCardPaddingBlockStart = "1.5rem";
@@ -860,11 +870,11 @@ export const rhcIconOnlyButtonPaddingInlineStart = "0.75rem";
860
870
  export const rhcHeroHeadingFontWeight = 700;
861
871
  export const rhcHeroHeadingLineHeight = "125%";
862
872
  export const rhcHeroHeadingFontSize = "1.875rem";
863
- export const rhcHeroHeadingFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
873
+ export const rhcHeroHeadingFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
864
874
  export const rhcHeroSubHeadingFontWeight = 400;
865
875
  export const rhcHeroSubHeadingLineHeight = "150%";
866
876
  export const rhcHeroSubHeadingFontSize = "1.25rem";
867
- export const rhcHeroSubHeadingFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
877
+ export const rhcHeroSubHeadingFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
868
878
  export const rhcHeroMessageBackgroundColor = "#154273";
869
879
  export const rhcHeroMessageColor = "#fff";
870
880
  export const rhcHeroMessageRowGap = "0.125rem";
@@ -967,23 +977,7 @@ export const rhcCardAsLinkHorizontalPaddingBlockStart = 0;
967
977
  export const rhcCardAsLinkHorizontalPaddingInlineEnd = "1rem";
968
978
  export const rhcCardAsLinkHorizontalPaddingInlineStart = "1rem";
969
979
  export const rhcCardAsLinkHorizontalHeadingInlineSize = "200px";
970
- export const rhcAccordionButtonFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
971
- export const rhcAccordionButtonFontSize = "1.25rem";
972
- export const rhcAccordionButtonFontWeight = 400;
973
- export const rhcAccordionButtonLineHeight = "150%";
974
- export const rhcAccordionButtonIconMarginBlock = "0.25rem";
975
- export const rhcAccordionButtonPaddingBlockEnd = "0.75rem";
976
- export const rhcAccordionButtonPaddingBlockStart = "0.75rem";
977
- export const rhcAccordionButtonPaddingInlineEnd = "1rem";
978
- export const rhcAccordionButtonPaddingInlineStart = "1rem";
979
- export const rhcAccordionButtonExpandedBackgroundColor = "#fff";
980
- export const rhcAccordionButtonExpandedColor = "#0F172A";
981
- export const rhcAccordionSectionBorderBlockEndWidth = "1px";
982
- export const rhcAccordionSectionBorderWidth = 0;
983
- export const rhcAccordionSectionBorderColor = "#94A3B8";
984
- export const rhcAccordionHeaderMargin = 0;
985
- export const rhcAccordionBorderRadius = "0px";
986
- export const rhcAccordionColor = "#0F172A";
980
+ export const rhcKeepComment = "⚠️ Deze tokens zijn legacy en worden vervangen door de tokenset components/blockquote.";
987
981
  export const rhcKeepTopLeftBorderRadiusTopLeft = "48px";
988
982
  export const rhcKeepTopLeftBorderRadiusTopRight = 0;
989
983
  export const rhcKeepTopLeftBorderRadiusBottomRight = 0;
@@ -1000,15 +994,37 @@ export const rhcKeepBottomLeftBorderRadiusTopLeft = 0;
1000
994
  export const rhcKeepBottomLeftBorderRadiusTopRight = 0;
1001
995
  export const rhcKeepBottomLeftBorderRadiusBottomRight = 0;
1002
996
  export const rhcKeepBottomLeftBorderRadiusBottomLeft = "48px";
997
+ export const rhcAccordionButtonFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
998
+ export const rhcAccordionButtonFontSize = "1.25rem";
999
+ export const rhcAccordionButtonFontWeight = 400;
1000
+ export const rhcAccordionButtonLineHeight = "150%";
1001
+ export const rhcAccordionButtonIconMarginBlock = "0.25rem";
1002
+ export const rhcAccordionButtonPaddingBlockEnd = "0.75rem";
1003
+ export const rhcAccordionButtonPaddingBlockStart = "0.75rem";
1004
+ export const rhcAccordionButtonPaddingInlineEnd = "1rem";
1005
+ export const rhcAccordionButtonPaddingInlineStart = "1rem";
1006
+ export const rhcAccordionButtonExpandedBackgroundColor = "#fff";
1007
+ export const rhcAccordionButtonExpandedColor = "#0F172A";
1008
+ export const rhcAccordionSectionBorderBlockEndWidth = "1px";
1009
+ export const rhcAccordionSectionBorderWidth = 0;
1010
+ export const rhcAccordionSectionBorderColor = "#94A3B8";
1011
+ export const rhcAccordionHeaderMargin = 0;
1012
+ export const rhcAccordionBorderRadius = "0px";
1013
+ export const rhcAccordionColor = "#0F172A";
1014
+ export const rhcRoundedCornerXsBorderRadius = "24px";
1015
+ export const rhcRoundedCornerMdBorderRadius = "48px";
1016
+ export const rhcRoundedCornerXlBorderRadius = "96px";
1017
+ export const rhcRoundedCornerBorderWidth = "2px";
1003
1018
  export const rhcBorderRadiusSm = "2.5px";
1004
1019
  export const rhcBorderRadiusMd = "5px";
1005
- export const rhcBorderRadiusKeep = "48px";
1006
1020
  export const rhcBorderRadiusCircle = "999px";
1007
1021
  export const rhcBorderRadiusNone = "0px";
1008
1022
  export const rhcColorFocusOutline = "#000";
1009
1023
  export const rhcColorForegroundDefault = "#0F172A";
1010
1024
  export const rhcColorForegroundSubdued = "#334155";
1011
1025
  export const rhcColorForegroundLink = "#01689b";
1026
+ export const rhcColorForegroundOnDarkColor = "#fff";
1027
+ export const rhcColorForegroundOnLightColor = "#000";
1012
1028
  export const rhcColorForegroundOnEmphasis = "#fff";
1013
1029
  export const rhcColorBorderDefault = "#64748B";
1014
1030
  export const rhcColorBorderSubdued = "#94A3B8";
@@ -1195,7 +1211,7 @@ export const rhcFontWeightRegular = 400;
1195
1211
  export const rhcFontWeightChosenRegular = 400;
1196
1212
  export const rhcFontWeightLight = 300;
1197
1213
  export const rhcFontWeightThin = 200;
1198
- export const rhcFontFamilyPrimary = "Fira Sans, Arial, Verdana, sans-serif";
1214
+ export const rhcFontFamilyPrimary = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1199
1215
  export const rhcFontFamilySecondary = "RijksoverheidSerifWeb, 'Times New Roman', serif";
1200
1216
  export const rhcBorderWidthDefault = "1px";
1201
1217
  export const rhcBorderWidthM = "2px";
@@ -1212,7 +1228,7 @@ export const rhcSpace500 = "2.5rem";
1212
1228
  export const rhcSpace600 = "3rem";
1213
1229
  export const rhcSpace700 = "3.5rem";
1214
1230
  export const nlSkipLinkFontWeight = 700;
1215
- export const nlSkipLinkFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
1231
+ export const nlSkipLinkFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1216
1232
  export const nlSkipLinkFontSize = "1.25rem";
1217
1233
  export const nlSkipLinkLineHeight = "150%";
1218
1234
  export const nlSkipLinkMinBlockSize = "48px";
@@ -1240,7 +1256,7 @@ export const nlSkipLinkBoxBlockEndShadowColor = "#0000001a";
1240
1256
  export const nlSkipLinkTextDecoration = "underline";
1241
1257
  export const nlSkipLinkTextUnderlineOffset = "0.125rem";
1242
1258
  export const nlParagraphColor = "#0F172A";
1243
- export const nlParagraphFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
1259
+ export const nlParagraphFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1244
1260
  export const nlParagraphFontSize = "1.25rem";
1245
1261
  export const nlParagraphFontWeight = 400;
1246
1262
  export const nlParagraphLineHeight = "150%";
@@ -1268,40 +1284,40 @@ export const nlLinkIconSize = "24px";
1268
1284
  export const nlLinkColumnGap = "0.25rem";
1269
1285
  export const nlLinkTextDecorationThickness = "auto";
1270
1286
  export const nlLinkTextUnderlineOffset = "0.125rem";
1271
- export const nlLinkFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
1287
+ export const nlLinkFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1272
1288
  export const nlLinkFontWeight = 400;
1273
1289
  export const nlLinkFontSize = "1.25rem";
1274
1290
  export const nlLinkLineHeight = "150%";
1275
1291
  export const nlHeadingLevel1Color = "#154273";
1276
- export const nlHeadingLevel1FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
1292
+ export const nlHeadingLevel1FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1277
1293
  export const nlHeadingLevel1FontWeight = 700;
1278
1294
  export const nlHeadingLevel1LineHeight = "125%";
1279
1295
  export const nlHeadingLevel1FontSize = "3.125rem";
1280
1296
  export const nlHeadingLevel1MarginBlockEnd = 0;
1281
1297
  export const nlHeadingLevel1MarginBlockStart = 0;
1282
1298
  export const nlHeadingLevel2Color = "#154273";
1283
- export const nlHeadingLevel2FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
1299
+ export const nlHeadingLevel2FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1284
1300
  export const nlHeadingLevel2FontWeight = 700;
1285
1301
  export const nlHeadingLevel2LineHeight = "125%";
1286
1302
  export const nlHeadingLevel2FontSize = "2.5rem";
1287
1303
  export const nlHeadingLevel2MarginBlockEnd = 0;
1288
1304
  export const nlHeadingLevel2MarginBlockStart = 0;
1289
1305
  export const nlHeadingLevel3Color = "#154273";
1290
- export const nlHeadingLevel3FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
1306
+ export const nlHeadingLevel3FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1291
1307
  export const nlHeadingLevel3FontWeight = 700;
1292
1308
  export const nlHeadingLevel3LineHeight = "125%";
1293
1309
  export const nlHeadingLevel3FontSize = "1.875rem";
1294
1310
  export const nlHeadingLevel3MarginBlockEnd = 0;
1295
1311
  export const nlHeadingLevel3MarginBlockStart = 0;
1296
1312
  export const nlHeadingLevel4Color = "#154273";
1297
- export const nlHeadingLevel4FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
1313
+ export const nlHeadingLevel4FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1298
1314
  export const nlHeadingLevel4FontWeight = 700;
1299
1315
  export const nlHeadingLevel4LineHeight = "125%";
1300
1316
  export const nlHeadingLevel4FontSize = "1.5rem";
1301
1317
  export const nlHeadingLevel4MarginBlockEnd = 0;
1302
1318
  export const nlHeadingLevel4MarginBlockStart = 0;
1303
1319
  export const nlHeadingLevel5Color = "#154273";
1304
- export const nlHeadingLevel5FontFamily = "Fira Sans, Arial, Verdana, sans-serif";
1320
+ export const nlHeadingLevel5FontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1305
1321
  export const nlHeadingLevel5FontWeight = 700;
1306
1322
  export const nlHeadingLevel5LineHeight = "125%";
1307
1323
  export const nlHeadingLevel5FontSize = "1.25rem";
@@ -1314,7 +1330,7 @@ export const nlNumberBadgeMinInlineSize = "24px";
1314
1330
  export const nlNumberBadgeFontWeight = 700;
1315
1331
  export const nlNumberBadgeBorderWidth = "0px";
1316
1332
  export const nlNumberBadgeBorderRadius = "999px";
1317
- export const nlNumberBadgeFontFamily = "Fira Sans, Arial, Verdana, sans-serif";
1333
+ export const nlNumberBadgeFontFamily = "RijksoverheidSansWeb, Fira Sans, Arial, Verdana, sans-serif";
1318
1334
  export const nlNumberBadgeBackgroundColor = "#154273";
1319
1335
  export const nlNumberBadgeBorderColor = "transparent";
1320
1336
  export const nlNumberBadgeColor = "#fff";