@rijkshuisstijl-community/design-tokens 5.0.0 → 7.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 (105) hide show
  1. package/CHANGELOG.md +45 -0
  2. package/dist/_variables.scss +626 -673
  3. package/dist/index.css +626 -673
  4. package/dist/index.d.ts +708 -755
  5. package/dist/index.js +710 -757
  6. package/dist/index.json +709 -756
  7. package/dist/index.tokens.json +1745 -1802
  8. package/dist/koop/_variables.scss +61 -123
  9. package/dist/koop/index.css +61 -123
  10. package/dist/koop/index.d.ts +59 -121
  11. package/dist/koop/index.js +61 -123
  12. package/dist/koop/index.json +60 -122
  13. package/dist/koop/index.tokens.json +83 -165
  14. package/dist/koop/root.css +61 -123
  15. package/dist/koop/tokens.d.ts +82 -164
  16. package/dist/koop/tokens.js +3879 -5309
  17. package/dist/root.css +626 -673
  18. package/dist/tokens.d.ts +1639 -1696
  19. package/dist/tokens.js +25088 -26173
  20. package/dist/uitvoerend-groen/_variables.scss +51 -113
  21. package/dist/uitvoerend-groen/index.css +51 -113
  22. package/dist/uitvoerend-groen/index.d.ts +49 -111
  23. package/dist/uitvoerend-groen/index.js +51 -113
  24. package/dist/uitvoerend-groen/index.json +50 -112
  25. package/dist/uitvoerend-groen/index.tokens.json +71 -153
  26. package/dist/uitvoerend-groen/root.css +51 -113
  27. package/dist/uitvoerend-groen/tokens.d.ts +70 -152
  28. package/dist/uitvoerend-groen/tokens.js +2417 -3847
  29. package/dist/uitvoerend-hemelblauw/_variables.scss +51 -113
  30. package/dist/uitvoerend-hemelblauw/index.css +51 -113
  31. package/dist/uitvoerend-hemelblauw/index.d.ts +49 -111
  32. package/dist/uitvoerend-hemelblauw/index.js +51 -113
  33. package/dist/uitvoerend-hemelblauw/index.json +50 -112
  34. package/dist/uitvoerend-hemelblauw/index.tokens.json +71 -153
  35. package/dist/uitvoerend-hemelblauw/root.css +51 -113
  36. package/dist/uitvoerend-hemelblauw/tokens.d.ts +70 -152
  37. package/dist/uitvoerend-hemelblauw/tokens.js +2417 -3847
  38. package/dist/uitvoerend-mintgroen/_variables.scss +51 -113
  39. package/dist/uitvoerend-mintgroen/index.css +51 -113
  40. package/dist/uitvoerend-mintgroen/index.d.ts +49 -111
  41. package/dist/uitvoerend-mintgroen/index.js +51 -113
  42. package/dist/uitvoerend-mintgroen/index.json +50 -112
  43. package/dist/uitvoerend-mintgroen/index.tokens.json +71 -153
  44. package/dist/uitvoerend-mintgroen/root.css +51 -113
  45. package/dist/uitvoerend-mintgroen/tokens.d.ts +70 -152
  46. package/dist/uitvoerend-mintgroen/tokens.js +2417 -3847
  47. package/dist/uitvoerend-oranje/_variables.scss +74 -136
  48. package/dist/uitvoerend-oranje/index.css +74 -136
  49. package/dist/uitvoerend-oranje/index.d.ts +72 -134
  50. package/dist/uitvoerend-oranje/index.js +74 -136
  51. package/dist/uitvoerend-oranje/index.json +73 -135
  52. package/dist/uitvoerend-oranje/index.tokens.json +105 -187
  53. package/dist/uitvoerend-oranje/root.css +74 -136
  54. package/dist/uitvoerend-oranje/tokens.d.ts +101 -183
  55. package/dist/uitvoerend-oranje/tokens.js +3100 -4530
  56. package/dist/uitvoerend-paars/_variables.scss +51 -113
  57. package/dist/uitvoerend-paars/index.css +51 -113
  58. package/dist/uitvoerend-paars/index.d.ts +49 -111
  59. package/dist/uitvoerend-paars/index.js +51 -113
  60. package/dist/uitvoerend-paars/index.json +50 -112
  61. package/dist/uitvoerend-paars/index.tokens.json +71 -153
  62. package/dist/uitvoerend-paars/root.css +51 -113
  63. package/dist/uitvoerend-paars/tokens.d.ts +70 -152
  64. package/dist/uitvoerend-paars/tokens.js +2417 -3847
  65. package/dist/uitvoerend-violet/_variables.scss +51 -113
  66. package/dist/uitvoerend-violet/index.css +51 -113
  67. package/dist/uitvoerend-violet/index.d.ts +49 -111
  68. package/dist/uitvoerend-violet/index.js +51 -113
  69. package/dist/uitvoerend-violet/index.json +50 -112
  70. package/dist/uitvoerend-violet/index.tokens.json +71 -153
  71. package/dist/uitvoerend-violet/root.css +51 -113
  72. package/dist/uitvoerend-violet/tokens.d.ts +70 -152
  73. package/dist/uitvoerend-violet/tokens.js +2417 -3847
  74. package/dist/uitvoerend-violet-oud/_variables.scss +106 -168
  75. package/dist/uitvoerend-violet-oud/index.css +106 -168
  76. package/dist/uitvoerend-violet-oud/index.d.ts +104 -166
  77. package/dist/uitvoerend-violet-oud/index.js +106 -168
  78. package/dist/uitvoerend-violet-oud/index.json +105 -167
  79. package/dist/uitvoerend-violet-oud/index.tokens.json +138 -220
  80. package/dist/uitvoerend-violet-oud/root.css +106 -168
  81. package/dist/uitvoerend-violet-oud/tokens.d.ts +136 -218
  82. package/dist/uitvoerend-violet-oud/tokens.js +3558 -4988
  83. package/dist/wetgevend/_variables.scss +51 -113
  84. package/dist/wetgevend/index.css +51 -113
  85. package/dist/wetgevend/index.d.ts +49 -111
  86. package/dist/wetgevend/index.js +51 -113
  87. package/dist/wetgevend/index.json +50 -112
  88. package/dist/wetgevend/index.tokens.json +71 -153
  89. package/dist/wetgevend/root.css +51 -113
  90. package/dist/wetgevend/tokens.d.ts +70 -152
  91. package/dist/wetgevend/tokens.js +2417 -3847
  92. package/figma/figma.tokens.json +953 -906
  93. package/package.json +2 -2
  94. package/src/generated/base.tokens.json +4984 -5182
  95. package/src/generated/koop/tokens.json +261 -529
  96. package/src/generated/themes.json +2258 -4670
  97. package/src/generated/uitvoerend-groen/tokens.json +217 -485
  98. package/src/generated/uitvoerend-hemelblauw/tokens.json +217 -485
  99. package/src/generated/uitvoerend-mintgroen/tokens.json +217 -485
  100. package/src/generated/uitvoerend-oranje/tokens.json +304 -572
  101. package/src/generated/uitvoerend-paars/tokens.json +217 -485
  102. package/src/generated/uitvoerend-violet/tokens.json +217 -485
  103. package/src/generated/uitvoerend-violet-oud/tokens.json +482 -750
  104. package/src/generated/wetgevend/tokens.json +217 -485
  105. package/token-transformer.mjs +1 -3
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 22 Aug 2025 10:20:30 GMT
3
+ * Generated on Tue, 09 Sep 2025 07:01:24 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -323,6 +323,7 @@
323
323
  --rhc-sub-nav-bar-column-gap: 0.5rem;
324
324
  --rhc-sub-nav-bar-background-color: #f2f4f6;
325
325
  --rhc-color-none: transparent;
326
+ --rhc-color-transparent-30: #0000004d;
326
327
  --rhc-color-zwart: #000;
327
328
  --rhc-color-wit: #fff;
328
329
  --rhc-color-lintblauw-500: #154273;
@@ -457,6 +458,7 @@
457
458
  --rhc-color-border-strong: #0F172A;
458
459
  --rhc-color-border-subdued: #94A3B8;
459
460
  --rhc-color-border-default: #64748B;
461
+ --rhc-color-backdrop: #0000004d;
460
462
  --rhc-color-foreground-on-light-color: #000;
461
463
  --rhc-color-foreground-on-dark-color: #fff;
462
464
  --rhc-color-foreground-link: #01689b;
@@ -512,23 +514,6 @@
512
514
  --rhc-data-badge-button-hover-color: #fff;
513
515
  --rhc-data-badge-button-hover-background-color: #39870c;
514
516
  --rhc-data-badge-button-column-gap: 0.125rem;
515
- --rhc-accordion-button-line-height: 150%;
516
- --rhc-accordion-button-font-size: 1.25rem;
517
- --rhc-accordion-button-font-weight: 400;
518
- --rhc-accordion-button-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
519
- --rhc-accordion-button-icon-margin-block: 0.25rem;
520
- --rhc-accordion-button-expanded-color: #0F172A;
521
- --rhc-accordion-button-expanded-background-color: #fff;
522
- --rhc-accordion-button-padding-inline-start: 1rem;
523
- --rhc-accordion-button-padding-inline-end: 1rem;
524
- --rhc-accordion-button-padding-block-start: 0.75rem;
525
- --rhc-accordion-button-padding-block-end: 0.75rem;
526
- --rhc-accordion-section-border-width: 1px;
527
- --rhc-accordion-section-border-color: #94A3B8;
528
- --rhc-accordion-section-border-block-end-width: 1px;
529
- --rhc-accordion-header-margin: 0;
530
- --rhc-accordion-color: #0F172A;
531
- --rhc-accordion-border-radius: 0px;
532
517
  --rhc-keep-bottom-left-border-radius-bottom-left: 48px;
533
518
  --rhc-keep-bottom-left-border-radius-bottom-right: 0;
534
519
  --rhc-keep-bottom-left-border-radius-top-right: 0;
@@ -622,27 +607,6 @@
622
607
  --nl-skip-link-padding-block: 0.75rem;
623
608
  --nl-skip-link-color: #01689b;
624
609
  --nl-skip-link-background-color: #fff;
625
- --nl-skip-link-text-decoration: underline;
626
- --nl-skip-link-focus-visible-outline-color: #000;
627
- --nl-skip-link-focus-text-decoration: None;
628
- --nl-skip-link-focus-color: #0F172A;
629
- --nl-skip-link-focus-border-width: 2px;
630
- --nl-skip-link-focus-border-style: solid;
631
- --nl-skip-link-focus-border-color: #39870c;
632
- --nl-skip-link-focus-background-color: #fff;
633
- --nl-skip-link-box-block-end-shadow-spread-radius: 0;
634
- --nl-skip-link-box-block-end-shadow-offset-y: 16px;
635
- --nl-skip-link-box-block-end-shadow-offset-x: 0;
636
- --nl-skip-link-box-block-end-shadow-color: #0000001a;
637
- --nl-skip-link-box-block-end-shadow-blur-radius: 48px;
638
- --nl-skip-link-padding-inline-start: 1rem;
639
- --nl-skip-link-padding-inline-end: 1rem;
640
- --nl-skip-link-padding-block-start: 0.75rem;
641
- --nl-skip-link-padding-block-end: 0.75rem;
642
- --nl-skip-link-font-weight: 700;
643
- --nl-skip-link-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
644
- --nl-skip-link-border-width: 2px;
645
- --nl-skip-link-border-color: transparent;
646
610
  --nl-number-badge-padding-inline: 0.5rem;
647
611
  --nl-number-badge-padding-block: 0.125rem;
648
612
  --nl-number-badge-min-inline-size: 24px;
@@ -655,11 +619,9 @@
655
619
  --nl-number-badge-border-radius: 999px;
656
620
  --nl-number-badge-border-color: transparent;
657
621
  --nl-number-badge-background-color: #39870c;
658
- --nl-number-badge-line-height: 125%;
659
- --todo-skip-link-font-weight: 700;
660
622
  --todo-link-list-link-hover-text-decoration: underline;
661
- --todo-accordion-button-line-height: 150%;
662
- --todo-accordion-button-font-weight: 400;
623
+ --todo-accordion-button-line-height: 1.875rem;
624
+ --todo-accordion-button-font-weight: 700;
663
625
  --todo-accordion-button-font-size: 1.25rem;
664
626
  --todo-accordion-button-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
665
627
  --todo-figure-row-gap: 0.5rem;
@@ -728,6 +690,22 @@
728
690
  --utrecht-document-color: #0F172A;
729
691
  --utrecht-document-background-color: #fff;
730
692
  --utrecht-article-max-inline-size: 75ch;
693
+ --utrecht-backdrop-reduced-transparency-opacity: 0.98;
694
+ --utrecht-backdrop-fade-in-animation-duration: 400ms;
695
+ --utrecht-backdrop-opacity: 0.8;
696
+ --utrecht-backdrop-color: #0F172A;
697
+ --utrecht-backdrop-background-color: #0000004d;
698
+ --utrecht-drawer-padding-inline-end: 1rem;
699
+ --utrecht-drawer-padding-inline-start: 1rem;
700
+ --utrecht-drawer-padding-block-end: 1rem;
701
+ --utrecht-drawer-padding-block-start: 1rem;
702
+ --utrecht-drawer-max-block-size: 240px;
703
+ --utrecht-drawer-color: #0F172A;
704
+ --utrecht-drawer-border-width: 0px;
705
+ --utrecht-drawer-border-color: #64748B;
706
+ --utrecht-drawer-background-color: #fff;
707
+ --utrecht-drawer-z-index: 1;
708
+ --utrecht-drawer-max-inline-size: 256px;
731
709
  --utrecht-form-fieldset-invalid-border-inline-start-width: 0px;
732
710
  --utrecht-form-fieldset-invalid-padding-inline-start: 0rem;
733
711
  --utrecht-form-fieldset-invalid-border-inline-start-color: #d52b1e;
@@ -823,6 +801,11 @@
823
801
  --utrecht-column-layout-column-width: 400px;
824
802
  --utrecht-column-layout-column-rule-width: 0px;
825
803
  --utrecht-column-layout-column-rule-color: transparent;
804
+ --utrecht-action-group-row-gap: 0.5rem;
805
+ --utrecht-action-group-padding-block-start: 0rem;
806
+ --utrecht-action-group-padding-block-end: 0rem;
807
+ --utrecht-action-group-column-gap: 0.5rem;
808
+ --utrecht-action-group-background-color: transparent;
826
809
  --utrecht-ordered-list-item-padding-inline-start: 0.5rem;
827
810
  --utrecht-ordered-list-item-margin-block-start: 0.25rem;
828
811
  --utrecht-ordered-list-item-margin-block-end: 0.25rem;
@@ -877,11 +860,6 @@
877
860
  --utrecht-breadcrumb-nav-line-height: 150%;
878
861
  --utrecht-breadcrumb-nav-font-size: 1.25rem;
879
862
  --utrecht-breadcrumb-nav-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
880
- --utrecht-button-group-row-gap: 0.5rem;
881
- --utrecht-button-group-padding-block-start: 0px;
882
- --utrecht-button-group-padding-block-end: 0px;
883
- --utrecht-button-group-column-gap: 0.5rem;
884
- --utrecht-button-group-background-color: transparent;
885
863
  --utrecht-button-group-margin-block-start: 0rem;
886
864
  --utrecht-button-group-margin-block-end: 0rem;
887
865
  --utrecht-button-subtle-active-color: #225107;
@@ -984,49 +962,11 @@
984
962
  --utrecht-data-badge-color: #39870c;
985
963
  --utrecht-data-badge-border-radius: 10px;
986
964
  --utrecht-data-badge-background-color: #e1eddb;
987
- --utrecht-skip-link-text-decoration: underline;
988
- --utrecht-skip-link-padding-inline-start: 1rem;
989
- --utrecht-skip-link-padding-inline-end: 1rem;
990
- --utrecht-skip-link-padding-block-start: 0.75rem;
991
- --utrecht-skip-link-padding-block-end: 0.75rem;
992
- --utrecht-skip-link-min-inline-size: 48px;
993
- --utrecht-skip-link-min-block-size: 48px;
994
- --utrecht-skip-link-color: #01689b;
995
- --utrecht-skip-link-background-color: #fff;
996
- --utrecht-skip-link-font-size: 1.25rem;
997
- --utrecht-skip-link-text-underline-offset: 0.125rem;
998
- --utrecht-skip-link-border-width: 2px;
999
- --utrecht-skip-link-line-height: 150%;
1000
- --utrecht-skip-link-font-weight: 700;
1001
- --utrecht-skip-link-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1002
- --utrecht-skip-link-focus-visible-text-decoration: underline;
1003
- --utrecht-skip-link-focus-visible-outline-color: #000;
1004
- --utrecht-skip-link-box-block-end-shadow-spread-radius: 0;
1005
- --utrecht-skip-link-box-block-end-shadow-offset-y: 16px;
1006
- --utrecht-skip-link-box-block-end-shadow-offset-x: 0;
1007
- --utrecht-skip-link-box-block-end-shadow-blur-radius: 48px;
1008
- --utrecht-skip-link-box-block-end-shadow-color: #0000001a;
1009
- --utrecht-skip-link-border-color: transparent;
1010
- --utrecht-skip-link-focus-color: #01689b;
1011
- --utrecht-skip-link-focus-background-color: #fff;
1012
- --utrecht-skip-link-focus-border-style: solid;
1013
- --utrecht-skip-link-focus-border-width: 2px;
1014
- --utrecht-skip-link-focus-border-color: #39870c;
1015
- --utrecht-skip-link-focus-text-decoration: None;
1016
965
  --utrecht-accordion-section-margin-block-start: 0rem;
1017
966
  --utrecht-accordion-section-margin-block-end: 0rem;
1018
967
  --utrecht-accordion-section-border-width: 1px;
1019
968
  --utrecht-accordion-section-hover-border-color: #94A3B8;
1020
969
  --utrecht-accordion-section-border-color: #94A3B8;
1021
- --utrecht-accordion-panel-padding-inline-start: 1rem;
1022
- --utrecht-accordion-panel-padding-inline-end: 1rem;
1023
- --utrecht-accordion-panel-padding-block-start: 1rem;
1024
- --utrecht-accordion-panel-padding-block-end: 1.5rem;
1025
- --utrecht-accordion-panel-border-width: 1px;
1026
- --utrecht-accordion-panel-border-color: transparent;
1027
- --utrecht-accordion-row-gap: 0rem;
1028
- --utrecht-accordion-margin-block-start: 0rem;
1029
- --utrecht-accordion-margin-block-end: 0rem;
1030
970
  --utrecht-accordion-button-focus-visible-color: #0F172A;
1031
971
  --utrecht-accordion-button-focus-visible-border-width: 1px;
1032
972
  --utrecht-accordion-button-focus-visible-border-color: transparent;
@@ -1034,6 +974,9 @@
1034
974
  --utrecht-accordion-button-hover-color: #0F172A;
1035
975
  --utrecht-accordion-button-hover-border-color: transparent;
1036
976
  --utrecht-accordion-button-hover-background-color: #F8FAFC;
977
+ --utrecht-accordion-button-active-color: #0F172A;
978
+ --utrecht-accordion-button-active-border-color: transparent;
979
+ --utrecht-accordion-button-active-background-color: #F1F5F9;
1037
980
  --utrecht-accordion-button-icon-size: 24px;
1038
981
  --utrecht-accordion-button-padding-inline-start: 1rem;
1039
982
  --utrecht-accordion-button-padding-inline-end: 1rem;
@@ -1045,13 +988,15 @@
1045
988
  --utrecht-accordion-button-border-radius: 0px;
1046
989
  --utrecht-accordion-button-border-color: transparent;
1047
990
  --utrecht-accordion-button-background-color: #fff;
1048
- --utrecht-accordion-button-focus-color: #0F172A;
1049
- --utrecht-accordion-button-focus-border-color: #39870c;
1050
- --utrecht-accordion-button-focus-background-color: #e1eddb;
1051
- --utrecht-accordion-button-active-color: #0F172A;
1052
- --utrecht-accordion-button-active-border-color: transparent;
1053
- --utrecht-accordion-button-active-background-color: #F1F5F9;
1054
- --utrecht-accordion-button-active-row-gap: 0;
991
+ --utrecht-accordion-panel-padding-inline-start: 1rem;
992
+ --utrecht-accordion-panel-padding-inline-end: 1rem;
993
+ --utrecht-accordion-panel-padding-block-start: 1rem;
994
+ --utrecht-accordion-panel-padding-block-end: 1.5rem;
995
+ --utrecht-accordion-panel-border-width: 1px;
996
+ --utrecht-accordion-panel-border-color: transparent;
997
+ --utrecht-accordion-row-gap: 0rem;
998
+ --utrecht-accordion-margin-block-start: 0rem;
999
+ --utrecht-accordion-margin-block-end: 0rem;
1055
1000
  --utrecht-alert-icon-warning-color: #ffb612;
1056
1001
  --utrecht-alert-icon-ok-color: #39870c;
1057
1002
  --utrecht-alert-icon-info-color: #007bc7;
@@ -1065,6 +1010,7 @@
1065
1010
  --utrecht-alert-ok-color: #000;
1066
1011
  --utrecht-alert-ok-border-color: transparent;
1067
1012
  --utrecht-alert-ok-background-color: #e1eddb;
1013
+ --utrecht-alert-message-row-gap: 0rem;
1068
1014
  --utrecht-alert-info-color: #000;
1069
1015
  --utrecht-alert-info-border-color: transparent;
1070
1016
  --utrecht-alert-info-background-color: #d9ebf7;
@@ -1084,13 +1030,6 @@
1084
1030
  --utrecht-alert-border-radius: 5px;
1085
1031
  --utrecht-alert-border-color: transparent;
1086
1032
  --utrecht-alert-background-color: #d9ebf7;
1087
- --utrecht-alert-message-row-gap: 0rem;
1088
- --utrecht-alert-message-line-height: 150%;
1089
- --utrecht-alert-message-column-gap: 0.5rem;
1090
- --utrecht-alert-heading-line-height: 150%;
1091
- --utrecht-alert-heading-font-weight: 700;
1092
- --utrecht-alert-heading-font-size: 1.25rem;
1093
- --utrecht-alert-heading-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1094
1033
  --utrecht-blockquote-attribution-font-size: 1.25rem;
1095
1034
  --utrecht-blockquote-attribution-color: #154273;
1096
1035
  --utrecht-blockquote-row-gap: 0.75rem;
@@ -1146,18 +1085,6 @@
1146
1085
  --utrecht-blockquote-border-end-end-radius: 0;
1147
1086
  --utrecht-blockquote-border-block-start-width: 0;
1148
1087
  --utrecht-blockquote-border-block-end-width: 0;
1149
- --utrecht-figure-img-border-start-start-radius: 0;
1150
- --utrecht-figure-img-border-start-end-radius: 0;
1151
- --utrecht-figure-img-border-end-start-radius: 0;
1152
- --utrecht-figure-img-border-end-end-radius: 0;
1153
- --utrecht-figure-caption-line-height: 150%;
1154
- --utrecht-figure-caption-font-size: 1.25rem;
1155
- --utrecht-figure-caption-color: #0F172A;
1156
- --utrecht-figure-caption-padding-inline-start: 1rem;
1157
- --utrecht-figure-caption-padding-block-start: 0.5rem;
1158
- --utrecht-figure-caption-padding-block-end: 0.5rem;
1159
- --utrecht-figure-caption-border-width: 4px;
1160
- --utrecht-figure-caption-border-color: #CBD5E1;
1161
1088
  --utrecht-number-badge-padding-inline: 0.5rem;
1162
1089
  --utrecht-number-badge-padding-block: 0.125rem;
1163
1090
  --utrecht-number-badge-min-inline-size: 24px;
@@ -1170,7 +1097,18 @@
1170
1097
  --utrecht-number-badge-border-radius: 999px;
1171
1098
  --utrecht-number-badge-border-color: transparent;
1172
1099
  --utrecht-number-badge-background-color: #39870c;
1173
- --utrecht-number-badge-line-height: 125%;
1100
+ --utrecht-figure-img-border-start-start-radius: 0;
1101
+ --utrecht-figure-img-border-start-end-radius: 0;
1102
+ --utrecht-figure-img-border-end-start-radius: 0;
1103
+ --utrecht-figure-img-border-end-end-radius: 0;
1104
+ --utrecht-figure-caption-line-height: 150%;
1105
+ --utrecht-figure-caption-font-size: 1.25rem;
1106
+ --utrecht-figure-caption-color: #0F172A;
1107
+ --utrecht-figure-caption-padding-inline-start: 1rem;
1108
+ --utrecht-figure-caption-padding-block-start: 0.5rem;
1109
+ --utrecht-figure-caption-padding-block-end: 0.5rem;
1110
+ --utrecht-figure-caption-border-width: 4px;
1111
+ --utrecht-figure-caption-border-color: #CBD5E1;
1174
1112
  --utrecht-form-label-disabled-color: #94A3B8;
1175
1113
  --utrecht-form-label-checked-font-weight: 400;
1176
1114
  --utrecht-form-label-radio-font-weight: 400;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 22 Aug 2025 10:20:30 GMT
3
+ * Generated on Tue, 09 Sep 2025 07:01:24 GMT
4
4
  */
5
5
 
6
6
  export default tokens;
@@ -393,21 +393,6 @@ declare const tokens: {
393
393
  "color": DesignToken
394
394
  }
395
395
  },
396
- "number-badge": {
397
- "line-height": DesignToken,
398
- "background-color": DesignToken,
399
- "border-color": DesignToken,
400
- "border-radius": DesignToken,
401
- "border-width": DesignToken,
402
- "color": DesignToken,
403
- "font-family": DesignToken,
404
- "font-size": DesignToken,
405
- "font-weight": DesignToken,
406
- "min-block-size": DesignToken,
407
- "min-inline-size": DesignToken,
408
- "padding-block": DesignToken,
409
- "padding-inline": DesignToken
410
- },
411
396
  "figure": {
412
397
  "caption": {
413
398
  "border-color": DesignToken,
@@ -426,6 +411,20 @@ declare const tokens: {
426
411
  "border-start-start-radius": DesignToken
427
412
  }
428
413
  },
414
+ "number-badge": {
415
+ "background-color": DesignToken,
416
+ "border-color": DesignToken,
417
+ "border-radius": DesignToken,
418
+ "border-width": DesignToken,
419
+ "color": DesignToken,
420
+ "font-family": DesignToken,
421
+ "font-size": DesignToken,
422
+ "font-weight": DesignToken,
423
+ "min-block-size": DesignToken,
424
+ "min-inline-size": DesignToken,
425
+ "padding-block": DesignToken,
426
+ "padding-inline": DesignToken
427
+ },
429
428
  "blockquote": {
430
429
  "border-block-end-width": DesignToken,
431
430
  "border-block-start-width": DesignToken,
@@ -498,17 +497,6 @@ declare const tokens: {
498
497
  }
499
498
  },
500
499
  "alert": {
501
- "heading": {
502
- "font-family": DesignToken,
503
- "font-size": DesignToken,
504
- "font-weight": DesignToken,
505
- "line-height": DesignToken
506
- },
507
- "message": {
508
- "column-gap": DesignToken,
509
- "line-height": DesignToken,
510
- "row-gap": DesignToken
511
- },
512
500
  "background-color": DesignToken,
513
501
  "border-color": DesignToken,
514
502
  "border-radius": DesignToken,
@@ -534,6 +522,9 @@ declare const tokens: {
534
522
  "border-color": DesignToken,
535
523
  "color": DesignToken
536
524
  },
525
+ "message": {
526
+ "row-gap": DesignToken
527
+ },
537
528
  "ok": {
538
529
  "background-color": DesignToken,
539
530
  "border-color": DesignToken,
@@ -563,18 +554,18 @@ declare const tokens: {
563
554
  }
564
555
  },
565
556
  "accordion": {
557
+ "margin-block-end": DesignToken,
558
+ "margin-block-start": DesignToken,
559
+ "row-gap": DesignToken,
560
+ "panel": {
561
+ "border-color": DesignToken,
562
+ "border-width": DesignToken,
563
+ "padding-block-end": DesignToken,
564
+ "padding-block-start": DesignToken,
565
+ "padding-inline-end": DesignToken,
566
+ "padding-inline-start": DesignToken
567
+ },
566
568
  "button": {
567
- "active": {
568
- "row-gap": DesignToken,
569
- "background-color": DesignToken,
570
- "border-color": DesignToken,
571
- "color": DesignToken
572
- },
573
- "focus": {
574
- "background-color": DesignToken,
575
- "border-color": DesignToken,
576
- "color": DesignToken
577
- },
578
569
  "background-color": DesignToken,
579
570
  "border-color": DesignToken,
580
571
  "border-radius": DesignToken,
@@ -588,6 +579,11 @@ declare const tokens: {
588
579
  "icon": {
589
580
  "size": DesignToken
590
581
  },
582
+ "active": {
583
+ "background-color": DesignToken,
584
+ "border-color": DesignToken,
585
+ "color": DesignToken
586
+ },
591
587
  "hover": {
592
588
  "background-color": DesignToken,
593
589
  "border-color": DesignToken,
@@ -600,17 +596,6 @@ declare const tokens: {
600
596
  "color": DesignToken
601
597
  }
602
598
  },
603
- "margin-block-end": DesignToken,
604
- "margin-block-start": DesignToken,
605
- "row-gap": DesignToken,
606
- "panel": {
607
- "border-color": DesignToken,
608
- "border-width": DesignToken,
609
- "padding-block-end": DesignToken,
610
- "padding-block-start": DesignToken,
611
- "padding-inline-end": DesignToken,
612
- "padding-inline-start": DesignToken
613
- },
614
599
  "section": {
615
600
  "border-color": DesignToken,
616
601
  "hover": {
@@ -621,43 +606,6 @@ declare const tokens: {
621
606
  "margin-block-start": DesignToken
622
607
  }
623
608
  },
624
- "skip-link": {
625
- "focus": {
626
- "text-decoration": DesignToken,
627
- "border-color": DesignToken,
628
- "border-width": DesignToken,
629
- "border-style": DesignToken,
630
- "background-color": DesignToken,
631
- "color": DesignToken
632
- },
633
- "border-color": DesignToken,
634
- "box-block-end-shadow": {
635
- "color": DesignToken,
636
- "blur-radius": DesignToken,
637
- "offset-x": DesignToken,
638
- "offset-y": DesignToken,
639
- "spread-radius": DesignToken
640
- },
641
- "focus-visible": {
642
- "outline-color": DesignToken,
643
- "text-decoration": DesignToken
644
- },
645
- "font-family": DesignToken,
646
- "font-weight": DesignToken,
647
- "line-height": DesignToken,
648
- "border-width": DesignToken,
649
- "text-underline-offset": DesignToken,
650
- "font-size": DesignToken,
651
- "background-color": DesignToken,
652
- "color": DesignToken,
653
- "min-block-size": DesignToken,
654
- "min-inline-size": DesignToken,
655
- "padding-block-end": DesignToken,
656
- "padding-block-start": DesignToken,
657
- "padding-inline-end": DesignToken,
658
- "padding-inline-start": DesignToken,
659
- "text-decoration": DesignToken
660
- },
661
609
  "data-badge": {
662
610
  "background-color": DesignToken,
663
611
  "border-radius": DesignToken,
@@ -812,12 +760,7 @@ declare const tokens: {
812
760
  },
813
761
  "button-group": {
814
762
  "margin-block-end": DesignToken,
815
- "margin-block-start": DesignToken,
816
- "background-color": DesignToken,
817
- "column-gap": DesignToken,
818
- "padding-block-end": DesignToken,
819
- "padding-block-start": DesignToken,
820
- "row-gap": DesignToken
763
+ "margin-block-start": DesignToken
821
764
  },
822
765
  "breadcrumb-nav": {
823
766
  "font-family": DesignToken,
@@ -927,6 +870,13 @@ declare const tokens: {
927
870
  "padding-inline-start": DesignToken
928
871
  }
929
872
  },
873
+ "action-group": {
874
+ "background-color": DesignToken,
875
+ "column-gap": DesignToken,
876
+ "padding-block-end": DesignToken,
877
+ "padding-block-start": DesignToken,
878
+ "row-gap": DesignToken
879
+ },
930
880
  "column-layout": {
931
881
  "column-rule-color": DesignToken,
932
882
  "column-rule-width": DesignToken,
@@ -1082,6 +1032,30 @@ declare const tokens: {
1082
1032
  "border-inline-start-width": DesignToken
1083
1033
  }
1084
1034
  },
1035
+ "drawer": {
1036
+ "max-inline-size": DesignToken,
1037
+ "z-index": DesignToken,
1038
+ "background-color": DesignToken,
1039
+ "border-color": DesignToken,
1040
+ "border-width": DesignToken,
1041
+ "color": DesignToken,
1042
+ "max-block-size": DesignToken,
1043
+ "padding-block-start": DesignToken,
1044
+ "padding-block-end": DesignToken,
1045
+ "padding-inline-start": DesignToken,
1046
+ "padding-inline-end": DesignToken
1047
+ },
1048
+ "backdrop": {
1049
+ "background-color": DesignToken,
1050
+ "color": DesignToken,
1051
+ "opacity": DesignToken,
1052
+ "fade-in": {
1053
+ "animation-duration": DesignToken
1054
+ },
1055
+ "reduced-transparency": {
1056
+ "opacity": DesignToken
1057
+ }
1058
+ },
1085
1059
  "article": {
1086
1060
  "max-inline-size": DesignToken
1087
1061
  },
@@ -1230,14 +1204,10 @@ declare const tokens: {
1230
1204
  "text-decoration": DesignToken
1231
1205
  }
1232
1206
  }
1233
- },
1234
- "skip-link": {
1235
- "font-weight": DesignToken
1236
1207
  }
1237
1208
  },
1238
1209
  "nl": {
1239
1210
  "number-badge": {
1240
- "line-height": DesignToken,
1241
1211
  "background-color": DesignToken,
1242
1212
  "border-color": DesignToken,
1243
1213
  "border-radius": DesignToken,
@@ -1252,33 +1222,6 @@ declare const tokens: {
1252
1222
  "padding-inline": DesignToken
1253
1223
  },
1254
1224
  "skip-link": {
1255
- "border-color": DesignToken,
1256
- "border-width": DesignToken,
1257
- "font-family": DesignToken,
1258
- "font-weight": DesignToken,
1259
- "padding-block-end": DesignToken,
1260
- "padding-block-start": DesignToken,
1261
- "padding-inline-end": DesignToken,
1262
- "padding-inline-start": DesignToken,
1263
- "box-block-end-shadow": {
1264
- "blur-radius": DesignToken,
1265
- "color": DesignToken,
1266
- "offset-x": DesignToken,
1267
- "offset-y": DesignToken,
1268
- "spread-radius": DesignToken
1269
- },
1270
- "focus": {
1271
- "background-color": DesignToken,
1272
- "border-color": DesignToken,
1273
- "border-style": DesignToken,
1274
- "border-width": DesignToken,
1275
- "color": DesignToken,
1276
- "text-decoration": DesignToken
1277
- },
1278
- "focus-visible": {
1279
- "outline-color": DesignToken
1280
- },
1281
- "text-decoration": DesignToken,
1282
1225
  "background-color": DesignToken,
1283
1226
  "color": DesignToken,
1284
1227
  "padding-block": DesignToken,
@@ -1413,35 +1356,6 @@ declare const tokens: {
1413
1356
  "borderRadiusBottomLeft": DesignToken
1414
1357
  }
1415
1358
  },
1416
- "accordion": {
1417
- "border-radius": DesignToken,
1418
- "color": DesignToken,
1419
- "header": {
1420
- "margin": DesignToken
1421
- },
1422
- "section": {
1423
- "border-block-end-width": DesignToken,
1424
- "border-color": DesignToken,
1425
- "border-width": DesignToken
1426
- },
1427
- "button": {
1428
- "padding-block-end": DesignToken,
1429
- "padding-block-start": DesignToken,
1430
- "padding-inline-end": DesignToken,
1431
- "padding-inline-start": DesignToken,
1432
- "expanded": {
1433
- "background-color": DesignToken,
1434
- "color": DesignToken
1435
- },
1436
- "icon": {
1437
- "margin-block": DesignToken
1438
- },
1439
- "font-family": DesignToken,
1440
- "font-weight": DesignToken,
1441
- "font-size": DesignToken,
1442
- "line-height": DesignToken
1443
- }
1444
- },
1445
1359
  "data-badge-button": {
1446
1360
  "column-gap": DesignToken,
1447
1361
  "hover": {
@@ -1542,6 +1456,7 @@ declare const tokens: {
1542
1456
  "on-dark-color": DesignToken,
1543
1457
  "on-light-color": DesignToken
1544
1458
  },
1459
+ "backdrop": DesignToken,
1545
1460
  "border": {
1546
1461
  "default": DesignToken,
1547
1462
  "subdued": DesignToken,
@@ -1730,6 +1645,9 @@ declare const tokens: {
1730
1645
  },
1731
1646
  "wit": DesignToken,
1732
1647
  "zwart": DesignToken,
1648
+ "transparent": {
1649
+ "30": DesignToken
1650
+ },
1733
1651
  "none": DesignToken
1734
1652
  },
1735
1653
  "sub-nav-bar": {