villa-design-tokens 1.0.321 → 1.0.322

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.
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "villa-design-tokens",
3
3
  "description": "Design Tokens published by Design Token Studio with VPRO's Figma Design System- retest again",
4
4
  "author": "VPRO",
5
- "version": "1.0.321",
5
+ "version": "1.0.322",
6
6
  "repository": {
7
7
  "type": "git",
8
8
  "url": "git+https://github.com/vpro/Design-tokens.git"
@@ -10,6 +10,7 @@
10
10
  "brands/brainwash",
11
11
  "brands/tegenlicht",
12
12
  "brands/3voor12",
13
+ "brands/3voor12 lokaal",
13
14
  "brands/vprogids",
14
15
  "brands/vprocinema"
15
16
  ]
@@ -0,0 +1,822 @@
1
+ {
2
+ "color": {
3
+ "palette": {
4
+ "primary": {
5
+ "faded": {
6
+ "value": "{color.global.grey.150}",
7
+ "type": "color"
8
+ },
9
+ "pastel": {
10
+ "value": "{color.global.midnight.50}",
11
+ "type": "color"
12
+ },
13
+ "main": {
14
+ "value": "{color.global.midnight.100}",
15
+ "type": "color"
16
+ },
17
+ "muted": {
18
+ "value": "{color.global.midnight.150}",
19
+ "type": "color"
20
+ },
21
+ "dark": {
22
+ "value": "{color.global.midnight.200}",
23
+ "type": "color"
24
+ }
25
+ },
26
+ "secondary": {
27
+ "faded": {
28
+ "value": "{color.global.dandelion.25}",
29
+ "type": "color"
30
+ },
31
+ "pastel": {
32
+ "value": "{color.global.dandelion.50}",
33
+ "type": "color"
34
+ },
35
+ "main": {
36
+ "value": "{color.global.dandelion.100}",
37
+ "type": "color"
38
+ },
39
+ "muted": {
40
+ "value": "{color.global.dandelion.150}",
41
+ "type": "color"
42
+ },
43
+ "dark": {
44
+ "value": "{color.global.dandelion.200}",
45
+ "type": "color"
46
+ }
47
+ },
48
+ "tertiary": {
49
+ "faded": {
50
+ "value": "{color.global.orchid.25}",
51
+ "type": "color"
52
+ },
53
+ "pastel": {
54
+ "value": "{color.global.amethyst.50}",
55
+ "type": "color"
56
+ },
57
+ "main": {
58
+ "value": "{color.global.orchid.100}",
59
+ "type": "color"
60
+ },
61
+ "muted": {
62
+ "value": "{color.global.orchid.150}",
63
+ "type": "color"
64
+ },
65
+ "dark": {
66
+ "value": "{color.global.orchid.200}",
67
+ "type": "color"
68
+ }
69
+ },
70
+ "greyscale": {
71
+ "faded": {
72
+ "value": "{color.global.grey.100}",
73
+ "type": "color"
74
+ },
75
+ "pastel": {
76
+ "value": "{color.global.grey.150}",
77
+ "type": "color"
78
+ },
79
+ "main": {
80
+ "value": "{color.global.grey.300}",
81
+ "type": "color"
82
+ },
83
+ "muted": {
84
+ "value": "{color.global.grey.450}",
85
+ "type": "color"
86
+ },
87
+ "dark": {
88
+ "value": "{color.global.grey.500}",
89
+ "type": "color"
90
+ }
91
+ }
92
+ },
93
+ "background": {
94
+ "default": {
95
+ "value": "{color.global.grey.100}",
96
+ "type": "color"
97
+ },
98
+ "primary": {
99
+ "value": "{color.palette.primary.faded}",
100
+ "type": "color"
101
+ },
102
+ "secondary": {
103
+ "value": "{color.palette.primary.pastel}",
104
+ "type": "color"
105
+ },
106
+ "tertiary": {
107
+ "value": "{color.palette.secondary.pastel}",
108
+ "type": "color"
109
+ },
110
+ "brand": {
111
+ "value": "{color.palette.primary.main}",
112
+ "type": "color"
113
+ },
114
+ "interactive": {
115
+ "value": "{color.palette.secondary.main}",
116
+ "type": "color"
117
+ },
118
+ "dark": {
119
+ "value": "{color.palette.primary.dark}",
120
+ "type": "color"
121
+ },
122
+ "disabled": {
123
+ "value": "{color.global.grey.200}",
124
+ "type": "color"
125
+ },
126
+ "neutral-light": {
127
+ "value": "{color.palette.greyscale.pastel}",
128
+ "type": "color"
129
+ },
130
+ "neutral-dark": {
131
+ "value": "{color.palette.greyscale.muted}",
132
+ "type": "color"
133
+ }
134
+ },
135
+ "text": {
136
+ "default": {
137
+ "value": "{color.palette.greyscale.dark}",
138
+ "type": "color"
139
+ },
140
+ "title": {
141
+ "value": "{color.palette.primary.muted}",
142
+ "type": "color"
143
+ },
144
+ "subtle": {
145
+ "value": "{color.global.grey.400}",
146
+ "type": "color"
147
+ },
148
+ "disabled": {
149
+ "value": "{color.global.grey.300}",
150
+ "type": "color"
151
+ },
152
+ "inverse": {
153
+ "value": "{color.global.grey.100}",
154
+ "type": "color"
155
+ },
156
+ "neutral": {
157
+ "value": "{color.palette.greyscale.dark}",
158
+ "type": "color"
159
+ }
160
+ },
161
+ "icon": {
162
+ "primary": {
163
+ "value": "{color.palette.primary.dark}",
164
+ "type": "color"
165
+ },
166
+ "secondary": {
167
+ "value": "{color.palette.primary.pastel}",
168
+ "type": "color"
169
+ },
170
+ "tertiary": {
171
+ "value": "{color.global.grey.300}",
172
+ "type": "color"
173
+ },
174
+ "inverse": {
175
+ "value": "{color.global.grey.100}",
176
+ "type": "color"
177
+ }
178
+ },
179
+ "border": {
180
+ "default": {
181
+ "value": "{color.global.grey.300}",
182
+ "type": "color"
183
+ },
184
+ "focus": {
185
+ "value": "{color.palette.tertiary.dark}",
186
+ "type": "color"
187
+ },
188
+ "inverse": {
189
+ "value": "{color.palette.secondary.faded}",
190
+ "type": "color"
191
+ }
192
+ },
193
+ "link": {
194
+ "default": {
195
+ "value": "{color.palette.secondary.muted}",
196
+ "type": "color"
197
+ },
198
+ "hover": {
199
+ "value": "{color.palette.primary.dark}",
200
+ "type": "color"
201
+ },
202
+ "active": {
203
+ "value": "{color.palette.secondary.dark}",
204
+ "type": "color"
205
+ },
206
+ "inverse": {
207
+ "value": "{color.palette.secondary.faded}",
208
+ "type": "color"
209
+ },
210
+ "inverse-hover": {
211
+ "value": "{color.palette.primary.faded}",
212
+ "type": "color"
213
+ }
214
+ },
215
+ "input": {
216
+ "background": {
217
+ "value": "{color.palette.greyscale.faded}",
218
+ "type": "color"
219
+ },
220
+ "foreground": {
221
+ "value": "{color.palette.greyscale.dark}",
222
+ "type": "color"
223
+ },
224
+ "border-default": {
225
+ "value": "{color.palette.greyscale.main}",
226
+ "type": "color"
227
+ },
228
+ "border-active": {
229
+ "value": "{color.palette.tertiary.dark}",
230
+ "type": "color"
231
+ }
232
+ },
233
+ "interactive": {
234
+ "primary": {
235
+ "background": {
236
+ "default": {
237
+ "value": "{color.palette.secondary.main}",
238
+ "type": "color"
239
+ },
240
+ "hover": {
241
+ "value": "{color.palette.secondary.muted}",
242
+ "type": "color"
243
+ },
244
+ "active": {
245
+ "value": "{color.palette.secondary.dark}",
246
+ "type": "color"
247
+ }
248
+ },
249
+ "foreground": {
250
+ "default": {
251
+ "value": "{color.palette.greyscale.dark}",
252
+ "type": "color"
253
+ },
254
+ "hover": {
255
+ "value": "{color.palette.greyscale.faded}",
256
+ "type": "color"
257
+ },
258
+ "active": {
259
+ "value": "{color.palette.greyscale.faded}",
260
+ "type": "color"
261
+ }
262
+ }
263
+ },
264
+ "secondary": {
265
+ "background": {
266
+ "default": {
267
+ "value": "{color.palette.secondary.muted}",
268
+ "type": "color"
269
+ },
270
+ "hover": {
271
+ "value": "{color.palette.secondary.muted}",
272
+ "type": "color"
273
+ },
274
+ "active": {
275
+ "value": "{color.palette.secondary.dark}",
276
+ "type": "color"
277
+ }
278
+ },
279
+ "foreground": {
280
+ "default": {
281
+ "value": "{color.palette.greyscale.dark}",
282
+ "type": "color"
283
+ },
284
+ "hover": {
285
+ "value": "{color.palette.greyscale.faded}",
286
+ "type": "color"
287
+ },
288
+ "active": {
289
+ "value": "{color.palette.greyscale.faded}",
290
+ "type": "color"
291
+ }
292
+ }
293
+ },
294
+ "tertiary": {
295
+ "background": {
296
+ "default": {
297
+ "value": "{color.transparent.0}",
298
+ "type": "color"
299
+ },
300
+ "hover": {
301
+ "value": "{color.palette.secondary.muted}",
302
+ "type": "color"
303
+ },
304
+ "active": {
305
+ "value": "{color.palette.secondary.dark}",
306
+ "type": "color"
307
+ }
308
+ },
309
+ "foreground": {
310
+ "default": {
311
+ "value": "{color.palette.secondary.muted}",
312
+ "type": "color"
313
+ },
314
+ "hover": {
315
+ "value": "{color.palette.greyscale.faded}",
316
+ "type": "color"
317
+ },
318
+ "active": {
319
+ "value": "{color.palette.greyscale.faded}",
320
+ "type": "color"
321
+ }
322
+ }
323
+ }
324
+ },
325
+ "surface": {
326
+ "primary": {
327
+ "background": {
328
+ "value": "{color.palette.primary.faded}",
329
+ "type": "color"
330
+ },
331
+ "accent": {
332
+ "value": "{color.palette.primary.pastel}",
333
+ "type": "color",
334
+ "$extensions": {
335
+ "studio.tokens": {
336
+ "modify": {
337
+ "type": "alpha",
338
+ "value": ".33",
339
+ "space": "lch"
340
+ }
341
+ }
342
+ }
343
+ },
344
+ "text": {
345
+ "default": {
346
+ "value": "{color.palette.primary.dark}",
347
+ "type": "color"
348
+ },
349
+ "subtle": {
350
+ "value": "{color.palette.primary.muted}",
351
+ "type": "color"
352
+ },
353
+ "title": {
354
+ "value": "{color.palette.primary.main}",
355
+ "type": "color"
356
+ },
357
+ "link": {
358
+ "value": "{color.palette.secondary.muted}",
359
+ "type": "color"
360
+ },
361
+ "hover": {
362
+ "value": "{color.palette.secondary.dark}",
363
+ "type": "color"
364
+ }
365
+ },
366
+ "interactive": {
367
+ "background": {
368
+ "value": "{color.palette.secondary.main}",
369
+ "type": "color"
370
+ },
371
+ "foreground": {
372
+ "value": "{color.palette.greyscale.faded}",
373
+ "type": "color"
374
+ },
375
+ "hover-background": {
376
+ "value": "{color.palette.secondary.muted}",
377
+ "type": "color"
378
+ },
379
+ "hover-foreground": {
380
+ "value": "{color.palette.greyscale.faded}",
381
+ "type": "color"
382
+ }
383
+ },
384
+ "input": {
385
+ "background": {
386
+ "value": "{color.global.grey.100}",
387
+ "type": "color"
388
+ },
389
+ "foreground": {
390
+ "value": "{color.palette.primary.muted}",
391
+ "type": "color"
392
+ },
393
+ "border-default": {
394
+ "value": "{color.palette.tertiary.muted}",
395
+ "type": "color"
396
+ },
397
+ "border-active": {
398
+ "value": "{color.palette.tertiary.main}",
399
+ "type": "color"
400
+ }
401
+ }
402
+ },
403
+ "secondary": {
404
+ "background": {
405
+ "value": "{color.palette.secondary.faded}",
406
+ "type": "color"
407
+ },
408
+ "accent": {
409
+ "value": "{color.palette.secondary.pastel}",
410
+ "type": "color",
411
+ "$extensions": {
412
+ "studio.tokens": {
413
+ "modify": {
414
+ "type": "alpha",
415
+ "value": ".33",
416
+ "space": "srgb"
417
+ }
418
+ }
419
+ }
420
+ },
421
+ "text": {
422
+ "default": {
423
+ "value": "{color.palette.greyscale.dark}",
424
+ "type": "color"
425
+ },
426
+ "subtle": {
427
+ "value": "{color.palette.greyscale.dark}",
428
+ "type": "color"
429
+ },
430
+ "title": {
431
+ "value": "{color.palette.greyscale.dark}",
432
+ "type": "color"
433
+ },
434
+ "link": {
435
+ "value": "{color.palette.secondary.muted}",
436
+ "type": "color"
437
+ },
438
+ "hover": {
439
+ "value": "{color.palette.secondary.dark}",
440
+ "type": "color"
441
+ }
442
+ },
443
+ "interactive": {
444
+ "background": {
445
+ "value": "{color.palette.primary.main}",
446
+ "type": "color"
447
+ },
448
+ "foreground": {
449
+ "value": "{color.palette.greyscale.faded}",
450
+ "type": "color"
451
+ },
452
+ "hover-background": {
453
+ "value": "{color.palette.primary.muted}",
454
+ "type": "color"
455
+ },
456
+ "hover-foreground": {
457
+ "value": "{color.palette.greyscale.faded}",
458
+ "type": "color"
459
+ }
460
+ },
461
+ "input": {
462
+ "background": {
463
+ "value": "{color.global.grey.100}",
464
+ "type": "color"
465
+ },
466
+ "foreground": {
467
+ "value": "{color.palette.primary.muted}",
468
+ "type": "color"
469
+ },
470
+ "border-default": {
471
+ "value": "{color.palette.tertiary.muted}",
472
+ "type": "color"
473
+ },
474
+ "border-active": {
475
+ "value": "{color.palette.tertiary.main}",
476
+ "type": "color"
477
+ }
478
+ }
479
+ },
480
+ "alt-primary": {
481
+ "background": {
482
+ "value": "{color.palette.primary.main}",
483
+ "type": "color"
484
+ },
485
+ "accent": {
486
+ "value": "{color.palette.primary.pastel}",
487
+ "type": "color",
488
+ "$extensions": {
489
+ "studio.tokens": {
490
+ "modify": {
491
+ "type": "alpha",
492
+ "value": ".33",
493
+ "space": "srgb",
494
+ "color": "rgba(0,0,0,0.5)"
495
+ }
496
+ }
497
+ }
498
+ },
499
+ "text": {
500
+ "default": {
501
+ "value": "{color.palette.primary.faded}",
502
+ "type": "color"
503
+ },
504
+ "subtle": {
505
+ "value": "{color.palette.primary.pastel}",
506
+ "type": "color"
507
+ },
508
+ "title": {
509
+ "value": "{color.palette.primary.pastel}",
510
+ "type": "color"
511
+ },
512
+ "link": {
513
+ "value": "{color.palette.secondary.pastel}",
514
+ "type": "color"
515
+ },
516
+ "hover": {
517
+ "value": "{color.palette.secondary.main}",
518
+ "type": "color"
519
+ }
520
+ },
521
+ "interactive": {
522
+ "background": {
523
+ "value": "{color.palette.secondary.main}",
524
+ "type": "color"
525
+ },
526
+ "foreground": {
527
+ "value": "{color.palette.greyscale.faded}",
528
+ "type": "color"
529
+ },
530
+ "hover-background": {
531
+ "value": "{color.palette.secondary.muted}",
532
+ "type": "color"
533
+ },
534
+ "hover-foreground": {
535
+ "value": "{color.palette.greyscale.faded}",
536
+ "type": "color"
537
+ }
538
+ },
539
+ "input": {
540
+ "background": {
541
+ "value": "{color.global.grey.100}",
542
+ "type": "color"
543
+ },
544
+ "foreground": {
545
+ "value": "{color.palette.primary.muted}",
546
+ "type": "color"
547
+ },
548
+ "border-default": {
549
+ "value": "{color.palette.tertiary.dark}",
550
+ "type": "color"
551
+ },
552
+ "border-active": {
553
+ "value": "{color.palette.tertiary.main}",
554
+ "type": "color"
555
+ }
556
+ }
557
+ },
558
+ "alt-secondary": {
559
+ "background": {
560
+ "value": "{color.palette.secondary.main}",
561
+ "type": "color"
562
+ },
563
+ "accent": {
564
+ "value": "{color.palette.secondary.muted}",
565
+ "type": "color",
566
+ "$extensions": {
567
+ "studio.tokens": {
568
+ "modify": {
569
+ "type": "alpha",
570
+ "value": ".33",
571
+ "space": "lch"
572
+ }
573
+ }
574
+ }
575
+ },
576
+ "text": {
577
+ "default": {
578
+ "value": "{color.palette.primary.dark}",
579
+ "type": "color"
580
+ },
581
+ "subtle": {
582
+ "value": "{color.palette.primary.main}",
583
+ "type": "color"
584
+ },
585
+ "title": {
586
+ "value": "{color.palette.primary.muted}",
587
+ "type": "color"
588
+ },
589
+ "link": {
590
+ "value": "{color.palette.primary.dark}",
591
+ "type": "color"
592
+ },
593
+ "hover": {
594
+ "value": "{color.global.grey.100}",
595
+ "type": "color"
596
+ }
597
+ },
598
+ "interactive": {
599
+ "background": {
600
+ "value": "{color.palette.primary.main}",
601
+ "type": "color"
602
+ },
603
+ "foreground": {
604
+ "value": "{color.palette.greyscale.faded}",
605
+ "type": "color"
606
+ },
607
+ "hover-background": {
608
+ "value": "{color.palette.primary.muted}",
609
+ "type": "color"
610
+ },
611
+ "hover-foreground": {
612
+ "value": "{color.palette.greyscale.faded}",
613
+ "type": "color"
614
+ }
615
+ },
616
+ "input": {
617
+ "background": {
618
+ "value": "{color.global.grey.100}",
619
+ "type": "color"
620
+ },
621
+ "foreground": {
622
+ "value": "{color.palette.primary.muted}",
623
+ "type": "color"
624
+ },
625
+ "border-default": {
626
+ "value": "{color.palette.tertiary.dark}",
627
+ "type": "color"
628
+ },
629
+ "border-active": {
630
+ "value": "{color.palette.tertiary.main}",
631
+ "type": "color"
632
+ }
633
+ }
634
+ },
635
+ "neutral": {
636
+ "background": {
637
+ "value": "{color.palette.greyscale.pastel}",
638
+ "type": "color"
639
+ },
640
+ "accent": {
641
+ "value": "{color.palette.greyscale.pastel}",
642
+ "type": "color",
643
+ "$extensions": {
644
+ "studio.tokens": {
645
+ "modify": {
646
+ "type": "alpha",
647
+ "value": ".33",
648
+ "space": "srgb"
649
+ }
650
+ }
651
+ }
652
+ },
653
+ "text": {
654
+ "default": {
655
+ "value": "{color.palette.greyscale.dark}",
656
+ "type": "color"
657
+ },
658
+ "subtle": {
659
+ "value": "{color.palette.greyscale.dark}",
660
+ "type": "color"
661
+ },
662
+ "title": {
663
+ "value": "{color.palette.greyscale.dark}",
664
+ "type": "color"
665
+ },
666
+ "link": {
667
+ "value": "{color.link.default}",
668
+ "type": "color"
669
+ },
670
+ "hover": {
671
+ "value": "{color.palette.secondary.dark}",
672
+ "type": "color"
673
+ }
674
+ },
675
+ "interactive": {
676
+ "background": {
677
+ "value": "{color.palette.secondary.main}",
678
+ "type": "color"
679
+ },
680
+ "foreground": {
681
+ "value": "{color.palette.greyscale.faded}",
682
+ "type": "color"
683
+ },
684
+ "hover-background": {
685
+ "value": "{color.palette.secondary.muted}",
686
+ "type": "color"
687
+ },
688
+ "hover-foreground": {
689
+ "value": "{color.palette.greyscale.faded}",
690
+ "type": "color"
691
+ }
692
+ },
693
+ "input": {
694
+ "background": {
695
+ "value": "{color.global.grey.100}",
696
+ "type": "color"
697
+ },
698
+ "foreground": {
699
+ "value": "{color.palette.greyscale.dark}",
700
+ "type": "color"
701
+ },
702
+ "border-default": {
703
+ "value": "{color.palette.tertiary.muted}",
704
+ "type": "color"
705
+ },
706
+ "border-active": {
707
+ "value": "{color.palette.tertiary.main}",
708
+ "type": "color"
709
+ }
710
+ }
711
+ }
712
+ }
713
+ },
714
+ "fontfamily": {
715
+ "body": {
716
+ "value": "{fontfamily.global.simplistic}",
717
+ "type": "fontFamilies"
718
+ },
719
+ "utility": {
720
+ "value": "{fontfamily.global.simplistic}",
721
+ "type": "fontFamilies"
722
+ },
723
+ "heading": {
724
+ "value": "{fontfamily.global.simplistic}",
725
+ "type": "fontFamilies"
726
+ },
727
+ "program": {
728
+ "value": "{fontfamily.global.simplistic}",
729
+ "type": "fontFamilies"
730
+ },
731
+ "display": {
732
+ "intro": {
733
+ "value": "{fontfamily.global.simplistic}",
734
+ "type": "fontFamilies"
735
+ },
736
+ "name": {
737
+ "value": "{fontfamily.global.simplistic}",
738
+ "type": "fontFamilies"
739
+ },
740
+ "quote": {
741
+ "value": "{fontfamily.global.simplistic}",
742
+ "type": "fontFamilies"
743
+ },
744
+ "headline": {
745
+ "value": "{fontfamily.global.simplistic}",
746
+ "type": "fontFamilies"
747
+ }
748
+ }
749
+ },
750
+ "fontweight": {
751
+ "body": {
752
+ "value": "{fontweight.global.400}",
753
+ "type": "fontWeights"
754
+ },
755
+ "utility": {
756
+ "value": "{fontweight.global.400}",
757
+ "type": "fontWeights"
758
+ },
759
+ "heading": {
760
+ "value": "{fontweight.global.700}",
761
+ "type": "fontWeights"
762
+ },
763
+ "program": {
764
+ "value": "{fontweight.global.500}",
765
+ "type": "fontWeights"
766
+ },
767
+ "display": {
768
+ "intro": {
769
+ "value": "{fontweight.global.500}",
770
+ "type": "fontWeights"
771
+ },
772
+ "name": {
773
+ "value": "{fontweight.global.700}",
774
+ "type": "fontWeights"
775
+ },
776
+ "quote": {
777
+ "value": "{fontweight.global.500}",
778
+ "type": "fontWeights"
779
+ },
780
+ "headline": {
781
+ "value": "{fontweight.global.500}",
782
+ "type": "fontWeights"
783
+ }
784
+ }
785
+ },
786
+ "lineheight": {
787
+ "body": {
788
+ "value": "{lineheight.global.300}",
789
+ "type": "lineHeights"
790
+ },
791
+ "utility": {
792
+ "value": "{lineheight.global.200}",
793
+ "type": "lineHeights"
794
+ },
795
+ "heading": {
796
+ "value": "{lineheight.global.200}",
797
+ "type": "lineHeights"
798
+ },
799
+ "program": {
800
+ "value": "{lineheight.global.80}",
801
+ "type": "lineHeights"
802
+ },
803
+ "display": {
804
+ "intro": {
805
+ "value": "{lineheight.global.300}",
806
+ "type": "lineHeights"
807
+ },
808
+ "name": {
809
+ "value": "{lineheight.global.100}",
810
+ "type": "lineHeights"
811
+ },
812
+ "quote": {
813
+ "value": "{lineheight.body}",
814
+ "type": "lineHeights"
815
+ },
816
+ "headline": {
817
+ "value": "{lineheight.global.200}",
818
+ "type": "lineHeights"
819
+ }
820
+ }
821
+ }
822
+ }