@rijkshuisstijl-community/design-tokens 1.0.0 → 1.0.1

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 (54) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/_variables.scss +2 -2
  3. package/dist/index.css +2 -2
  4. package/dist/index.d.ts +1 -1
  5. package/dist/index.js +2 -2
  6. package/dist/index.json +1 -1
  7. package/dist/index.tokens.json +1 -1
  8. package/dist/root.css +2 -2
  9. package/dist/tokens.d.ts +1 -1
  10. package/dist/tokens.js +3 -3
  11. package/dist/uitvoerend-mintgroen-focus/_variables.scss +613 -608
  12. package/dist/uitvoerend-mintgroen-focus/index.css +613 -608
  13. package/dist/uitvoerend-mintgroen-focus/index.d.ts +503 -498
  14. package/dist/uitvoerend-mintgroen-focus/index.js +504 -499
  15. package/dist/uitvoerend-mintgroen-focus/index.json +503 -498
  16. package/dist/uitvoerend-mintgroen-focus/index.tokens.json +1508 -1501
  17. package/dist/uitvoerend-mintgroen-focus/root.css +613 -608
  18. package/dist/uitvoerend-mintgroen-focus/tokens.d.ts +1433 -1426
  19. package/dist/uitvoerend-mintgroen-focus/tokens.js +19750 -19643
  20. package/dist/uitvoerend-violet/_variables.scss +611 -606
  21. package/dist/uitvoerend-violet/index.css +611 -606
  22. package/dist/uitvoerend-violet/index.d.ts +503 -498
  23. package/dist/uitvoerend-violet/index.js +504 -499
  24. package/dist/uitvoerend-violet/index.json +503 -498
  25. package/dist/uitvoerend-violet/index.tokens.json +1503 -1496
  26. package/dist/uitvoerend-violet/root.css +611 -606
  27. package/dist/uitvoerend-violet/tokens.d.ts +1377 -1370
  28. package/dist/uitvoerend-violet/tokens.js +20280 -20173
  29. package/dist/uitvoerend-violet-oud/_variables.scss +611 -606
  30. package/dist/uitvoerend-violet-oud/index.css +611 -606
  31. package/dist/uitvoerend-violet-oud/index.d.ts +503 -498
  32. package/dist/uitvoerend-violet-oud/index.js +504 -499
  33. package/dist/uitvoerend-violet-oud/index.json +503 -498
  34. package/dist/uitvoerend-violet-oud/index.tokens.json +1499 -1492
  35. package/dist/uitvoerend-violet-oud/root.css +611 -606
  36. package/dist/uitvoerend-violet-oud/tokens.d.ts +1391 -1384
  37. package/dist/uitvoerend-violet-oud/tokens.js +20013 -19906
  38. package/dist/wetgevend/_variables.scss +611 -606
  39. package/dist/wetgevend/index.css +611 -606
  40. package/dist/wetgevend/index.d.ts +503 -498
  41. package/dist/wetgevend/index.js +504 -499
  42. package/dist/wetgevend/index.json +503 -498
  43. package/dist/wetgevend/index.tokens.json +1515 -1508
  44. package/dist/wetgevend/root.css +611 -606
  45. package/dist/wetgevend/tokens.d.ts +1448 -1441
  46. package/dist/wetgevend/tokens.js +19953 -19846
  47. package/figma/figma.tokens.json +17 -13
  48. package/package.json +1 -1
  49. package/src/generated/base.tokens.json +1 -1
  50. package/src/generated/themes.json +16287 -16199
  51. package/src/generated/uitvoerend-mintgroen-focus/tokens.json +4060 -4038
  52. package/src/generated/uitvoerend-violet/tokens.json +4015 -3993
  53. package/src/generated/uitvoerend-violet-oud/tokens.json +3985 -3963
  54. package/src/generated/wetgevend/tokens.json +4018 -3996
@@ -1,1740 +1,1747 @@
1
1
  {
2
- "rhc": {
3
- "color": {
4
- "primary": {
5
- "50": "#eaf8f4",
6
- "100": "#d6f2e9",
7
- "200": "#C1EBDE",
8
- "300": "#ACE4D3",
9
- "400": "#98DDC8",
10
- "500": "#76d2b6",
11
- "hover": "#528e7c"
12
- },
13
- "focus": {
14
- "outline": "#76d2b6"
15
- },
16
- "foreground": {
17
- "default": "#0F172A",
18
- "subdued": "#334155",
19
- "onEmphasis": "#fff",
20
- "link": "#01689b"
21
- },
22
- "border": {
23
- "default": "#64748B",
24
- "subdued": "#94A3B8",
25
- "strong": "#0F172A"
26
- },
27
- "canvas": "#fff",
28
- "feedback": {
29
- "success": {
30
- "default": "#39870c",
31
- "subdued": "#e1eddb"
2
+ "utrecht": {
3
+ "pre-heading": {
4
+ "color": "#0F172A",
5
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
6
+ "font-weight": 700,
7
+ "line-height": "125%",
8
+ "font-size": "1rem"
9
+ },
10
+ "accordion": {
11
+ "button": {
12
+ "focus": {
13
+ "background-color": "#FDD370",
14
+ "border-color": "#154273",
15
+ "color": "#0F172A"
32
16
  },
33
- "info": {
34
- "default": "#007bc7",
35
- "subdued": "#d9ebf7"
17
+ "gap": "0.5rem",
18
+ "icon": {
19
+ "size": "24px"
36
20
  },
37
- "error": {
38
- "default": "#d52b1e",
39
- "subdued": "#f9dfdd"
21
+ "hover": {
22
+ "background-color": "#F8FAFC",
23
+ "border-color": "#94A3B8",
24
+ "color": "#0F172A"
40
25
  },
41
- "warning": {
42
- "default": "#ffb612",
43
- "subdued": "#fff4db"
26
+ "background-color": "#fff",
27
+ "border-color": "#94A3B8",
28
+ "border-width": 0,
29
+ "color": "#0F172A",
30
+ "active": {
31
+ "background-color": "#F1F5F9",
32
+ "border-color": "#94A3B8",
33
+ "color": "#0F172A",
34
+ "row-gap": 0
44
35
  }
45
36
  },
46
- "accent": {
47
- "500": "#8fcae7"
48
- },
49
- "cool-grey": {
50
- "50": "#F8FAFC",
51
- "100": "#F1F5F9",
52
- "200": "#E2E8F0",
53
- "300": "#CBD5E1",
54
- "400": "#94A3B8",
55
- "500": "#64748B",
56
- "600": "#475569",
57
- "700": "#334155",
58
- "800": "#1E293B",
59
- "900": "#0F172A"
60
- },
61
- "lichtblauw": {
62
- "50": "#eef7fb",
63
- "100": "#ddeff8",
64
- "200": "#CCE7F4",
65
- "300": "#BCDFF0",
66
- "400": "#ABD7ED",
67
- "500": "#8fcae7"
68
- },
69
- "violet": {
70
- "50": "#f2d9e7",
71
- "100": "#e5b3d0",
72
- "200": "#D88CB7",
73
- "300": "#CB66A0",
74
- "400": "#BE4088",
75
- "500": "#a90061"
76
- },
77
- "paars": {
78
- "50": "#e3dce7",
79
- "100": "#c6b9cf",
80
- "200": "#A995B7",
81
- "300": "#8D729F",
82
- "400": "#714f87",
83
- "500": "#42145f"
84
- },
85
- "hemelblauw": {
86
- "50": "#d9ebf7",
87
- "100": "#b3d7ee",
88
- "200": "#8CC3E6",
89
- "300": "#66AFDD",
90
- "400": "#409CD5",
91
- "500": "#007bc7"
92
- },
93
- "donkerblauw": {
94
- "50": "#d9e8f0",
95
- "100": "#b3d2e1",
96
- "200": "#8CBBD2",
97
- "300": "#66A4C3",
98
- "400": "#408EB4",
99
- "500": "#01689b"
100
- },
101
- "mintgroen": {
102
- "50": "#eaf8f4",
103
- "100": "#d6f2e9",
104
- "200": "#C1EBDE",
105
- "300": "#ACE4D3",
106
- "400": "#98DDC8",
107
- "500": "#76d2b6"
108
- },
109
- "mosgroen": {
110
- "50": "#ebebd9",
111
- "100": "#d6d7b3",
112
- "200": "#C1C38C",
113
- "300": "#ADAF66",
114
- "400": "#999C40",
115
- "500": "#777b00"
116
- },
117
- "groen": {
118
- "50": "#e1eddb",
119
- "100": "#c4dbb6",
120
- "200": "#A5C991",
121
- "300": "#88B76D",
122
- "400": "#6AA549",
123
- "500": "#39870c"
124
- },
125
- "donkergroen": {
126
- "50": "#dfe6e1",
127
- "100": "#becdc3",
128
- "200": "#9DB4A4",
129
- "300": "#7D9B87",
130
- "400": "#5D8269",
131
- "500": "#275937"
132
- },
133
- "bruin": {
134
- "50": "#efeada",
135
- "100": "#dfd4b6",
136
- "200": "#CFBF90",
137
- "300": "#BFA96C",
138
- "400": "#AF9447",
139
- "500": "#94710a"
140
- },
141
- "donkerbruin": {
142
- "50": "#e8e0df",
143
- "100": "#d1c2be",
144
- "200": "#BAA39D",
145
- "300": "#A3847D",
146
- "400": "#8D665D",
147
- "500": "#673327"
148
- },
149
- "geel": {
150
- "50": "#fefbdd",
151
- "100": "#fdf6bc",
152
- "200": "#FCF199",
153
- "300": "#FBED78",
154
- "400": "#FAE856",
155
- "500": "#f9e11e"
156
- },
157
- "donkergeel": {
158
- "50": "#fff4db",
159
- "100": "#ffe9b8",
160
- "200": "#FDDE94",
161
- "300": "#FDD370",
162
- "400": "#FDC84D",
163
- "500": "#ffb612"
164
- },
165
- "oranje": {
166
- "50": "#fbead9",
167
- "100": "#f6d4b3",
168
- "200": "#F1BE8C",
169
- "300": "#EDA966",
170
- "400": "#E89440",
171
- "500": "#e17000"
172
- },
173
- "rood": {
174
- "50": "#f9dfdd",
175
- "100": "#f2bfbc",
176
- "200": "#EC9F99",
177
- "300": "#E67F78",
178
- "400": "#DF6056",
179
- "500": "#d52b1e"
180
- },
181
- "roze": {
182
- "50": "#fdeff8",
183
- "100": "#fbdef0",
184
- "200": "#F8CEE8",
185
- "300": "#F6BDE1",
186
- "400": "#F4ADD9",
187
- "500": "#f092cd"
188
- },
189
- "robijnrood": {
190
- "50": "#f7d9e7",
191
- "100": "#efb3ce",
192
- "200": "#E78CB6",
193
- "300": "#DF669D",
194
- "400": "#D74085",
195
- "500": "#ca005d"
196
- },
197
- "lintblauw": {
198
- "50": "#dce3ea",
199
- "100": "#b8c6d5",
200
- "200": "#95a9c0",
201
- "300": "#738eab",
202
- "400": "#4f7196",
203
- "500": "#154273"
204
- },
205
- "wit": "#fff",
206
- "zwart": "#000",
207
- "none": "transparent"
208
- },
209
- "sub-nav-bar": {
210
- "background-color": "#f2f4f6",
211
- "column-gap": "0.5rem",
212
- "column-width": "375px",
213
- "padding-block-end": "2rem",
214
- "padding-block-start": "2rem",
215
- "inline-size": "100%",
216
- "content": {
37
+ "panel": {
38
+ "border-color": "#94A3B8",
39
+ "border-width": 0,
40
+ "padding-block-end": "1.5rem",
41
+ "padding-block-start": "1rem",
217
42
  "padding-inline-end": "1rem",
218
- "padding-inline-start": "1rem",
219
- "max-inline-size": "1280px",
220
- "list": {
221
- "row-gap": "0.5rem"
222
- }
43
+ "padding-inline-start": "1rem"
223
44
  }
224
45
  },
225
- "toggletip": {
226
- "color": "#fff",
227
- "background-color": "#007bc7",
228
- "border-color": "transparent",
229
- "border-radius": "5px",
230
- "border-width": "1px",
231
- "icon": {
232
- "size": "24px"
233
- },
234
- "size": "24px",
235
- "active": {
236
- "color": "#007bc7",
237
- "background-color": "#fff",
238
- "border-color": "#007bc7"
239
- },
240
- "hover": {
241
- "color": "#0F172A",
242
- "background-color": "#66AFDD"
243
- },
244
- "focus": {
46
+ "button": {
47
+ "primary-action": {
48
+ "focus": {
49
+ "background-color": "#FDD370",
50
+ "border-color": "transparent",
51
+ "color": "#fff"
52
+ },
53
+ "hover": {
54
+ "background-color": "#528e7c",
55
+ "border-color": "transparent",
56
+ "color": "#fff"
57
+ },
58
+ "background-color": "#76d2b6",
59
+ "border-color": "transparent",
245
60
  "color": "#fff",
246
- "background-color": "#007bc7"
247
- }
248
- },
249
- "sidenav": {
250
- "display": "flex",
251
- "link": {
252
- "line-height": "150%",
253
- "icon": {
254
- "size": "24px",
255
- "margin-inline": "0.5rem"
61
+ "disabled": {
62
+ "background-color": "#d6f2e9",
63
+ "border-color": "#C1EBDE",
64
+ "color": "#98DDC8"
65
+ },
66
+ "font-weight": 700,
67
+ "active": {
68
+ "background-color": "#477e6d",
69
+ "border-color": "transparent",
70
+ "color": "#fff"
256
71
  },
257
72
  "font-size": "1.25rem",
258
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
259
- "font-weight": 400,
260
- "current": {
261
- "font-weight": 700,
262
- "color": "#0F172A"
73
+ "line-height": "1.875rem"
74
+ },
75
+ "secondary-action": {
76
+ "focus": {
77
+ "background-color": "#FDD370",
78
+ "border-color": "transparent",
79
+ "color": "#76d2b6"
263
80
  },
264
- "color": "#01689b",
81
+ "hover": {
82
+ "background-color": "#d6f2e9",
83
+ "border-color": "transparent",
84
+ "color": "#76d2b6"
85
+ },
86
+ "background-color": "transparent",
87
+ "border-color": "#76d2b6",
88
+ "color": "#76d2b6",
89
+ "disabled": {
90
+ "background-color": "transparent",
91
+ "border-color": "#ACE4D3",
92
+ "color": "#ACE4D3"
93
+ },
94
+ "font-weight": 700,
265
95
  "active": {
266
- "color": "#42145f",
267
- "text-decoration": "underline"
96
+ "background-color": "#C1EBDE",
97
+ "border-color": "#76d2b6",
98
+ "color": "#76d2b6"
268
99
  },
100
+ "font-size": "1.25rem",
101
+ "line-height": "1.875rem"
102
+ },
103
+ "subtle": {
269
104
  "focus": {
270
- "border-radius": "5px",
271
- "border-width": "2px",
272
- "border-style": "solid",
273
- "border-color": "#154273",
274
- "background-color": "none",
275
- "color": "#01689b",
276
- "text-decoration": "None"
105
+ "background-color": "#FDD370",
106
+ "border-color": "transparent",
107
+ "color": "#76d2b6"
277
108
  },
109
+ "font-size": "1.25rem",
110
+ "font-weight": 700,
278
111
  "hover": {
279
- "color": "#15496a",
280
- "text-decoration": "underline"
112
+ "background-color": "transparent",
113
+ "border-color": "transparent",
114
+ "color": "#528e7c"
281
115
  },
282
- "padding-block-start": "0.75rem",
283
- "padding-block-end": "0.75rem",
284
- "text-decoration": "None",
285
- "column-gap": "0.5rem"
286
- }
287
- },
288
- "radio-group": {
116
+ "background-color": "transparent",
117
+ "border-color": "transparent",
118
+ "color": "#76d2b6",
119
+ "disabled": {
120
+ "background-color": "transparent",
121
+ "border-color": "transparent",
122
+ "color": "#d6f2e9"
123
+ },
124
+ "active": {
125
+ "background-color": "transparent",
126
+ "border-color": "transparent",
127
+ "color": "#477e6d"
128
+ },
129
+ "line-height": "1.875rem"
130
+ },
131
+ "background-color": "transparent",
132
+ "border-color": "#334155",
133
+ "color": "#334155",
134
+ "border-radius": "5px",
135
+ "border-width": "1px",
136
+ "icon": {
137
+ "gap": "0.5rem",
138
+ "size": "24px"
139
+ },
140
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
141
+ "font-size": "1.25rem",
142
+ "font-weight": 700,
143
+ "line-height": "150%",
289
144
  "padding-block-end": "0.5rem",
290
145
  "padding-block-start": "0.5rem",
291
- "row-gap": "1rem"
146
+ "padding-inline-end": "1rem",
147
+ "padding-inline-start": "1rem",
148
+ "disabled": {
149
+ "background-color": "#F8FAFC",
150
+ "border-color": "transparent",
151
+ "color": "#64748B"
152
+ },
153
+ "focus": {
154
+ "background-color": "#FDDE94",
155
+ "border-color": "transparent",
156
+ "color": "#1E293B"
157
+ },
158
+ "hover": {
159
+ "background-color": "#F8FAFC",
160
+ "border-color": "#1E293B",
161
+ "color": "#1E293B"
162
+ },
163
+ "active": {
164
+ "background-color": "#CBD5E1",
165
+ "border-color": "#0F172A",
166
+ "color": "#0F172A"
167
+ },
168
+ "min-block-size": "48px",
169
+ "min-inline-size": "48px",
170
+ "column-gap": "0.5rem"
292
171
  },
293
- "navigation-list": {
294
- "icon": {
295
- "background-color": "#0F172A",
296
- "border-radius": "999px",
297
- "color": "#fff"
172
+ "checkbox": {
173
+ "focus": {
174
+ "background-color": "#FDD370",
175
+ "border-color": "#154273",
176
+ "border-width": "2px"
298
177
  },
299
- "item": {
300
- "icon": {
301
- "padding-inline": "0.5rem",
302
- "padding-block": "0.5rem",
303
- "size": "24px"
178
+ "checked": {
179
+ "focus": {
180
+ "background-color": "#FDD370",
181
+ "border-width": "2px",
182
+ "border-color": "#154273",
183
+ "color": "#154273"
184
+ },
185
+ "background-color": "#154273",
186
+ "border-color": "transparent",
187
+ "color": "#fff",
188
+ "border-width": "1px",
189
+ "disabled": {
190
+ "background-color": "#CBD5E1",
191
+ "border-color": "#94A3B8",
192
+ "color": "#475569"
304
193
  },
305
- "content": {
306
- "font-size": "1.125rem",
307
- "column-gap": "0.5rem",
308
- "row-gap": "0.25rem"
194
+ "hover": {
195
+ "border-width": "1px",
196
+ "background-color": "#738eab",
197
+ "border-color": "transparent",
198
+ "color": "#fff"
309
199
  },
310
- "label": {
311
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
312
- "font-size": "1.875rem",
313
- "font-weight": 700,
314
- "line-height": "150%"
200
+ "active": {
201
+ "border-width": "1px",
202
+ "background-color": "#4f7196",
203
+ "border-color": "transparent",
204
+ "color": "#fff"
205
+ }
206
+ },
207
+ "border-radius": "2.5px",
208
+ "size": "24px",
209
+ "icon": {
210
+ "size": "24px"
211
+ },
212
+ "background-color": "#fff",
213
+ "border-color": "#154273",
214
+ "invalid": {
215
+ "background-color": "#f9dfdd",
216
+ "border-color": "#d52b1e",
217
+ "border-width": "1px"
218
+ },
219
+ "disabled": {
220
+ "background-color": "#CBD5E1",
221
+ "border-color": "#94A3B8"
222
+ },
223
+ "indeterminate": {
224
+ "background-color": "#154273",
225
+ "border-color": "transparent",
226
+ "color": "#fff",
227
+ "border-width": "1px",
228
+ "disabled": {
229
+ "background-color": "#CBD5E1",
230
+ "border-color": "#94A3B8",
231
+ "color": "#475569"
315
232
  },
316
233
  "active": {
317
- "background-color": "#F1F5F9"
234
+ "background-color": "#4f7196",
235
+ "border-color": "transparent",
236
+ "color": "#fff",
237
+ "border-width": "1px"
318
238
  },
319
239
  "hover": {
320
- "background-color": "#F8FAFC"
240
+ "background-color": "#738eab",
241
+ "border-color": "transparent",
242
+ "color": "#fff",
243
+ "border-width": "1px"
321
244
  },
322
245
  "focus": {
323
- "background-color": "#dce3ea"
324
- },
246
+ "background-color": "#fff",
247
+ "border-color": "#154273",
248
+ "color": "#154273",
249
+ "border-width": "2px"
250
+ }
251
+ },
252
+ "border-width": "1px",
253
+ "hover": {
254
+ "border-width": "1px",
325
255
  "background-color": "#fff",
326
- "color": "#334155",
256
+ "border-color": "#738eab"
257
+ },
258
+ "active": {
327
259
  "border-width": "1px",
328
- "border-color": "#CBD5E1",
329
- "heading": {
330
- "color": "#0F172A"
331
- },
332
- "column-gap": "1rem",
333
- "min-height": "48px",
334
- "padding-block": "0.75rem",
335
- "padding-inline": "1rem"
260
+ "background-color": "#fff",
261
+ "border-color": "#4f7196"
336
262
  }
337
263
  },
338
- "nav-bar": {
339
- "border-block-end-width": "1px",
340
- "max-inline-size": "1280px",
341
- "padding-inline": "1rem",
342
- "container": {
343
- "inline-size": "100%"
344
- },
345
- "content": {
346
- "column-gap": "1rem"
347
- },
348
- "icon": {
349
- "color": "#0F172A",
350
- "active": {
351
- "color": "#fff"
352
- },
353
- "size": "24px"
264
+ "radio-button": {
265
+ "focus": {
266
+ "background-color": "#FDD370",
267
+ "border-color": "#154273",
268
+ "border-width": "2px"
354
269
  },
355
- "link": {
356
- "active": {
357
- "background-color": "#76d2b6",
358
- "color": "#fff"
359
- },
360
- "background-color": "#fff",
361
- "color": "#76d2b6",
270
+ "checked": {
362
271
  "focus": {
363
- "background-color": "#eaf8f4",
364
- "color": "#76d2b6"
272
+ "background-color": "#FDD370",
273
+ "border-color": "#154273",
274
+ "color": "#154273",
275
+ "border-width": "2px"
365
276
  },
277
+ "background-color": "#154273",
278
+ "border-color": "transparent",
279
+ "color": "#fff",
366
280
  "hover": {
367
- "background-color": "#F8FAFC",
368
- "color": "#76d2b6"
369
- },
370
- "padding-block-end": "1rem",
371
- "padding-block-start": "1rem",
372
- "padding-inline-end": "0.75rem",
373
- "padding-inline-start": "0.75rem",
374
- "column-gap": "0.5rem"
375
- },
376
- "heading": {
377
- "font-weight": 700
378
- },
379
- "background-color": "#fff",
380
- "color": "#76d2b6",
381
- "border-color": "#98DDC8"
382
- },
383
- "message-list": {
384
- "item": {
385
- "background-color": "#fff",
386
- "border-color": "#CBD5E1",
387
- "border-width": "1px",
388
- "color": "#334155",
389
- "column-gap": "1rem",
390
- "icon": {
391
- "size": "24px",
392
- "color": "#0F172A"
281
+ "background-color": "#738eab",
282
+ "border-color": "transparent",
283
+ "color": "#fff",
284
+ "border-width": "1px"
393
285
  },
394
- "min-height": "48px",
395
- "padding-block": "0.75rem",
396
- "padding-inline": "1rem",
397
- "content": {
398
- "font-size": "1.125rem",
399
- "column-gap": "0.5rem",
400
- "row-gap": "0.5rem"
286
+ "active": {
287
+ "background-color": "#4f7196",
288
+ "border-color": "transparent",
289
+ "color": "#fff",
290
+ "border-width": "1px"
401
291
  },
402
- "label": {
403
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
404
- "font-size": "1.25rem",
405
- "font-weight": 700,
406
- "line-height": "150%"
292
+ "disabled": {
293
+ "background-color": "#CBD5E1",
294
+ "border-color": "#94A3B8",
295
+ "color": "#475569"
407
296
  },
408
- "heading": {
409
- "color": "#0F172A"
410
- }
411
- }
412
- },
413
- "logo": {
414
- "image": {
415
- "background-color": "#fff",
416
- "inline-size": "48px",
417
- "block-size": "96px",
418
- "color": "#154273"
297
+ "border-width": "1px"
419
298
  },
420
- "title": {
421
- "font-weight": 600,
422
- "line-height": "1.063rem",
423
- "font-size": "0.913rem",
424
- "padding-block-start": "3.125rem"
299
+ "active": {
300
+ "border-width": "1px",
301
+ "background-color": "#fff",
302
+ "border-color": "#4f7196"
425
303
  },
426
- "subtitle": {
427
- "font-weight": 400,
428
- "line-height": "1rem",
429
- "font-size": "0.775rem"
304
+ "size": "24px",
305
+ "dot": {
306
+ "size": "12px"
430
307
  },
431
- "column-gap": "12px",
432
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
433
- "color": "#154273"
434
- },
435
- "link-list-card": {
436
308
  "background-color": "#fff",
437
- "padding-block-start": "1.5rem",
438
- "padding-block-end": "1.5rem",
439
- "row-gap": "1rem",
440
- "padding-inline-start": "1.5rem",
441
- "padding-inline-end": "1.5rem"
442
- },
443
- "link-list": {
444
- "text-decoration": "None"
445
- },
446
- "icon-only-button": {
447
- "padding-block-end": "0.75rem",
448
- "padding-block-start": "0.75rem",
449
- "padding-inline-end": "0.75rem",
450
- "padding-inline-start": "0.75rem"
309
+ "border-color": "#154273",
310
+ "invalid": {
311
+ "background-color": "#f9dfdd",
312
+ "border-color": "#d52b1e",
313
+ "border-width": "1px"
314
+ },
315
+ "disabled": {
316
+ "background-color": "#CBD5E1",
317
+ "border-color": "#94A3B8",
318
+ "color": "#475569"
319
+ },
320
+ "hover": {
321
+ "background-color": "#fff",
322
+ "border-color": "#738eab",
323
+ "border-width": "1px"
324
+ },
325
+ "border-radius": "999px",
326
+ "border-width": "1px"
451
327
  },
452
- "hero": {
453
- "heading": {
454
- "font-weight": 700,
455
- "line-height": "125%",
456
- "font-size": "1.875rem",
457
- "font-family": "Fira Sans, Arial, Verdana, sans-serif"
328
+ "link": {
329
+ "focus": {
330
+ "background-color": "#FDD370",
331
+ "color": "#01689b",
332
+ "text-decoration": "None",
333
+ "text-decoration-thickness": "auto"
334
+ },
335
+ "color": "#01689b",
336
+ "text-decoration-color": "#01689b",
337
+ "active": {
338
+ "color": "#42145f",
339
+ "text-decoration": "None"
340
+ },
341
+ "hover": {
342
+ "color": "#01496c",
343
+ "text-decoration": "None",
344
+ "text-decoration-thickness": "auto"
458
345
  },
459
- "sub-heading": {
460
- "font-weight": 400,
461
- "line-height": "150%",
462
- "font-size": "1.25rem",
463
- "font-family": "Fira Sans, Arial, Verdana, sans-serif"
346
+ "visited": {
347
+ "color": "#42145f"
464
348
  },
465
- "message": {
466
- "background-color": "#154273",
467
- "color": "#fff",
468
- "row-gap": "0.125rem",
469
- "padding-block-end": "1rem",
470
- "padding-inline-end": "1rem",
471
- "padding-inline-start": "1rem",
472
- "padding-block-start": "1rem",
473
- "border-radius": "20px",
474
- "inline-size": "90%"
349
+ "text-decoration": "underline",
350
+ "icon": {
351
+ "inset-block-start": "0.25rem",
352
+ "size": "24px"
475
353
  },
476
- "border-radius": "40px",
477
- "inline-size": "100%"
478
- },
479
- "form-field-radio-option": {
480
- "column-gap": "0.5rem",
354
+ "column-gap": "0.25rem",
355
+ "text-decoration-thickness": "auto",
356
+ "text-underline-offset": "0.125rem",
357
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
481
358
  "font-weight": 400,
482
- "row-gap": "0.5rem",
483
- "label": {
484
- "margin-block-end": 0
485
- },
486
- "input": {
487
- "margin": {
488
- "block-start": "0.25rem"
489
- }
490
- }
491
- },
492
- "form-field-checkbox-option": {
493
- "column-gap": "0.5rem",
494
- "margin-block-end": 0
359
+ "font-size": "1.25rem",
360
+ "line-height": "150%"
495
361
  },
496
- "page-footer": {
497
- "column-gap": "1.5rem",
498
- "column-width": "200px",
499
- "column": {
500
- "title": {
501
- "margin-block-end": "0.75rem"
502
- }
362
+ "select": {
363
+ "focus": {
364
+ "background-color": "#FDD370",
365
+ "border-color": "#154273",
366
+ "color": "#0F172A",
367
+ "border-width": "2px"
503
368
  },
504
- "content": {
505
- "max-inline-size": "1280px",
506
- "padding-inline-start": "1rem",
507
- "padding-inline-end": "1rem",
508
- "column-gap": "2rem"
369
+ "image-background-position": "right 0.5rem center",
370
+ "icon": {
371
+ "size": "24px"
509
372
  },
510
- "border": {
511
- "block-start": {
512
- "width": "2px",
513
- "color": "#738eab",
514
- "style": "solid"
515
- }
373
+ "background-color": "#fff",
374
+ "border-color": "#154273",
375
+ "color": "#0F172A",
376
+ "invalid": {
377
+ "background-color": "#f9dfdd",
378
+ "border-color": "#d52b1e",
379
+ "color": "#0F172A",
380
+ "border-width": "1px"
516
381
  },
517
- "outlined": {
518
- "background-color": "#fff",
519
- "color": "#76d2b6",
520
- "border": {
521
- "color": "#76d2b6"
522
- }
382
+ "disabled": {
383
+ "background-color": "#CBD5E1",
384
+ "border-color": "#94A3B8",
385
+ "color": "#475569"
523
386
  },
524
- "padding": {
525
- "block-start": "2.5rem",
526
- "block-end": "2.5rem",
527
- "inline-start": "2.5rem",
528
- "inline-end": "2.5rem"
387
+ "hover": {
388
+ "background-color": "#fff",
389
+ "border-color": "#738eab",
390
+ "color": "#0F172A",
391
+ "border-width": "1px"
529
392
  },
530
- "flex": {
531
- "direction": "column"
532
- }
533
- },
534
- "file-input": {
535
- "column-gap": "0.75rem",
536
- "row-gap": "0.75rem",
537
- "feedback": {
538
- "color": "#475569",
539
- "font-size": "1rem"
540
- }
541
- },
542
- "file": {
543
- "border-style": "solid",
544
- "border-color": "#154273",
393
+ "padding-block-end": "0.5rem",
394
+ "padding-block-start": "0.5rem",
395
+ "padding-inline-end": "0.75rem",
396
+ "padding-inline-start": "0.75rem",
397
+ "border-radius": "2.5px",
398
+ "border-bottom-width": "auto",
545
399
  "border-width": "1px",
546
- "border-radius": "5px",
547
- "padding-inline-start": "1rem",
548
- "padding-inline-end": "1rem",
549
- "padding-block-start": "0.75rem",
550
- "padding-block-end": "0.75rem",
551
- "column-gap": "0.25rem",
552
- "error": {
553
- "border-color": "#d52b1e"
554
- },
555
- "subtitle": {
556
- "color": "#64748B"
557
- }
558
- },
559
- "dot-badge": {
560
- "border-radius": "999px",
561
- "color": "#d52b1e",
562
- "size": "12px"
563
- },
564
- "code-input": {
565
- "size": "48px"
566
- },
567
- "code-input-group": {
568
- "column-gap": "0.5rem"
400
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
401
+ "font-weight": 400,
402
+ "line-height": "150%",
403
+ "font-size": "1.25rem",
404
+ "max-inline-size": "400px"
569
405
  },
570
- "checkbox-group": {
406
+ "textarea": {
407
+ "focus": {
408
+ "background-color": "#FDD370",
409
+ "border-color": "#154273",
410
+ "color": "#0F172A",
411
+ "border-width": "2px"
412
+ },
413
+ "max-inline-size": "400px",
571
414
  "padding-block-end": "0.5rem",
572
415
  "padding-block-start": "0.5rem",
573
- "row-gap": "1rem"
574
- },
575
- "card-as-link": {
416
+ "padding-inline-end": "0.75rem",
417
+ "padding-inline-start": "0.75rem",
576
418
  "background-color": "#fff",
577
- "border-color": "#CBD5E1",
578
- "border-radius": "5px",
579
- "border-width": "1px",
419
+ "border-color": "#154273",
580
420
  "color": "#0F172A",
581
- "column-gap": "1rem",
582
- "inline-size": "328px",
583
- "icon": {
421
+ "invalid": {
422
+ "background-color": "#f9dfdd",
423
+ "border-color": "#d52b1e",
584
424
  "color": "#0F172A",
585
- "size": "24px"
425
+ "border-width": "1px"
586
426
  },
587
- "link": {
588
- "color": "#01689b",
589
- "text-decoration": "underline",
590
- "active": {
591
- "text-decoration": "none"
592
- },
593
- "hover": {
594
- "text-decoration": "none"
595
- },
596
- "focus": {
597
- "text-decoration": "none"
598
- }
427
+ "placeholder": {
428
+ "color": "#64748B"
599
429
  },
600
- "metadata": {
601
- "color": "#0F172A"
430
+ "disabled": {
431
+ "background-color": "#CBD5E1",
432
+ "border-color": "#94A3B8",
433
+ "color": "#475569"
602
434
  },
603
- "padding-block-end": "1rem",
604
- "padding-block-start": "1rem",
605
- "padding-inline-end": "1rem",
606
- "padding-inline-start": "1rem",
607
- "row-gap": "0.75rem",
608
- "active": {
435
+ "read-only": {
609
436
  "background-color": "#F1F5F9",
610
- "text-decoration": "underline"
437
+ "border-color": "transparent",
438
+ "color": "#0F172A"
611
439
  },
612
440
  "hover": {
613
- "background-color": "#F8FAFC",
614
- "text-decoration": "underline"
441
+ "background-color": "#fff",
442
+ "border-color": "#738eab",
443
+ "color": "#0F172A",
444
+ "border-width": "1px"
615
445
  },
446
+ "border-radius": "2.5px",
447
+ "border-bottom-width": "1px",
448
+ "border-width": "1px",
449
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
450
+ "font-weight": 400,
451
+ "line-height": "150%",
452
+ "font-size": "1.25rem"
453
+ },
454
+ "textbox": {
616
455
  "focus": {
617
- "background-color": "#dce3ea",
618
- "text-decoration": "underline"
456
+ "background-color": "#FDD370",
457
+ "border-width": "2px",
458
+ "border-color": "#154273",
459
+ "color": "#0F172A"
460
+ },
461
+ "border-radius": "2.5px",
462
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
463
+ "font-size": "1.25rem",
464
+ "font-weight": 400,
465
+ "line-height": "150%",
466
+ "max-inline-size": "400px",
467
+ "padding-block-end": "0.5rem",
468
+ "padding-block-start": "0.5rem",
469
+ "padding-inline-end": "0.75rem",
470
+ "padding-inline-start": "0.75rem",
471
+ "background-color": "#fff",
472
+ "border-color": "#154273",
473
+ "color": "#0F172A",
474
+ "invalid": {
475
+ "background-color": "#f9dfdd",
476
+ "border-color": "#d52b1e",
477
+ "color": "#0F172A",
478
+ "border-width": "1px"
479
+ },
480
+ "placeholder": {
481
+ "color": "#64748B"
482
+ },
483
+ "border-block-end-width": "auto",
484
+ "border-width": "1px",
485
+ "disabled": {
486
+ "background-color": "#CBD5E1",
487
+ "border-color": "#94A3B8",
488
+ "color": "#475569"
619
489
  },
620
- "full-bleed": {
621
- "background-color": "#000",
490
+ "read-only": {
491
+ "background-color": "#F1F5F9",
622
492
  "border-color": "transparent",
623
- "color": "#fff",
624
- "opacity": 0.5
493
+ "color": "#0F172A"
625
494
  },
626
- "heading": {
627
- "padding-block-start": "0.5rem",
628
- "font-size": "1.5rem",
629
- "font-weight": 700
495
+ "hover": {
496
+ "border-width": "1px",
497
+ "background-color": "#fff",
498
+ "border-color": "#738eab",
499
+ "color": "#0F172A"
500
+ }
501
+ },
502
+ "counter-badge": {
503
+ "background-color": "#FDD370"
504
+ },
505
+ "skip-link": {
506
+ "focus": {
507
+ "background-color": "#FDD370"
508
+ }
509
+ },
510
+ "icon": {
511
+ "color": "inherit",
512
+ "size": "24px",
513
+ "inset-block-start": 0
514
+ },
515
+ "unordered-list": {
516
+ "padding-inline-start": "1.5rem",
517
+ "margin-block-end": "0.25rem",
518
+ "margin-block-start": "0.25rem",
519
+ "color": "#0F172A",
520
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
521
+ "font-weight": 400,
522
+ "font-size": "1.25rem",
523
+ "line-height": "150%",
524
+ "item": {
525
+ "padding-inline-start": "0.5rem",
526
+ "margin-block-end": "0.25rem",
527
+ "margin-block-start": "0.25rem"
630
528
  },
631
- "horizontal": {
632
- "background-color": "#154273",
633
- "border-color": "transparent",
634
- "color": "#fff",
635
- "max-block-size": "96px",
636
- "padding-block-end": 0,
637
- "padding-block-start": 0,
638
- "padding-inline-end": "1rem",
639
- "padding-inline-start": "1rem",
640
- "heading": {
641
- "inline-size": "200px"
642
- }
529
+ "marker": {
530
+ "color": "#0F172A",
531
+ "border-color": "#0F172A"
643
532
  }
644
533
  },
645
- "accordion": {
646
- "button": {
647
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
648
- "font-size": "1.25rem",
649
- "font-weight": 400,
534
+ "table": {
535
+ "header-cell": {
650
536
  "line-height": "150%",
651
- "icon": {
652
- "margin-block": "0.25rem"
653
- },
537
+ "color": "#0F172A",
538
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
539
+ "font-weight": 700,
540
+ "font-size": "1.25rem"
541
+ },
542
+ "caption": {
543
+ "line-height": "125%",
544
+ "margin-block-end": "1.5rem",
545
+ "color": "#0F172A",
546
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
547
+ "font-weight": 700,
548
+ "font-size": "1.875rem"
549
+ },
550
+ "cell": {
654
551
  "padding-block-end": "0.75rem",
655
552
  "padding-block-start": "0.75rem",
656
553
  "padding-inline-end": "1rem",
657
554
  "padding-inline-start": "1rem",
658
- "expanded": {
659
- "background-color": "#fff",
660
- "color": "#0F172A"
661
- }
555
+ "line-height": "150%"
662
556
  },
663
- "section": {
664
- "border-block-end-width": "1px",
665
- "border-width": 0,
666
- "border-color": "#94A3B8"
557
+ "data-cell": {
558
+ "color": "#0F172A",
559
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
560
+ "font-weight": 400,
561
+ "line-height": "150%",
562
+ "font-size": "1.25rem"
667
563
  },
668
564
  "header": {
669
- "margin": 0
565
+ "border-block-end-width": "2px",
566
+ "border-block-end-color": "#CBD5E1",
567
+ "background-color": "transparent"
670
568
  },
671
- "border-radius": "0px",
672
- "color": "#0F172A"
673
- },
674
- "keep": {
675
- "top-left": {
676
- "borderRadiusTopLeft": "48px",
677
- "borderRadiusTopRight": 0,
678
- "borderRadiusBottomRight": 0,
679
- "borderRadiusBottomLeft": 0
569
+ "footer": {
570
+ "border-block-end-width": "1px",
571
+ "border-block-end-color": "#CBD5E1",
572
+ "background-color": "transparent"
680
573
  },
681
- "top-right": {
682
- "borderRadiusTopRight": "48px",
683
- "borderRadiusTopLeft": 0,
684
- "borderRadiusBottomRight": 0,
685
- "borderRadiusBottomLeft": 0
574
+ "row": {
575
+ "border-block-end-width": "1px",
576
+ "border-block-end-color": "#CBD5E1",
577
+ "background-color": "transparent"
686
578
  },
687
- "bottom-right": {
688
- "borderRadiusTopLeft": 0,
689
- "borderRadiusTopRight": 0,
690
- "borderRadiusBottomRight": "48px",
691
- "borderRadiusBottomLeft": 0
579
+ "footer-cell": {
580
+ "font-weight": 700,
581
+ "font-size": "1.25rem",
582
+ "color": "#0F172A",
583
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
584
+ "line-height": "150%"
692
585
  },
693
- "bottom-left": {
694
- "borderRadiusTopLeft": 0,
695
- "borderRadiusTopRight": 0,
696
- "borderRadiusBottomRight": 0,
697
- "borderRadiusBottomLeft": "48px"
698
- }
699
- },
700
- "border-radius": {
701
- "sm": "2.5px",
702
- "md": "5px",
703
- "keep": "48px",
704
- "circle": "999px",
705
- "none": "0px"
586
+ "container": {
587
+ "box-inline-end-shadow": {
588
+ "x": 0,
589
+ "y": "16px",
590
+ "blur": "48px",
591
+ "spread": 0,
592
+ "color": "#0000001a"
593
+ },
594
+ "box-inline-start-shadow": {
595
+ "x": 0,
596
+ "y": "16px",
597
+ "blur": "48px",
598
+ "spread": 0,
599
+ "color": "#0000001a"
600
+ }
601
+ },
602
+ "font-size": "1.25rem"
706
603
  },
707
- "focus": {
708
- "outline-offset": "0.125rem",
709
- "outline-style": "solid",
710
- "outline-width": "2px"
604
+ "separator": {
605
+ "color": "#CBD5E1",
606
+ "block-size": "2px",
607
+ "margin-block-end": "0.75rem",
608
+ "margin-block-start": "0.75rem"
711
609
  },
712
- "font-size": {
713
- "heading": {
714
- "level-1": "3.125rem",
715
- "level-2": "2.5rem",
716
- "level-3": "1.875rem",
717
- "level-4": "1.5rem",
718
- "level-5": "1.25rem"
719
- },
720
- "paragraph": {
721
- "intro": "1.5rem",
722
- "default": "1.25rem",
723
- "small": "1.125rem"
610
+ "ordered-list": {
611
+ "padding-inline-start": "1.5rem",
612
+ "margin-block-end": "0.25rem",
613
+ "margin-block-start": "0.25rem",
614
+ "margin-inline-start": "0.625rem",
615
+ "item": {
616
+ "padding-inline-start": 0,
617
+ "margin-block-end": "0.25rem",
618
+ "margin-block-start": "0.25rem"
724
619
  },
725
- "xs": {
726
- "desktop": "1.25rem",
727
- "tablet": "1.125rem",
728
- "mobile": "1rem"
620
+ "color": "#0F172A",
621
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
622
+ "font-weight": 400,
623
+ "font-size": "1.25rem",
624
+ "line-height": "150%"
625
+ },
626
+ "link-list": {
627
+ "margin-block-start": 0,
628
+ "row-gap": "0.5rem",
629
+ "margin-block-end": 0,
630
+ "item": {
631
+ "column-gap": "0.5rem",
632
+ "text-decoration": "None"
729
633
  },
730
- "sm": {
731
- "desktop": "1.5rem",
732
- "tablet": "1.35rem",
733
- "mobile": "1.2rem"
634
+ "icon": {
635
+ "size": "24px",
636
+ "inset-block-start": "0.188rem"
637
+ }
638
+ },
639
+ "form-label": {
640
+ "color": "#0F172A",
641
+ "font-size": "1.25rem",
642
+ "font-weight": 700
643
+ },
644
+ "form-field-label": {
645
+ "color": "#0F172A",
646
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
647
+ "font-size": "1.25rem",
648
+ "font-weight": 700,
649
+ "line-height": "150%"
650
+ },
651
+ "form-field-error-message": {
652
+ "icon": {
653
+ "size": "24px",
654
+ "margin-inline-end": "0.5rem"
734
655
  },
735
- "md": {
736
- "desktop": "1.875rem",
737
- "tablet": "1.688rem",
738
- "mobile": "1.5rem"
656
+ "color": "#d52b1e",
657
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
658
+ "font-size": "1.25rem",
659
+ "font-weight": 400,
660
+ "margin-block-end": "0.5rem",
661
+ "padding-block-end": "0.5rem"
662
+ },
663
+ "form-field-description": {
664
+ "color": "#334155",
665
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
666
+ "font-size": "1.25rem",
667
+ "line-height": "150%",
668
+ "margin-block-start": "-0.5rem",
669
+ "margin-block-end": "0.5rem",
670
+ "padding-block-end": "0.5rem"
671
+ },
672
+ "form-field": {
673
+ "margin-block-start": "0.5rem",
674
+ "margin-block-end": "0.5rem",
675
+ "invalid": {
676
+ "border-inline-start-color": "#d52b1e",
677
+ "border-inline-start-width": "0px",
678
+ "padding-inline-start": 0
739
679
  },
740
- "lg": {
741
- "desktop": "2.5rem",
742
- "tablet": "2.25rem",
743
- "mobile": "2rem"
680
+ "label": {
681
+ "margin-block-end": "0.5rem"
744
682
  },
745
- "xl": {
746
- "desktop": "3.125rem",
747
- "tablet": "2.813rem",
748
- "mobile": "2.5rem"
683
+ "error-message": {
684
+ "line-height": "normal"
749
685
  }
750
686
  },
751
- "line-height": {
752
- "paragraph": "150%",
753
- "sm": "125%",
754
- "md": "150%"
687
+ "page-footer": {
688
+ "background-color": "#154273",
689
+ "color": "#fff",
690
+ "padding-block-start": "3rem",
691
+ "padding-block-end": "3rem",
692
+ "padding-inline-start": "80px",
693
+ "padding-inline-end": "80px"
755
694
  },
756
- "size": {
757
- "target": "48px",
758
- "icon": {
759
- "functional": "24px"
695
+ "figure": {
696
+ "caption": {
697
+ "border-color": "#CBD5E1",
698
+ "border-width": "4px",
699
+ "color": "#76d2b6",
700
+ "padding-block-end": "0.5rem",
701
+ "padding-block-start": "0.5rem",
702
+ "padding-inline-start": "1rem",
703
+ "line-height": "150%",
704
+ "font-size": "1.25rem"
760
705
  },
761
- "quarter-lint": "12px",
762
- "half-lint": "24px",
763
- "lint": "48px",
764
- "2-lint": "96px",
765
- "3-lint": "1440px"
766
- },
767
- "font-weight": {
768
- "extra-bold": 800,
769
- "bold": 700,
770
- "semi-bold": 550,
771
- "regular": 400,
772
- "chosen-regular": 400,
773
- "light": 300,
774
- "thin": 200
775
- },
776
- "font-family": {
777
- "primary": "Fira Sans, Arial, Verdana, sans-serif",
778
- "secondary": "RijksoverheidSerifWeb, 'Times New Roman', serif"
779
- },
780
- "border-width": {
781
- "default": "1px",
782
- "m": "2px",
783
- "none": "0px"
706
+ "img": {
707
+ "border-end-end-radius": 0,
708
+ "border-end-start-radius": 0,
709
+ "border-start-end-radius": 0,
710
+ "border-start-start-radius": 0
711
+ }
784
712
  },
785
- "space": {
786
- "0": 0,
787
- "25": "0.125rem",
788
- "50": "0.25rem",
789
- "100": "0.5rem",
790
- "150": "0.75rem",
791
- "200": "1rem",
792
- "300": "1.5rem",
793
- "400": "2rem",
794
- "500": "2.5rem",
795
- "600": "3rem",
796
- "700": "3.5rem"
797
- }
798
- },
799
- "utrecht": {
800
- "accordion": {
801
- "button": {
802
- "focus": {
803
- "background-color": "#FDD370",
804
- "border-color": "#154273",
805
- "color": "#0F172A"
806
- },
807
- "gap": "0.5rem",
808
- "icon": {
809
- "size": "24px"
810
- },
811
- "hover": {
812
- "background-color": "#F8FAFC",
813
- "border-color": "#94A3B8",
814
- "color": "#0F172A"
815
- },
816
- "background-color": "#fff",
817
- "border-color": "#94A3B8",
818
- "border-width": 0,
713
+ "form-fieldset": {
714
+ "legend": {
819
715
  "color": "#0F172A",
820
- "active": {
821
- "background-color": "#F1F5F9",
822
- "border-color": "#94A3B8",
823
- "color": "#0F172A",
824
- "row-gap": 0
716
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
717
+ "font-size": "1.25rem",
718
+ "font-weight": 700,
719
+ "line-height": "150%",
720
+ "disabled": {
721
+ "color": "#334155"
825
722
  }
826
723
  },
827
- "panel": {
828
- "border-color": "#94A3B8",
829
- "border-width": 0,
830
- "padding-block-end": "1.5rem",
831
- "padding-block-start": "1rem",
832
- "padding-inline-end": "1rem",
833
- "padding-inline-start": "1rem"
724
+ "section": {
725
+ "background-color": "transparent",
726
+ "color": "#0F172A"
727
+ },
728
+ "invalid": {
729
+ "border-inline-start": {
730
+ "color": "#d52b1e"
731
+ },
732
+ "padding-inline-start": 0,
733
+ "border-inline-start-width": "0px"
834
734
  }
835
735
  },
836
- "button": {
837
- "primary-action": {
838
- "focus": {
839
- "background-color": "#FDD370",
840
- "border-color": "transparent",
841
- "color": "#fff"
842
- },
843
- "hover": {
844
- "background-color": "#528e7c",
845
- "border-color": "transparent",
846
- "color": "#fff"
847
- },
848
- "background-color": "#76d2b6",
849
- "border-color": "transparent",
850
- "color": "#fff",
851
- "disabled": {
852
- "background-color": "#d6f2e9",
853
- "border-color": "#C1EBDE",
854
- "color": "#98DDC8"
736
+ "button-group": {
737
+ "background-color": "transparent",
738
+ "column-gap": "0.5rem",
739
+ "margin-block-end": "0px",
740
+ "margin-block-start": "0px",
741
+ "padding-block-end": "0px",
742
+ "padding-block-start": "0px",
743
+ "row-gap": "0.5rem"
744
+ },
745
+ "breadcrumb-nav": {
746
+ "line-height": 1.4,
747
+ "font-size": "1.25rem",
748
+ "link": {
749
+ "icon": {
750
+ "size": "24px",
751
+ "margin-inline": "0.25rem",
752
+ "inset-block-start": 0
855
753
  },
856
- "font-weight": 700,
754
+ "padding-block-end": "0.75rem",
755
+ "padding-block-start": "0.75rem",
756
+ "padding-inline-end": 0,
757
+ "padding-inline-start": 0,
758
+ "color": "#01689b",
857
759
  "active": {
858
- "background-color": "#477e6d",
859
- "border-color": "transparent",
860
- "color": "#fff"
760
+ "color": "#42145f",
761
+ "text-decoration": "None"
861
762
  },
862
- "font-size": "1.25rem",
863
- "line-height": "1.875rem"
864
- },
865
- "secondary-action": {
866
763
  "focus": {
867
- "background-color": "#FDD370",
868
- "border-color": "transparent",
869
- "color": "#76d2b6"
870
- },
871
- "hover": {
872
- "background-color": "#d6f2e9",
873
- "border-color": "transparent",
874
- "color": "#76d2b6"
875
- },
876
- "background-color": "transparent",
877
- "border-color": "#76d2b6",
878
- "color": "#76d2b6",
879
- "disabled": {
880
764
  "background-color": "transparent",
881
- "border-color": "#ACE4D3",
882
- "color": "#ACE4D3"
883
- },
884
- "font-weight": 700,
885
- "active": {
886
- "background-color": "#C1EBDE",
887
- "border-color": "#76d2b6",
888
- "color": "#76d2b6"
889
- },
890
- "font-size": "1.25rem",
891
- "line-height": "1.875rem"
892
- },
893
- "subtle": {
894
- "focus": {
895
- "background-color": "#FDD370",
896
- "border-color": "transparent",
897
- "color": "#76d2b6"
765
+ "color": "#01689b",
766
+ "text-decoration": "None"
898
767
  },
899
- "font-size": "1.25rem",
900
- "font-weight": 700,
901
768
  "hover": {
902
- "background-color": "transparent",
903
- "border-color": "transparent",
904
- "color": "#528e7c"
905
- },
906
- "background-color": "transparent",
907
- "border-color": "transparent",
908
- "color": "#76d2b6",
909
- "disabled": {
910
- "background-color": "transparent",
911
- "border-color": "transparent",
912
- "color": "#d6f2e9"
769
+ "color": "#01496c",
770
+ "text-decoration": "None"
913
771
  },
914
- "active": {
915
- "background-color": "transparent",
916
- "border-color": "transparent",
917
- "color": "#477e6d"
772
+ "current": {
773
+ "color": "#334155"
918
774
  },
919
- "line-height": "1.875rem"
775
+ "text-decoration": "underline"
920
776
  },
921
- "background-color": "transparent",
922
- "border-color": "#334155",
923
- "color": "#334155",
924
- "border-radius": "5px",
925
- "border-width": "1px",
926
- "icon": {
927
- "gap": "0.5rem",
928
- "size": "24px"
777
+ "divider": {
778
+ "size": "24px",
779
+ "color": "#334155",
780
+ "inset-block-start": 0
929
781
  },
782
+ "margin-inline": "0.5rem",
930
783
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
931
- "font-size": "1.25rem",
932
- "font-weight": 700,
933
- "line-height": "150%",
934
- "padding-block-end": "0.5rem",
935
- "padding-block-start": "0.5rem",
936
- "padding-inline-end": "1rem",
937
- "padding-inline-start": "1rem",
938
- "disabled": {
939
- "background-color": "#F8FAFC",
940
- "border-color": "transparent",
941
- "color": "#64748B"
784
+ "font-weight": 400
785
+ },
786
+ "blockquote": {
787
+ "caption": {
788
+ "font-size": "1.25rem",
789
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
790
+ "line-height": "150%",
791
+ "font-weight": 400,
792
+ "padding-block-start": "0.75rem",
793
+ "color": "#334155"
942
794
  },
943
- "focus": {
944
- "background-color": "#FDDE94",
945
- "border-color": "transparent",
946
- "color": "#1E293B"
795
+ "content": {
796
+ "font-family": "RijksoverheidSerifWeb, 'Times New Roman', serif",
797
+ "line-height": "150%",
798
+ "font-weight": 400,
799
+ "font-size": "1.5rem",
800
+ "color": "#0F172A"
947
801
  },
948
- "hover": {
949
- "background-color": "#F8FAFC",
950
- "border-color": "#1E293B",
951
- "color": "#1E293B"
802
+ "margin-block-end": 0,
803
+ "margin-block-start": 0,
804
+ "margin-inline-end": 0,
805
+ "margin-inline-start": 0,
806
+ "padding-block-end": "2rem",
807
+ "padding-block-start": "2rem",
808
+ "padding-inline-end": "2rem",
809
+ "padding-inline-start": "2rem",
810
+ "row-gap": "0.75rem",
811
+ "background-color": "transparent",
812
+ "border-color": "#76d2b6",
813
+ "border-block-start-width": 0,
814
+ "border-block-end-width": 0,
815
+ "border-inline-start-width": 0,
816
+ "border-inline-end-width": 0,
817
+ "border-start-start-radius": 0,
818
+ "border-start-end-radius": 0,
819
+ "border-end-start-radius": 0,
820
+ "border-end-end-radius": 0,
821
+ "border-width": "2px",
822
+ "blue-corner-border-variation": {
823
+ "border-color": "#76d2b6",
824
+ "border-block-end-width": "2px",
825
+ "border-inline-end-width": "2px",
826
+ "border-end-end-radius": "3rem"
952
827
  },
953
- "active": {
954
- "background-color": "#CBD5E1",
955
- "border-color": "#0F172A",
956
- "color": "#0F172A"
828
+ "pink-background-variation": {
829
+ "background-color": "#F6BDE1",
830
+ "border-end-start-radius": "3rem",
831
+ "padding": "2.5rem"
957
832
  },
958
- "min-block-size": "48px",
959
- "min-inline-size": "48px",
960
- "column-gap": "0.5rem"
833
+ "pink-left-border-variation": {
834
+ "border-color": "#F6BDE1",
835
+ "border-inline-start-width": "0.75rem",
836
+ "padding-inline-start": "2.5rem",
837
+ "padding-inline-end": "2.5rem",
838
+ "padding-block-start": "1.5rem",
839
+ "padding-block-end": "1.5rem"
840
+ },
841
+ "pink-corner-border-variation": {
842
+ "border-color": "#F6BDE1",
843
+ "border-block-start-width": "0.25rem",
844
+ "border-inline-start-width": "0.25rem",
845
+ "border-start-start-radius": "3rem",
846
+ "padding": "2.5rem"
847
+ }
961
848
  },
962
- "checkbox": {
963
- "focus": {
964
- "background-color": "#FDD370",
965
- "border-color": "#154273",
966
- "border-width": "2px"
849
+ "article": {
850
+ "max-inline-size": "75ch"
851
+ },
852
+ "alert": {
853
+ "heading": {
854
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
855
+ "font-weight": 700,
856
+ "line-height": "150%",
857
+ "font-size": "1.25rem"
967
858
  },
968
- "checked": {
969
- "focus": {
970
- "background-color": "#FDD370",
971
- "border-width": "2px",
972
- "border-color": "#154273",
973
- "color": "#154273"
974
- },
975
- "background-color": "#154273",
859
+ "column-gap": "0.5rem",
860
+ "border-width": "0px",
861
+ "margin-block-end": "0.75rem",
862
+ "margin-block-start": "0.75rem",
863
+ "padding-block-end": "1rem",
864
+ "padding-block-start": "1rem",
865
+ "padding-inline-end": "1rem",
866
+ "padding-inline-start": "1rem",
867
+ "background-color": "#d9ebf7",
868
+ "border-color": "transparent",
869
+ "color": "#0F172A",
870
+ "info": {
871
+ "background-color": "#d9ebf7",
976
872
  "border-color": "transparent",
977
- "color": "#fff",
978
- "border-width": "1px",
979
- "disabled": {
980
- "background-color": "#CBD5E1",
981
- "border-color": "#94A3B8",
982
- "color": "#475569"
983
- },
984
- "hover": {
985
- "border-width": "1px",
986
- "background-color": "#738eab",
987
- "border-color": "transparent",
988
- "color": "#fff"
989
- },
990
- "active": {
991
- "border-width": "1px",
992
- "background-color": "#4f7196",
993
- "border-color": "transparent",
994
- "color": "#fff"
995
- }
996
- },
997
- "border-radius": "2.5px",
998
- "size": "24px",
999
- "icon": {
1000
- "size": "24px"
873
+ "color": "#0F172A"
1001
874
  },
1002
- "background-color": "#fff",
1003
- "border-color": "#154273",
1004
- "invalid": {
875
+ "error": {
1005
876
  "background-color": "#f9dfdd",
1006
- "border-color": "#d52b1e",
1007
- "border-width": "1px"
1008
- },
1009
- "disabled": {
1010
- "background-color": "#CBD5E1",
1011
- "border-color": "#94A3B8"
1012
- },
1013
- "indeterminate": {
1014
- "background-color": "#154273",
1015
877
  "border-color": "transparent",
1016
- "color": "#fff",
1017
- "border-width": "1px",
1018
- "disabled": {
1019
- "background-color": "#CBD5E1",
1020
- "border-color": "#94A3B8",
1021
- "color": "#475569"
1022
- },
1023
- "active": {
1024
- "background-color": "#4f7196",
1025
- "border-color": "transparent",
1026
- "color": "#fff",
1027
- "border-width": "1px"
1028
- },
1029
- "hover": {
1030
- "background-color": "#738eab",
1031
- "border-color": "transparent",
1032
- "color": "#fff",
1033
- "border-width": "1px"
1034
- },
1035
- "focus": {
1036
- "background-color": "#fff",
1037
- "border-color": "#154273",
1038
- "color": "#154273",
1039
- "border-width": "2px"
1040
- }
878
+ "color": "#0F172A"
1041
879
  },
1042
- "border-width": "1px",
1043
- "hover": {
1044
- "border-width": "1px",
1045
- "background-color": "#fff",
1046
- "border-color": "#738eab"
880
+ "ok": {
881
+ "background-color": "#e1eddb",
882
+ "border-color": "transparent",
883
+ "color": "#0F172A"
1047
884
  },
1048
- "active": {
1049
- "border-width": "1px",
1050
- "background-color": "#fff",
1051
- "border-color": "#4f7196"
1052
- }
1053
- },
1054
- "radio-button": {
1055
- "focus": {
1056
- "background-color": "#FDD370",
1057
- "border-color": "#154273",
1058
- "border-width": "2px"
885
+ "warning": {
886
+ "background-color": "#fff4db",
887
+ "border-color": "transparent",
888
+ "color": "#0F172A"
1059
889
  },
1060
- "checked": {
1061
- "focus": {
1062
- "background-color": "#FDD370",
1063
- "border-color": "#154273",
1064
- "color": "#154273",
1065
- "border-width": "2px"
890
+ "icon": {
891
+ "inset-block-start": "3px",
892
+ "info": {
893
+ "color": "#007bc7"
1066
894
  },
1067
- "background-color": "#154273",
1068
- "border-color": "transparent",
1069
- "color": "#fff",
1070
- "hover": {
1071
- "background-color": "#738eab",
1072
- "border-color": "transparent",
1073
- "color": "#fff",
1074
- "border-width": "1px"
895
+ "error": {
896
+ "color": "#d52b1e"
1075
897
  },
1076
- "active": {
1077
- "background-color": "#4f7196",
1078
- "border-color": "transparent",
1079
- "color": "#fff",
1080
- "border-width": "1px"
898
+ "ok": {
899
+ "color": "#39870c"
1081
900
  },
1082
- "disabled": {
1083
- "background-color": "#CBD5E1",
1084
- "border-color": "#94A3B8",
1085
- "color": "#475569"
901
+ "warning": {
902
+ "color": "#ffb612"
1086
903
  },
1087
- "border-width": "1px"
1088
- },
1089
- "active": {
1090
- "border-width": "1px",
1091
- "background-color": "#fff",
1092
- "border-color": "#4f7196"
904
+ "size": "24px"
1093
905
  },
1094
- "size": "24px",
1095
- "dot": {
1096
- "size": "12px"
906
+ "message": {
907
+ "line-height": "150%",
908
+ "column-gap": "0.5rem"
1097
909
  },
910
+ "border-radius": "5px"
911
+ },
912
+ "document": {
1098
913
  "background-color": "#fff",
1099
- "border-color": "#154273",
1100
- "invalid": {
1101
- "background-color": "#f9dfdd",
1102
- "border-color": "#d52b1e",
1103
- "border-width": "1px"
914
+ "color": "#0F172A",
915
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
916
+ "font-size": "1.25rem",
917
+ "line-height": "150%",
918
+ "font-weight": 400
919
+ },
920
+ "rich-text": {
921
+ "stranger": {
922
+ "margin-block-end": "2rem"
1104
923
  },
1105
- "disabled": {
1106
- "background-color": "#CBD5E1",
1107
- "border-color": "#94A3B8",
1108
- "color": "#475569"
924
+ "acquaintance": {
925
+ "margin-block-end": "1rem"
1109
926
  },
1110
- "hover": {
1111
- "background-color": "#fff",
1112
- "border-color": "#738eab",
1113
- "border-width": "1px"
927
+ "friend": {
928
+ "margin-block-end": "0.5rem"
1114
929
  },
1115
- "border-radius": "999px",
1116
- "border-width": "1px"
930
+ "best-friend": {
931
+ "margin-block-end": "0.25rem"
932
+ },
933
+ "confidant": {
934
+ "margin-block-end": 0
935
+ }
1117
936
  },
1118
- "link": {
937
+ "pointer-target": {
938
+ "min-size": "48px"
939
+ },
940
+ "focus": {
941
+ "outline-color": "#76d2b6",
942
+ "outline-offset": "0.125rem",
943
+ "outline-style": "solid",
944
+ "outline-width": "2px",
945
+ "inverse": {
946
+ "outline-color": "#fff"
947
+ }
948
+ }
949
+ },
950
+ "rhc": {
951
+ "color": {
952
+ "primary": {
953
+ "50": "#eaf8f4",
954
+ "100": "#d6f2e9",
955
+ "200": "#C1EBDE",
956
+ "300": "#ACE4D3",
957
+ "400": "#98DDC8",
958
+ "500": "#76d2b6",
959
+ "hover": "#528e7c"
960
+ },
1119
961
  "focus": {
1120
- "background-color": "#FDD370",
1121
- "color": "#01689b",
1122
- "text-decoration": "None",
1123
- "text-decoration-thickness": "auto"
962
+ "outline": "#76d2b6"
1124
963
  },
1125
- "color": "#01689b",
1126
- "text-decoration-color": "#01689b",
1127
- "active": {
1128
- "color": "#42145f",
1129
- "text-decoration": "None"
964
+ "foreground": {
965
+ "default": "#0F172A",
966
+ "subdued": "#334155",
967
+ "onEmphasis": "#fff",
968
+ "link": "#01689b"
1130
969
  },
1131
- "hover": {
1132
- "color": "#01496c",
1133
- "text-decoration": "None",
1134
- "text-decoration-thickness": "auto"
970
+ "border": {
971
+ "default": "#64748B",
972
+ "subdued": "#94A3B8",
973
+ "strong": "#0F172A"
1135
974
  },
1136
- "visited": {
1137
- "color": "#42145f"
975
+ "canvas": "#fff",
976
+ "feedback": {
977
+ "success": {
978
+ "default": "#39870c",
979
+ "subdued": "#e1eddb"
980
+ },
981
+ "info": {
982
+ "default": "#007bc7",
983
+ "subdued": "#d9ebf7"
984
+ },
985
+ "error": {
986
+ "default": "#d52b1e",
987
+ "subdued": "#f9dfdd"
988
+ },
989
+ "warning": {
990
+ "default": "#ffb612",
991
+ "subdued": "#fff4db"
992
+ }
1138
993
  },
1139
- "text-decoration": "underline",
1140
- "icon": {
1141
- "inset-block-start": "0.25rem",
1142
- "size": "24px"
994
+ "accent": {
995
+ "500": "#8fcae7"
1143
996
  },
1144
- "column-gap": "0.25rem",
1145
- "text-decoration-thickness": "auto",
1146
- "text-underline-offset": "0.125rem",
1147
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1148
- "font-weight": 400,
1149
- "font-size": "1.25rem",
1150
- "line-height": "150%"
1151
- },
1152
- "select": {
1153
- "focus": {
1154
- "background-color": "#FDD370",
1155
- "border-color": "#154273",
1156
- "color": "#0F172A",
1157
- "border-width": "2px"
997
+ "cool-grey": {
998
+ "50": "#F8FAFC",
999
+ "100": "#F1F5F9",
1000
+ "200": "#E2E8F0",
1001
+ "300": "#CBD5E1",
1002
+ "400": "#94A3B8",
1003
+ "500": "#64748B",
1004
+ "600": "#475569",
1005
+ "700": "#334155",
1006
+ "800": "#1E293B",
1007
+ "900": "#0F172A"
1158
1008
  },
1159
- "image-background-position": "right 0.5rem center",
1160
- "icon": {
1161
- "size": "24px"
1009
+ "lichtblauw": {
1010
+ "50": "#eef7fb",
1011
+ "100": "#ddeff8",
1012
+ "200": "#CCE7F4",
1013
+ "300": "#BCDFF0",
1014
+ "400": "#ABD7ED",
1015
+ "500": "#8fcae7"
1162
1016
  },
1163
- "background-color": "#fff",
1164
- "border-color": "#154273",
1165
- "color": "#0F172A",
1166
- "invalid": {
1167
- "background-color": "#f9dfdd",
1168
- "border-color": "#d52b1e",
1169
- "color": "#0F172A",
1170
- "border-width": "1px"
1017
+ "violet": {
1018
+ "50": "#f2d9e7",
1019
+ "100": "#e5b3d0",
1020
+ "200": "#D88CB7",
1021
+ "300": "#CB66A0",
1022
+ "400": "#BE4088",
1023
+ "500": "#a90061"
1171
1024
  },
1172
- "disabled": {
1173
- "background-color": "#CBD5E1",
1174
- "border-color": "#94A3B8",
1175
- "color": "#475569"
1025
+ "paars": {
1026
+ "50": "#e3dce7",
1027
+ "100": "#c6b9cf",
1028
+ "200": "#A995B7",
1029
+ "300": "#8D729F",
1030
+ "400": "#714f87",
1031
+ "500": "#42145f"
1176
1032
  },
1177
- "hover": {
1178
- "background-color": "#fff",
1179
- "border-color": "#738eab",
1180
- "color": "#0F172A",
1181
- "border-width": "1px"
1033
+ "hemelblauw": {
1034
+ "50": "#d9ebf7",
1035
+ "100": "#b3d7ee",
1036
+ "200": "#8CC3E6",
1037
+ "300": "#66AFDD",
1038
+ "400": "#409CD5",
1039
+ "500": "#007bc7"
1182
1040
  },
1183
- "padding-block-end": "0.5rem",
1184
- "padding-block-start": "0.5rem",
1185
- "padding-inline-end": "0.75rem",
1186
- "padding-inline-start": "0.75rem",
1187
- "border-radius": "2.5px",
1188
- "border-bottom-width": "auto",
1189
- "border-width": "1px",
1190
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1191
- "font-weight": 400,
1192
- "line-height": "150%",
1193
- "font-size": "1.25rem",
1194
- "max-inline-size": "400px"
1195
- },
1196
- "textarea": {
1197
- "focus": {
1198
- "background-color": "#FDD370",
1199
- "border-color": "#154273",
1200
- "color": "#0F172A",
1201
- "border-width": "2px"
1041
+ "donkerblauw": {
1042
+ "50": "#d9e8f0",
1043
+ "100": "#b3d2e1",
1044
+ "200": "#8CBBD2",
1045
+ "300": "#66A4C3",
1046
+ "400": "#408EB4",
1047
+ "500": "#01689b"
1202
1048
  },
1203
- "max-inline-size": "400px",
1204
- "padding-block-end": "0.5rem",
1205
- "padding-block-start": "0.5rem",
1206
- "padding-inline-end": "0.75rem",
1207
- "padding-inline-start": "0.75rem",
1208
- "background-color": "#fff",
1209
- "border-color": "#154273",
1210
- "color": "#0F172A",
1211
- "invalid": {
1212
- "background-color": "#f9dfdd",
1213
- "border-color": "#d52b1e",
1214
- "color": "#0F172A",
1215
- "border-width": "1px"
1049
+ "mintgroen": {
1050
+ "50": "#eaf8f4",
1051
+ "100": "#d6f2e9",
1052
+ "200": "#C1EBDE",
1053
+ "300": "#ACE4D3",
1054
+ "400": "#98DDC8",
1055
+ "500": "#76d2b6"
1056
+ },
1057
+ "mosgroen": {
1058
+ "50": "#ebebd9",
1059
+ "100": "#d6d7b3",
1060
+ "200": "#C1C38C",
1061
+ "300": "#ADAF66",
1062
+ "400": "#999C40",
1063
+ "500": "#777b00"
1064
+ },
1065
+ "groen": {
1066
+ "50": "#e1eddb",
1067
+ "100": "#c4dbb6",
1068
+ "200": "#A5C991",
1069
+ "300": "#88B76D",
1070
+ "400": "#6AA549",
1071
+ "500": "#39870c"
1072
+ },
1073
+ "donkergroen": {
1074
+ "50": "#dfe6e1",
1075
+ "100": "#becdc3",
1076
+ "200": "#9DB4A4",
1077
+ "300": "#7D9B87",
1078
+ "400": "#5D8269",
1079
+ "500": "#275937"
1216
1080
  },
1217
- "placeholder": {
1218
- "color": "#64748B"
1081
+ "bruin": {
1082
+ "50": "#efeada",
1083
+ "100": "#dfd4b6",
1084
+ "200": "#CFBF90",
1085
+ "300": "#BFA96C",
1086
+ "400": "#AF9447",
1087
+ "500": "#94710a"
1219
1088
  },
1220
- "disabled": {
1221
- "background-color": "#CBD5E1",
1222
- "border-color": "#94A3B8",
1223
- "color": "#475569"
1089
+ "donkerbruin": {
1090
+ "50": "#e8e0df",
1091
+ "100": "#d1c2be",
1092
+ "200": "#BAA39D",
1093
+ "300": "#A3847D",
1094
+ "400": "#8D665D",
1095
+ "500": "#673327"
1224
1096
  },
1225
- "read-only": {
1226
- "background-color": "#F1F5F9",
1227
- "border-color": "transparent",
1228
- "color": "#0F172A"
1097
+ "geel": {
1098
+ "50": "#fefbdd",
1099
+ "100": "#fdf6bc",
1100
+ "200": "#FCF199",
1101
+ "300": "#FBED78",
1102
+ "400": "#FAE856",
1103
+ "500": "#f9e11e"
1229
1104
  },
1230
- "hover": {
1231
- "background-color": "#fff",
1232
- "border-color": "#738eab",
1233
- "color": "#0F172A",
1234
- "border-width": "1px"
1105
+ "donkergeel": {
1106
+ "50": "#fff4db",
1107
+ "100": "#ffe9b8",
1108
+ "200": "#FDDE94",
1109
+ "300": "#FDD370",
1110
+ "400": "#FDC84D",
1111
+ "500": "#ffb612"
1235
1112
  },
1236
- "border-radius": "2.5px",
1237
- "border-bottom-width": "1px",
1238
- "border-width": "1px",
1239
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1240
- "font-weight": 400,
1241
- "line-height": "150%",
1242
- "font-size": "1.25rem"
1243
- },
1244
- "textbox": {
1245
- "focus": {
1246
- "background-color": "#FDD370",
1247
- "border-width": "2px",
1248
- "border-color": "#154273",
1249
- "color": "#0F172A"
1113
+ "oranje": {
1114
+ "50": "#fbead9",
1115
+ "100": "#f6d4b3",
1116
+ "200": "#F1BE8C",
1117
+ "300": "#EDA966",
1118
+ "400": "#E89440",
1119
+ "500": "#e17000"
1250
1120
  },
1251
- "border-radius": "2.5px",
1252
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1253
- "font-size": "1.25rem",
1254
- "font-weight": 400,
1255
- "line-height": "150%",
1256
- "max-inline-size": "400px",
1257
- "padding-block-end": "0.5rem",
1258
- "padding-block-start": "0.5rem",
1259
- "padding-inline-end": "0.75rem",
1260
- "padding-inline-start": "0.75rem",
1261
- "background-color": "#fff",
1262
- "border-color": "#154273",
1263
- "color": "#0F172A",
1264
- "invalid": {
1265
- "background-color": "#f9dfdd",
1266
- "border-color": "#d52b1e",
1267
- "color": "#0F172A",
1268
- "border-width": "1px"
1121
+ "rood": {
1122
+ "50": "#f9dfdd",
1123
+ "100": "#f2bfbc",
1124
+ "200": "#EC9F99",
1125
+ "300": "#E67F78",
1126
+ "400": "#DF6056",
1127
+ "500": "#d52b1e"
1269
1128
  },
1270
- "placeholder": {
1271
- "color": "#64748B"
1129
+ "roze": {
1130
+ "50": "#fdeff8",
1131
+ "100": "#fbdef0",
1132
+ "200": "#F8CEE8",
1133
+ "300": "#F6BDE1",
1134
+ "400": "#F4ADD9",
1135
+ "500": "#f092cd"
1272
1136
  },
1273
- "border-block-end-width": "auto",
1137
+ "robijnrood": {
1138
+ "50": "#f7d9e7",
1139
+ "100": "#efb3ce",
1140
+ "200": "#E78CB6",
1141
+ "300": "#DF669D",
1142
+ "400": "#D74085",
1143
+ "500": "#ca005d"
1144
+ },
1145
+ "lintblauw": {
1146
+ "50": "#dce3ea",
1147
+ "100": "#b8c6d5",
1148
+ "200": "#95a9c0",
1149
+ "300": "#738eab",
1150
+ "400": "#4f7196",
1151
+ "500": "#154273"
1152
+ },
1153
+ "wit": "#fff",
1154
+ "zwart": "#000",
1155
+ "none": "transparent"
1156
+ },
1157
+ "sub-nav-bar": {
1158
+ "background-color": "#f2f4f6",
1159
+ "column-gap": "0.5rem",
1160
+ "column-width": "375px",
1161
+ "padding-block-end": "2rem",
1162
+ "padding-block-start": "2rem",
1163
+ "inline-size": "100%",
1164
+ "content": {
1165
+ "padding-inline-end": "1rem",
1166
+ "padding-inline-start": "1rem",
1167
+ "max-inline-size": "1280px",
1168
+ "list": {
1169
+ "row-gap": "0.5rem"
1170
+ }
1171
+ }
1172
+ },
1173
+ "toggletip": {
1174
+ "color": "#fff",
1175
+ "background-color": "#007bc7",
1176
+ "border-color": "transparent",
1177
+ "border-radius": "5px",
1274
1178
  "border-width": "1px",
1275
- "disabled": {
1276
- "background-color": "#CBD5E1",
1277
- "border-color": "#94A3B8",
1278
- "color": "#475569"
1179
+ "icon": {
1180
+ "size": "24px"
1279
1181
  },
1280
- "read-only": {
1281
- "background-color": "#F1F5F9",
1282
- "border-color": "transparent",
1283
- "color": "#0F172A"
1182
+ "size": "24px",
1183
+ "active": {
1184
+ "color": "#007bc7",
1185
+ "background-color": "#fff",
1186
+ "border-color": "#007bc7"
1284
1187
  },
1285
1188
  "hover": {
1286
- "border-width": "1px",
1287
- "background-color": "#fff",
1288
- "border-color": "#738eab",
1289
- "color": "#0F172A"
1189
+ "color": "#0F172A",
1190
+ "background-color": "#66AFDD"
1191
+ },
1192
+ "focus": {
1193
+ "color": "#fff",
1194
+ "background-color": "#007bc7"
1290
1195
  }
1291
1196
  },
1292
- "counter-badge": {
1293
- "background-color": "#FDD370"
1294
- },
1295
- "skip-link": {
1296
- "focus": {
1297
- "background-color": "#FDD370"
1197
+ "sidenav": {
1198
+ "display": "flex",
1199
+ "link": {
1200
+ "line-height": "150%",
1201
+ "icon": {
1202
+ "size": "24px",
1203
+ "margin-inline": "0.5rem"
1204
+ },
1205
+ "font-size": "1.25rem",
1206
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1207
+ "font-weight": 400,
1208
+ "current": {
1209
+ "font-weight": 700,
1210
+ "color": "#0F172A"
1211
+ },
1212
+ "color": "#01689b",
1213
+ "active": {
1214
+ "color": "#42145f",
1215
+ "text-decoration": "underline"
1216
+ },
1217
+ "focus": {
1218
+ "border-radius": "5px",
1219
+ "border-width": "2px",
1220
+ "border-style": "solid",
1221
+ "border-color": "#154273",
1222
+ "background-color": "none",
1223
+ "color": "#01689b",
1224
+ "text-decoration": "None"
1225
+ },
1226
+ "hover": {
1227
+ "color": "#15496a",
1228
+ "text-decoration": "underline"
1229
+ },
1230
+ "padding-block-start": "0.75rem",
1231
+ "padding-block-end": "0.75rem",
1232
+ "text-decoration": "None",
1233
+ "column-gap": "0.5rem"
1298
1234
  }
1299
1235
  },
1300
- "icon": {
1301
- "color": "inherit",
1302
- "size": "24px",
1303
- "inset-block-start": 0
1236
+ "radio-group": {
1237
+ "padding-block-end": "0.5rem",
1238
+ "padding-block-start": "0.5rem",
1239
+ "row-gap": "1rem"
1304
1240
  },
1305
- "unordered-list": {
1306
- "padding-inline-start": "1.5rem",
1307
- "margin-block-end": "0.25rem",
1308
- "margin-block-start": "0.25rem",
1309
- "color": "#0F172A",
1310
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1311
- "font-weight": 400,
1312
- "font-size": "1.25rem",
1313
- "line-height": "150%",
1314
- "item": {
1315
- "padding-inline-start": "0.5rem",
1316
- "margin-block-end": "0.25rem",
1317
- "margin-block-start": "0.25rem"
1241
+ "navigation-list": {
1242
+ "icon": {
1243
+ "background-color": "#0F172A",
1244
+ "border-radius": "999px",
1245
+ "color": "#fff"
1318
1246
  },
1319
- "marker": {
1320
- "color": "#0F172A",
1321
- "border-color": "#0F172A"
1247
+ "item": {
1248
+ "icon": {
1249
+ "padding-inline": "0.5rem",
1250
+ "padding-block": "0.5rem",
1251
+ "size": "24px"
1252
+ },
1253
+ "content": {
1254
+ "font-size": "1.125rem",
1255
+ "column-gap": "0.5rem",
1256
+ "row-gap": "0.25rem"
1257
+ },
1258
+ "label": {
1259
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1260
+ "font-size": "1.875rem",
1261
+ "font-weight": 700,
1262
+ "line-height": "150%"
1263
+ },
1264
+ "active": {
1265
+ "background-color": "#F1F5F9"
1266
+ },
1267
+ "hover": {
1268
+ "background-color": "#F8FAFC"
1269
+ },
1270
+ "focus": {
1271
+ "background-color": "#dce3ea"
1272
+ },
1273
+ "background-color": "#fff",
1274
+ "color": "#334155",
1275
+ "border-width": "1px",
1276
+ "border-color": "#CBD5E1",
1277
+ "heading": {
1278
+ "color": "#0F172A"
1279
+ },
1280
+ "column-gap": "1rem",
1281
+ "min-height": "48px",
1282
+ "padding-block": "0.75rem",
1283
+ "padding-inline": "1rem"
1322
1284
  }
1323
1285
  },
1324
- "table": {
1325
- "header-cell": {
1326
- "line-height": "150%",
1327
- "color": "#0F172A",
1328
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1329
- "font-weight": 700,
1330
- "font-size": "1.25rem"
1331
- },
1332
- "caption": {
1333
- "line-height": "125%",
1334
- "margin-block-end": "1.5rem",
1335
- "color": "#0F172A",
1336
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1337
- "font-weight": 700,
1338
- "font-size": "1.875rem"
1286
+ "nav-bar": {
1287
+ "border-block-end-width": "1px",
1288
+ "max-inline-size": "1280px",
1289
+ "padding-inline": "1rem",
1290
+ "container": {
1291
+ "inline-size": "100%"
1339
1292
  },
1340
- "cell": {
1341
- "padding-block-end": "0.75rem",
1342
- "padding-block-start": "0.75rem",
1343
- "padding-inline-end": "1rem",
1344
- "padding-inline-start": "1rem",
1345
- "line-height": "150%"
1293
+ "content": {
1294
+ "column-gap": "1rem"
1346
1295
  },
1347
- "data-cell": {
1296
+ "icon": {
1348
1297
  "color": "#0F172A",
1349
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1350
- "font-weight": 400,
1351
- "line-height": "150%",
1352
- "font-size": "1.25rem"
1353
- },
1354
- "header": {
1355
- "border-block-end-width": "2px",
1356
- "border-block-end-color": "#CBD5E1",
1357
- "background-color": "transparent"
1358
- },
1359
- "footer": {
1360
- "border-block-end-width": "1px",
1361
- "border-block-end-color": "#CBD5E1",
1362
- "background-color": "transparent"
1298
+ "active": {
1299
+ "color": "#fff"
1300
+ },
1301
+ "size": "24px"
1363
1302
  },
1364
- "row": {
1365
- "border-block-end-width": "1px",
1366
- "border-block-end-color": "#CBD5E1",
1367
- "background-color": "transparent"
1303
+ "link": {
1304
+ "active": {
1305
+ "background-color": "#76d2b6",
1306
+ "color": "#fff"
1307
+ },
1308
+ "background-color": "#fff",
1309
+ "color": "#76d2b6",
1310
+ "focus": {
1311
+ "background-color": "#eaf8f4",
1312
+ "color": "#76d2b6"
1313
+ },
1314
+ "hover": {
1315
+ "background-color": "#F8FAFC",
1316
+ "color": "#76d2b6"
1317
+ },
1318
+ "padding-block-end": "1rem",
1319
+ "padding-block-start": "1rem",
1320
+ "padding-inline-end": "0.75rem",
1321
+ "padding-inline-start": "0.75rem",
1322
+ "column-gap": "0.5rem"
1368
1323
  },
1369
- "footer-cell": {
1370
- "font-weight": 700,
1371
- "font-size": "1.25rem",
1372
- "color": "#0F172A",
1373
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1374
- "line-height": "150%"
1324
+ "heading": {
1325
+ "font-weight": 700
1375
1326
  },
1376
- "container": {
1377
- "box-inline-end-shadow": {
1378
- "x": 0,
1379
- "y": "16px",
1380
- "blur": "48px",
1381
- "spread": 0,
1382
- "color": "#0000001a"
1327
+ "background-color": "#fff",
1328
+ "color": "#76d2b6",
1329
+ "border-color": "#98DDC8"
1330
+ },
1331
+ "message-list": {
1332
+ "item": {
1333
+ "background-color": "#fff",
1334
+ "border-color": "#CBD5E1",
1335
+ "border-width": "1px",
1336
+ "color": "#334155",
1337
+ "column-gap": "1rem",
1338
+ "icon": {
1339
+ "size": "24px",
1340
+ "color": "#0F172A"
1383
1341
  },
1384
- "box-inline-start-shadow": {
1385
- "x": 0,
1386
- "y": "16px",
1387
- "blur": "48px",
1388
- "spread": 0,
1389
- "color": "#0000001a"
1342
+ "min-height": "48px",
1343
+ "padding-block": "0.75rem",
1344
+ "padding-inline": "1rem",
1345
+ "content": {
1346
+ "font-size": "1.125rem",
1347
+ "column-gap": "0.5rem",
1348
+ "row-gap": "0.5rem"
1349
+ },
1350
+ "label": {
1351
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1352
+ "font-size": "1.25rem",
1353
+ "font-weight": 700,
1354
+ "line-height": "150%"
1355
+ },
1356
+ "heading": {
1357
+ "color": "#0F172A"
1390
1358
  }
1391
- },
1392
- "font-size": "1.25rem"
1393
- },
1394
- "separator": {
1395
- "color": "#CBD5E1",
1396
- "block-size": "2px",
1397
- "margin-block-end": "0.75rem",
1398
- "margin-block-start": "0.75rem"
1359
+ }
1399
1360
  },
1400
- "ordered-list": {
1401
- "padding-inline-start": "1.5rem",
1402
- "margin-block-end": "0.25rem",
1403
- "margin-block-start": "0.25rem",
1404
- "margin-inline-start": "0.625rem",
1405
- "item": {
1406
- "padding-inline-start": 0,
1407
- "margin-block-end": "0.25rem",
1408
- "margin-block-start": "0.25rem"
1361
+ "logo": {
1362
+ "image": {
1363
+ "background-color": "#fff",
1364
+ "inline-size": "48px",
1365
+ "block-size": "96px",
1366
+ "color": "#154273"
1409
1367
  },
1410
- "color": "#0F172A",
1368
+ "title": {
1369
+ "font-weight": 600,
1370
+ "line-height": "1.063rem",
1371
+ "font-size": "0.913rem",
1372
+ "padding-block-start": "3.125rem"
1373
+ },
1374
+ "subtitle": {
1375
+ "font-weight": 400,
1376
+ "line-height": "1rem",
1377
+ "font-size": "0.775rem"
1378
+ },
1379
+ "column-gap": "12px",
1411
1380
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1412
- "font-weight": 400,
1413
- "font-size": "1.25rem",
1414
- "line-height": "150%"
1381
+ "color": "#154273"
1415
1382
  },
1416
- "link-list": {
1417
- "margin-block-start": 0,
1418
- "row-gap": "0.5rem",
1419
- "margin-block-end": 0,
1420
- "item": {
1421
- "column-gap": "0.5rem",
1422
- "text-decoration": "None"
1423
- },
1424
- "icon": {
1425
- "size": "24px",
1426
- "inset-block-start": "0.188rem"
1427
- }
1383
+ "link-list-card": {
1384
+ "background-color": "#fff",
1385
+ "padding-block-start": "1.5rem",
1386
+ "padding-block-end": "1.5rem",
1387
+ "row-gap": "1rem",
1388
+ "padding-inline-start": "1.5rem",
1389
+ "padding-inline-end": "1.5rem"
1428
1390
  },
1429
- "form-label": {
1430
- "color": "#0F172A",
1431
- "font-size": "1.25rem",
1432
- "font-weight": 700
1391
+ "link-list": {
1392
+ "text-decoration": "None"
1433
1393
  },
1434
- "form-field-label": {
1435
- "color": "#0F172A",
1436
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1437
- "font-size": "1.25rem",
1438
- "font-weight": 700,
1439
- "line-height": "150%"
1394
+ "icon-only-button": {
1395
+ "padding-block-end": "0.75rem",
1396
+ "padding-block-start": "0.75rem",
1397
+ "padding-inline-end": "0.75rem",
1398
+ "padding-inline-start": "0.75rem"
1440
1399
  },
1441
- "form-field-error-message": {
1442
- "icon": {
1443
- "size": "24px",
1444
- "margin-inline-end": "0.5rem"
1400
+ "hero": {
1401
+ "heading": {
1402
+ "font-weight": 700,
1403
+ "line-height": "125%",
1404
+ "font-size": "1.875rem",
1405
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif"
1445
1406
  },
1446
- "color": "#d52b1e",
1447
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1448
- "font-size": "1.25rem",
1449
- "font-weight": 400,
1450
- "margin-block-end": "0.5rem",
1451
- "padding-block-end": "0.5rem"
1452
- },
1453
- "form-field-description": {
1454
- "color": "#334155",
1455
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1456
- "font-size": "1.25rem",
1457
- "line-height": "150%",
1458
- "margin-block-start": "-0.5rem",
1459
- "margin-block-end": "0.5rem",
1460
- "padding-block-end": "0.5rem"
1461
- },
1462
- "form-field": {
1463
- "margin-block-start": "0.5rem",
1464
- "margin-block-end": "0.5rem",
1465
- "invalid": {
1466
- "border-inline-start-color": "#d52b1e",
1467
- "border-inline-start-width": "0px",
1468
- "padding-inline-start": 0
1407
+ "sub-heading": {
1408
+ "font-weight": 400,
1409
+ "line-height": "150%",
1410
+ "font-size": "1.25rem",
1411
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif"
1412
+ },
1413
+ "message": {
1414
+ "background-color": "#154273",
1415
+ "color": "#fff",
1416
+ "row-gap": "0.125rem",
1417
+ "padding-block-end": "1rem",
1418
+ "padding-inline-end": "1rem",
1419
+ "padding-inline-start": "1rem",
1420
+ "padding-block-start": "1rem",
1421
+ "border-radius": "20px",
1422
+ "inline-size": "90%"
1469
1423
  },
1424
+ "border-radius": "40px",
1425
+ "inline-size": "100%"
1426
+ },
1427
+ "form-field-radio-option": {
1428
+ "column-gap": "0.5rem",
1429
+ "font-weight": 400,
1430
+ "row-gap": "0.5rem",
1470
1431
  "label": {
1471
- "margin-block-end": "0.5rem"
1432
+ "margin-block-end": 0
1472
1433
  },
1473
- "error-message": {
1474
- "line-height": "normal"
1434
+ "input": {
1435
+ "margin": {
1436
+ "block-start": "0.25rem"
1437
+ }
1475
1438
  }
1476
1439
  },
1477
- "page-footer": {
1478
- "background-color": "#154273",
1479
- "color": "#fff",
1480
- "padding-block-start": "3rem",
1481
- "padding-block-end": "3rem",
1482
- "padding-inline-start": "80px",
1483
- "padding-inline-end": "80px"
1440
+ "form-field-checkbox-option": {
1441
+ "column-gap": "0.5rem",
1442
+ "margin-block-end": 0
1484
1443
  },
1485
- "figure": {
1486
- "caption": {
1487
- "border-color": "#CBD5E1",
1488
- "border-width": "4px",
1489
- "color": "#76d2b6",
1490
- "padding-block-end": "0.5rem",
1491
- "padding-block-start": "0.5rem",
1444
+ "page-footer": {
1445
+ "column-gap": "1.5rem",
1446
+ "column-width": "200px",
1447
+ "column": {
1448
+ "title": {
1449
+ "margin-block-end": "0.75rem"
1450
+ }
1451
+ },
1452
+ "content": {
1453
+ "max-inline-size": "1280px",
1492
1454
  "padding-inline-start": "1rem",
1493
- "line-height": "150%",
1494
- "font-size": "1.25rem"
1455
+ "padding-inline-end": "1rem",
1456
+ "column-gap": "2rem"
1495
1457
  },
1496
- "img": {
1497
- "border-end-end-radius": 0,
1498
- "border-end-start-radius": 0,
1499
- "border-start-end-radius": 0,
1500
- "border-start-start-radius": 0
1501
- }
1502
- },
1503
- "form-fieldset": {
1504
- "legend": {
1505
- "color": "#0F172A",
1506
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1507
- "font-size": "1.25rem",
1508
- "font-weight": 700,
1509
- "line-height": "150%",
1510
- "disabled": {
1511
- "color": "#334155"
1458
+ "border": {
1459
+ "block-start": {
1460
+ "width": "2px",
1461
+ "color": "#738eab",
1462
+ "style": "solid"
1512
1463
  }
1513
1464
  },
1514
- "section": {
1515
- "background-color": "transparent",
1516
- "color": "#0F172A"
1465
+ "outlined": {
1466
+ "background-color": "#fff",
1467
+ "color": "#76d2b6",
1468
+ "border": {
1469
+ "color": "#76d2b6"
1470
+ }
1517
1471
  },
1518
- "invalid": {
1519
- "border-inline-start": {
1520
- "color": "#d52b1e"
1521
- },
1522
- "padding-inline-start": 0,
1523
- "border-inline-start-width": "0px"
1472
+ "padding": {
1473
+ "block-start": "2.5rem",
1474
+ "block-end": "2.5rem",
1475
+ "inline-start": "2.5rem",
1476
+ "inline-end": "2.5rem"
1477
+ },
1478
+ "flex": {
1479
+ "direction": "column"
1524
1480
  }
1525
1481
  },
1526
- "button-group": {
1527
- "background-color": "transparent",
1528
- "column-gap": "0.5rem",
1529
- "margin-block-end": "0px",
1530
- "margin-block-start": "0px",
1531
- "padding-block-end": "0px",
1532
- "padding-block-start": "0px",
1533
- "row-gap": "0.5rem"
1482
+ "file-input": {
1483
+ "column-gap": "0.75rem",
1484
+ "row-gap": "0.75rem",
1485
+ "feedback": {
1486
+ "color": "#475569",
1487
+ "font-size": "1rem"
1488
+ }
1534
1489
  },
1535
- "breadcrumb-nav": {
1536
- "line-height": 1.4,
1537
- "font-size": "1.25rem",
1490
+ "file": {
1491
+ "border-style": "solid",
1492
+ "border-color": "#154273",
1493
+ "border-width": "1px",
1494
+ "border-radius": "5px",
1495
+ "padding-inline-start": "1rem",
1496
+ "padding-inline-end": "1rem",
1497
+ "padding-block-start": "0.75rem",
1498
+ "padding-block-end": "0.75rem",
1499
+ "column-gap": "0.25rem",
1500
+ "error": {
1501
+ "border-color": "#d52b1e"
1502
+ },
1503
+ "subtitle": {
1504
+ "color": "#64748B"
1505
+ }
1506
+ },
1507
+ "dot-badge": {
1508
+ "border-radius": "999px",
1509
+ "color": "#d52b1e",
1510
+ "size": "12px"
1511
+ },
1512
+ "code-input": {
1513
+ "size": "48px"
1514
+ },
1515
+ "code-input-group": {
1516
+ "column-gap": "0.5rem"
1517
+ },
1518
+ "checkbox-group": {
1519
+ "padding-block-end": "0.5rem",
1520
+ "padding-block-start": "0.5rem",
1521
+ "row-gap": "1rem"
1522
+ },
1523
+ "card-as-link": {
1524
+ "background-color": "#fff",
1525
+ "border-color": "#CBD5E1",
1526
+ "border-radius": "5px",
1527
+ "border-width": "1px",
1528
+ "color": "#0F172A",
1529
+ "column-gap": "1rem",
1530
+ "inline-size": "328px",
1531
+ "icon": {
1532
+ "color": "#0F172A",
1533
+ "size": "24px"
1534
+ },
1538
1535
  "link": {
1539
- "icon": {
1540
- "size": "24px",
1541
- "margin-inline": "0.25rem",
1542
- "inset-block-start": 0
1543
- },
1544
- "padding-block-end": "0.75rem",
1545
- "padding-block-start": "0.75rem",
1546
- "padding-inline-end": 0,
1547
- "padding-inline-start": 0,
1548
1536
  "color": "#01689b",
1537
+ "text-decoration": "underline",
1549
1538
  "active": {
1550
- "color": "#42145f",
1551
- "text-decoration": "None"
1552
- },
1553
- "focus": {
1554
- "background-color": "transparent",
1555
- "color": "#01689b",
1556
- "text-decoration": "None"
1539
+ "text-decoration": "none"
1557
1540
  },
1558
1541
  "hover": {
1559
- "color": "#01496c",
1560
- "text-decoration": "None"
1561
- },
1562
- "current": {
1563
- "color": "#334155"
1542
+ "text-decoration": "none"
1564
1543
  },
1565
- "text-decoration": "underline"
1566
- },
1567
- "divider": {
1568
- "size": "24px",
1569
- "color": "#334155",
1570
- "inset-block-start": 0
1571
- },
1572
- "margin-inline": "0.5rem",
1573
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1574
- "font-weight": 400
1575
- },
1576
- "blockquote": {
1577
- "caption": {
1578
- "font-size": "1.25rem",
1579
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1580
- "line-height": "150%",
1581
- "font-weight": 400,
1582
- "padding-block-start": "0.75rem",
1583
- "color": "#334155"
1584
- },
1585
- "content": {
1586
- "font-family": "RijksoverheidSerifWeb, 'Times New Roman', serif",
1587
- "line-height": "150%",
1588
- "font-weight": 400,
1589
- "font-size": "1.5rem",
1590
- "color": "#0F172A"
1591
- },
1592
- "margin-block-end": 0,
1593
- "margin-block-start": 0,
1594
- "margin-inline-end": 0,
1595
- "margin-inline-start": 0,
1596
- "padding-block-end": "2rem",
1597
- "padding-block-start": "2rem",
1598
- "padding-inline-end": "2rem",
1599
- "padding-inline-start": "2rem",
1600
- "row-gap": "0.75rem",
1601
- "background-color": "transparent",
1602
- "border-color": "#76d2b6",
1603
- "border-block-start-width": 0,
1604
- "border-block-end-width": 0,
1605
- "border-inline-start-width": 0,
1606
- "border-inline-end-width": 0,
1607
- "border-start-start-radius": 0,
1608
- "border-start-end-radius": 0,
1609
- "border-end-start-radius": 0,
1610
- "border-end-end-radius": 0,
1611
- "border-width": "2px",
1612
- "blue-corner-border-variation": {
1613
- "border-color": "#76d2b6",
1614
- "border-block-end-width": "2px",
1615
- "border-inline-end-width": "2px",
1616
- "border-end-end-radius": "3rem"
1617
- },
1618
- "pink-background-variation": {
1619
- "background-color": "#F6BDE1",
1620
- "border-end-start-radius": "3rem",
1621
- "padding": "2.5rem"
1622
- },
1623
- "pink-left-border-variation": {
1624
- "border-color": "#F6BDE1",
1625
- "border-inline-start-width": "0.75rem",
1626
- "padding-inline-start": "2.5rem",
1627
- "padding-inline-end": "2.5rem",
1628
- "padding-block-start": "1.5rem",
1629
- "padding-block-end": "1.5rem"
1544
+ "focus": {
1545
+ "text-decoration": "none"
1546
+ }
1630
1547
  },
1631
- "pink-corner-border-variation": {
1632
- "border-color": "#F6BDE1",
1633
- "border-block-start-width": "0.25rem",
1634
- "border-inline-start-width": "0.25rem",
1635
- "border-start-start-radius": "3rem",
1636
- "padding": "2.5rem"
1637
- }
1638
- },
1639
- "article": {
1640
- "max-inline-size": "75ch"
1641
- },
1642
- "alert": {
1643
- "heading": {
1644
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1645
- "font-weight": 700,
1646
- "line-height": "150%",
1647
- "font-size": "1.25rem"
1548
+ "metadata": {
1549
+ "color": "#0F172A"
1648
1550
  },
1649
- "column-gap": "0.5rem",
1650
- "border-width": "0px",
1651
- "margin-block-end": "0.75rem",
1652
- "margin-block-start": "0.75rem",
1653
1551
  "padding-block-end": "1rem",
1654
1552
  "padding-block-start": "1rem",
1655
1553
  "padding-inline-end": "1rem",
1656
1554
  "padding-inline-start": "1rem",
1657
- "background-color": "#d9ebf7",
1658
- "border-color": "transparent",
1659
- "color": "#0F172A",
1660
- "info": {
1661
- "background-color": "#d9ebf7",
1662
- "border-color": "transparent",
1663
- "color": "#0F172A"
1555
+ "row-gap": "0.75rem",
1556
+ "active": {
1557
+ "background-color": "#F1F5F9",
1558
+ "text-decoration": "underline"
1664
1559
  },
1665
- "error": {
1666
- "background-color": "#f9dfdd",
1667
- "border-color": "transparent",
1668
- "color": "#0F172A"
1560
+ "hover": {
1561
+ "background-color": "#F8FAFC",
1562
+ "text-decoration": "underline"
1669
1563
  },
1670
- "ok": {
1671
- "background-color": "#e1eddb",
1672
- "border-color": "transparent",
1673
- "color": "#0F172A"
1564
+ "focus": {
1565
+ "background-color": "#dce3ea",
1566
+ "text-decoration": "underline"
1674
1567
  },
1675
- "warning": {
1676
- "background-color": "#fff4db",
1568
+ "full-bleed": {
1569
+ "background-color": "#000",
1677
1570
  "border-color": "transparent",
1678
- "color": "#0F172A"
1571
+ "color": "#fff",
1572
+ "opacity": 0.5
1679
1573
  },
1680
- "icon": {
1681
- "inset-block-start": "3px",
1682
- "info": {
1683
- "color": "#007bc7"
1684
- },
1685
- "error": {
1686
- "color": "#d52b1e"
1687
- },
1688
- "ok": {
1689
- "color": "#39870c"
1690
- },
1691
- "warning": {
1692
- "color": "#ffb612"
1693
- },
1694
- "size": "24px"
1574
+ "heading": {
1575
+ "padding-block-start": "0.5rem",
1576
+ "font-size": "1.5rem",
1577
+ "font-weight": 700
1695
1578
  },
1696
- "message": {
1579
+ "horizontal": {
1580
+ "background-color": "#154273",
1581
+ "border-color": "transparent",
1582
+ "color": "#fff",
1583
+ "max-block-size": "96px",
1584
+ "padding-block-end": 0,
1585
+ "padding-block-start": 0,
1586
+ "padding-inline-end": "1rem",
1587
+ "padding-inline-start": "1rem",
1588
+ "heading": {
1589
+ "inline-size": "200px"
1590
+ }
1591
+ }
1592
+ },
1593
+ "accordion": {
1594
+ "button": {
1595
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1596
+ "font-size": "1.25rem",
1597
+ "font-weight": 400,
1697
1598
  "line-height": "150%",
1698
- "column-gap": "0.5rem"
1599
+ "icon": {
1600
+ "margin-block": "0.25rem"
1601
+ },
1602
+ "padding-block-end": "0.75rem",
1603
+ "padding-block-start": "0.75rem",
1604
+ "padding-inline-end": "1rem",
1605
+ "padding-inline-start": "1rem",
1606
+ "expanded": {
1607
+ "background-color": "#fff",
1608
+ "color": "#0F172A"
1609
+ }
1699
1610
  },
1700
- "border-radius": "5px"
1701
- },
1702
- "document": {
1703
- "background-color": "#fff",
1704
- "color": "#0F172A",
1705
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1706
- "font-size": "1.25rem",
1707
- "line-height": "150%",
1708
- "font-weight": 400
1709
- },
1710
- "rich-text": {
1711
- "stranger": {
1712
- "margin-block-end": "2rem"
1611
+ "section": {
1612
+ "border-block-end-width": "1px",
1613
+ "border-width": 0,
1614
+ "border-color": "#94A3B8"
1713
1615
  },
1714
- "acquaintance": {
1715
- "margin-block-end": "1rem"
1616
+ "header": {
1617
+ "margin": 0
1716
1618
  },
1717
- "friend": {
1718
- "margin-block-end": "0.5rem"
1619
+ "border-radius": "0px",
1620
+ "color": "#0F172A"
1621
+ },
1622
+ "keep": {
1623
+ "top-left": {
1624
+ "borderRadiusTopLeft": "48px",
1625
+ "borderRadiusTopRight": 0,
1626
+ "borderRadiusBottomRight": 0,
1627
+ "borderRadiusBottomLeft": 0
1719
1628
  },
1720
- "best-friend": {
1721
- "margin-block-end": "0.25rem"
1629
+ "top-right": {
1630
+ "borderRadiusTopRight": "48px",
1631
+ "borderRadiusTopLeft": 0,
1632
+ "borderRadiusBottomRight": 0,
1633
+ "borderRadiusBottomLeft": 0
1722
1634
  },
1723
- "confidant": {
1724
- "margin-block-end": 0
1635
+ "bottom-right": {
1636
+ "borderRadiusTopLeft": 0,
1637
+ "borderRadiusTopRight": 0,
1638
+ "borderRadiusBottomRight": "48px",
1639
+ "borderRadiusBottomLeft": 0
1640
+ },
1641
+ "bottom-left": {
1642
+ "borderRadiusTopLeft": 0,
1643
+ "borderRadiusTopRight": 0,
1644
+ "borderRadiusBottomRight": 0,
1645
+ "borderRadiusBottomLeft": "48px"
1725
1646
  }
1726
1647
  },
1727
- "pointer-target": {
1728
- "min-size": "48px"
1648
+ "border-radius": {
1649
+ "sm": "2.5px",
1650
+ "md": "5px",
1651
+ "keep": "48px",
1652
+ "circle": "999px",
1653
+ "none": "0px"
1729
1654
  },
1730
1655
  "focus": {
1731
- "outline-color": "#76d2b6",
1732
1656
  "outline-offset": "0.125rem",
1733
1657
  "outline-style": "solid",
1734
- "outline-width": "2px",
1735
- "inverse": {
1736
- "outline-color": "transparant"
1658
+ "outline-width": "2px"
1659
+ },
1660
+ "font-size": {
1661
+ "heading": {
1662
+ "level-1": "3.125rem",
1663
+ "level-2": "2.5rem",
1664
+ "level-3": "1.875rem",
1665
+ "level-4": "1.5rem",
1666
+ "level-5": "1.25rem"
1667
+ },
1668
+ "paragraph": {
1669
+ "intro": "1.5rem",
1670
+ "default": "1.25rem",
1671
+ "small": "1.125rem"
1672
+ },
1673
+ "xs": {
1674
+ "desktop": "1.25rem",
1675
+ "tablet": "1.125rem",
1676
+ "mobile": "1rem"
1677
+ },
1678
+ "sm": {
1679
+ "desktop": "1.5rem",
1680
+ "tablet": "1.35rem",
1681
+ "mobile": "1.2rem"
1682
+ },
1683
+ "md": {
1684
+ "desktop": "1.875rem",
1685
+ "tablet": "1.688rem",
1686
+ "mobile": "1.5rem"
1687
+ },
1688
+ "lg": {
1689
+ "desktop": "2.5rem",
1690
+ "tablet": "2.25rem",
1691
+ "mobile": "2rem"
1692
+ },
1693
+ "xl": {
1694
+ "desktop": "3.125rem",
1695
+ "tablet": "2.813rem",
1696
+ "mobile": "2.5rem"
1737
1697
  }
1698
+ },
1699
+ "line-height": {
1700
+ "paragraph": "150%",
1701
+ "sm": "125%",
1702
+ "md": "150%"
1703
+ },
1704
+ "size": {
1705
+ "target": "48px",
1706
+ "icon": {
1707
+ "functional": "24px"
1708
+ },
1709
+ "quarter-lint": "12px",
1710
+ "half-lint": "24px",
1711
+ "lint": "48px",
1712
+ "2-lint": "96px",
1713
+ "3-lint": "1440px"
1714
+ },
1715
+ "font-weight": {
1716
+ "extra-bold": 800,
1717
+ "bold": 700,
1718
+ "semi-bold": 550,
1719
+ "regular": 400,
1720
+ "chosen-regular": 400,
1721
+ "light": 300,
1722
+ "thin": 200
1723
+ },
1724
+ "font-family": {
1725
+ "primary": "Fira Sans, Arial, Verdana, sans-serif",
1726
+ "secondary": "RijksoverheidSerifWeb, 'Times New Roman', serif"
1727
+ },
1728
+ "border-width": {
1729
+ "default": "1px",
1730
+ "m": "2px",
1731
+ "none": "0px"
1732
+ },
1733
+ "space": {
1734
+ "0": 0,
1735
+ "25": "0.125rem",
1736
+ "50": "0.25rem",
1737
+ "100": "0.5rem",
1738
+ "150": "0.75rem",
1739
+ "200": "1rem",
1740
+ "300": "1.5rem",
1741
+ "400": "2rem",
1742
+ "500": "2.5rem",
1743
+ "600": "3rem",
1744
+ "700": "3.5rem"
1738
1745
  }
1739
1746
  },
1740
1747
  "overwrite": {