@putdotio/design 0.1.0-alpha.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.
@@ -0,0 +1,628 @@
1
+ {
2
+ "$description": "Primitive put.io design tokens. These are the values other token groups reference.",
3
+ "color": {
4
+ "brand": {
5
+ "yellow": {
6
+ "$type": "color",
7
+ "$value": "#FDCE45",
8
+ "$description": "Sacred put.io brand yellow. Do not change or tint.",
9
+ "$extensions": {
10
+ "putio": {
11
+ "cssName": "yellow-solid",
12
+ "mode": "global",
13
+ "figma": true
14
+ }
15
+ }
16
+ }
17
+ }
18
+ },
19
+ "elevation": {
20
+ "shadowColor": {
21
+ "$type": "color",
22
+ "$value": "hsl(0, 0%, 78.0%)",
23
+ "$extensions": {
24
+ "putio": {
25
+ "cssName": "shadow-color",
26
+ "mode": "global",
27
+ "figma": true
28
+ }
29
+ }
30
+ },
31
+ "color": {
32
+ "$type": "color",
33
+ "$value": "hsl(0, 0%, 78.0%)",
34
+ "$extensions": {
35
+ "putio": {
36
+ "cssName": "shadow",
37
+ "mode": "global",
38
+ "figma": true
39
+ }
40
+ }
41
+ },
42
+ "sm": {
43
+ "$type": "string",
44
+ "$value": "0 1px 2px hsla(0, 0%, 0%, 0.05)",
45
+ "$extensions": {
46
+ "putio": {
47
+ "cssName": "shadow-sm",
48
+ "mode": "global",
49
+ "figma": false
50
+ }
51
+ }
52
+ },
53
+ "md": {
54
+ "$type": "string",
55
+ "$value": "0 4px 12px hsla(0, 0%, 0%, 0.08)",
56
+ "$extensions": {
57
+ "putio": {
58
+ "cssName": "shadow-md",
59
+ "mode": "global",
60
+ "figma": false
61
+ }
62
+ }
63
+ },
64
+ "lg": {
65
+ "$type": "string",
66
+ "$value": "0 16px 40px hsla(0, 0%, 0%, 0.12)",
67
+ "$extensions": {
68
+ "putio": {
69
+ "cssName": "shadow-lg",
70
+ "mode": "global",
71
+ "figma": false
72
+ }
73
+ }
74
+ },
75
+ "focusColor": {
76
+ "$type": "color",
77
+ "$value": "hsla(47, 100%, 65%, 0.35)",
78
+ "$extensions": {
79
+ "putio": {
80
+ "cssName": "shadow-focus-color",
81
+ "mode": "global",
82
+ "figma": true
83
+ }
84
+ }
85
+ },
86
+ "focus": {
87
+ "$type": "string",
88
+ "$value": "0 0 0 3px var(--shadow-focus-color)",
89
+ "$extensions": {
90
+ "putio": {
91
+ "cssName": "shadow-focus",
92
+ "mode": "global",
93
+ "figma": false
94
+ }
95
+ }
96
+ }
97
+ },
98
+ "typography": {
99
+ "fontFamily": {
100
+ "sans": {
101
+ "$type": "fontFamily",
102
+ "$value": "\"GT America\", sans-serif",
103
+ "$extensions": {
104
+ "putio": {
105
+ "cssName": "font-sans",
106
+ "mode": "global",
107
+ "figma": true
108
+ }
109
+ }
110
+ },
111
+ "display": {
112
+ "$type": "fontFamily",
113
+ "$value": "\"GT America\", sans-serif",
114
+ "$extensions": {
115
+ "putio": {
116
+ "cssName": "font-display",
117
+ "mode": "global",
118
+ "figma": true
119
+ }
120
+ }
121
+ },
122
+ "uiMono": {
123
+ "$type": "fontFamily",
124
+ "$value": "\"GT America Mono\", monospace",
125
+ "$extensions": {
126
+ "putio": {
127
+ "cssName": "font-ui-mono",
128
+ "mode": "global",
129
+ "figma": true
130
+ }
131
+ }
132
+ },
133
+ "mono": {
134
+ "$type": "fontFamily",
135
+ "$value": "\"Berkeley Mono\", \"GT America Mono\", monospace",
136
+ "$extensions": {
137
+ "putio": {
138
+ "cssName": "font-mono",
139
+ "mode": "global",
140
+ "figma": true
141
+ }
142
+ }
143
+ }
144
+ },
145
+ "fontSize": {
146
+ "xs": {
147
+ "$type": "dimension",
148
+ "$value": "0.75rem",
149
+ "$extensions": {
150
+ "putio": {
151
+ "cssName": "fs-xs",
152
+ "mode": "global",
153
+ "figma": true
154
+ }
155
+ }
156
+ },
157
+ "sm": {
158
+ "$type": "dimension",
159
+ "$value": "0.8125rem",
160
+ "$extensions": {
161
+ "putio": {
162
+ "cssName": "fs-sm",
163
+ "mode": "global",
164
+ "figma": true
165
+ }
166
+ }
167
+ },
168
+ "base": {
169
+ "$type": "dimension",
170
+ "$value": "0.875rem",
171
+ "$extensions": {
172
+ "putio": {
173
+ "cssName": "fs-base",
174
+ "mode": "global",
175
+ "figma": true
176
+ }
177
+ }
178
+ },
179
+ "md": {
180
+ "$type": "dimension",
181
+ "$value": "1rem",
182
+ "$extensions": {
183
+ "putio": {
184
+ "cssName": "fs-md",
185
+ "mode": "global",
186
+ "figma": true
187
+ }
188
+ }
189
+ },
190
+ "lg": {
191
+ "$type": "dimension",
192
+ "$value": "1.125rem",
193
+ "$extensions": {
194
+ "putio": {
195
+ "cssName": "fs-lg",
196
+ "mode": "global",
197
+ "figma": true
198
+ }
199
+ }
200
+ },
201
+ "xl": {
202
+ "$type": "dimension",
203
+ "$value": "1.5rem",
204
+ "$extensions": {
205
+ "putio": {
206
+ "cssName": "fs-xl",
207
+ "mode": "global",
208
+ "figma": true
209
+ }
210
+ }
211
+ },
212
+ "2xl": {
213
+ "$type": "dimension",
214
+ "$value": "2rem",
215
+ "$extensions": {
216
+ "putio": {
217
+ "cssName": "fs-2xl",
218
+ "mode": "global",
219
+ "figma": true
220
+ }
221
+ }
222
+ },
223
+ "3xl": {
224
+ "$type": "dimension",
225
+ "$value": "3rem",
226
+ "$extensions": {
227
+ "putio": {
228
+ "cssName": "fs-3xl",
229
+ "mode": "global",
230
+ "figma": true
231
+ }
232
+ }
233
+ },
234
+ "4xl": {
235
+ "$type": "dimension",
236
+ "$value": "4rem",
237
+ "$extensions": {
238
+ "putio": {
239
+ "cssName": "fs-4xl",
240
+ "mode": "global",
241
+ "figma": true
242
+ }
243
+ }
244
+ },
245
+ "display": {
246
+ "$type": "dimension",
247
+ "$value": "6rem",
248
+ "$extensions": {
249
+ "putio": {
250
+ "cssName": "fs-display",
251
+ "mode": "global",
252
+ "figma": true
253
+ }
254
+ }
255
+ }
256
+ },
257
+ "lineHeight": {
258
+ "tight": {
259
+ "$type": "number",
260
+ "$value": "1.1",
261
+ "$extensions": {
262
+ "putio": {
263
+ "cssName": "lh-tight",
264
+ "mode": "global",
265
+ "figma": true
266
+ }
267
+ }
268
+ },
269
+ "snug": {
270
+ "$type": "number",
271
+ "$value": "1.25",
272
+ "$extensions": {
273
+ "putio": {
274
+ "cssName": "lh-snug",
275
+ "mode": "global",
276
+ "figma": true
277
+ }
278
+ }
279
+ },
280
+ "normal": {
281
+ "$type": "number",
282
+ "$value": "1.45",
283
+ "$extensions": {
284
+ "putio": {
285
+ "cssName": "lh-normal",
286
+ "mode": "global",
287
+ "figma": true
288
+ }
289
+ }
290
+ },
291
+ "loose": {
292
+ "$type": "number",
293
+ "$value": "1.6",
294
+ "$extensions": {
295
+ "putio": {
296
+ "cssName": "lh-loose",
297
+ "mode": "global",
298
+ "figma": true
299
+ }
300
+ }
301
+ }
302
+ },
303
+ "fontWeight": {
304
+ "regular": {
305
+ "$type": "fontWeight",
306
+ "$value": "400",
307
+ "$extensions": {
308
+ "putio": {
309
+ "cssName": "fw-regular",
310
+ "mode": "global",
311
+ "figma": true
312
+ }
313
+ }
314
+ },
315
+ "medium": {
316
+ "$type": "fontWeight",
317
+ "$value": "500",
318
+ "$extensions": {
319
+ "putio": {
320
+ "cssName": "fw-medium",
321
+ "mode": "global",
322
+ "figma": true
323
+ }
324
+ }
325
+ },
326
+ "bold": {
327
+ "$type": "fontWeight",
328
+ "$value": "700",
329
+ "$extensions": {
330
+ "putio": {
331
+ "cssName": "fw-bold",
332
+ "mode": "global",
333
+ "figma": true
334
+ }
335
+ }
336
+ },
337
+ "black": {
338
+ "$type": "fontWeight",
339
+ "$value": "900",
340
+ "$extensions": {
341
+ "putio": {
342
+ "cssName": "fw-black",
343
+ "mode": "global",
344
+ "figma": true
345
+ }
346
+ }
347
+ }
348
+ },
349
+ "letterSpacing": {
350
+ "tight": {
351
+ "$type": "dimension",
352
+ "$value": "-0.02em",
353
+ "$extensions": {
354
+ "putio": {
355
+ "cssName": "tracking-tight",
356
+ "mode": "global",
357
+ "figma": true
358
+ }
359
+ }
360
+ },
361
+ "normal": {
362
+ "$type": "number",
363
+ "$value": "0",
364
+ "$extensions": {
365
+ "putio": {
366
+ "cssName": "tracking-normal",
367
+ "mode": "global",
368
+ "figma": true
369
+ }
370
+ }
371
+ },
372
+ "wide": {
373
+ "$type": "dimension",
374
+ "$value": "0.02em",
375
+ "$extensions": {
376
+ "putio": {
377
+ "cssName": "tracking-wide",
378
+ "mode": "global",
379
+ "figma": true
380
+ }
381
+ }
382
+ },
383
+ "uppercase": {
384
+ "$type": "dimension",
385
+ "$value": "0.08em",
386
+ "$extensions": {
387
+ "putio": {
388
+ "cssName": "tracking-uppercase",
389
+ "mode": "global",
390
+ "figma": true
391
+ }
392
+ }
393
+ }
394
+ }
395
+ },
396
+ "spacing": {
397
+ "0": {
398
+ "$type": "dimension",
399
+ "$value": "0",
400
+ "$extensions": {
401
+ "putio": {
402
+ "cssName": "space-0",
403
+ "mode": "global",
404
+ "figma": true
405
+ }
406
+ }
407
+ },
408
+ "1": {
409
+ "$type": "dimension",
410
+ "$value": "4px",
411
+ "$extensions": {
412
+ "putio": {
413
+ "cssName": "space-1",
414
+ "mode": "global",
415
+ "figma": true
416
+ }
417
+ }
418
+ },
419
+ "2": {
420
+ "$type": "dimension",
421
+ "$value": "8px",
422
+ "$extensions": {
423
+ "putio": {
424
+ "cssName": "space-2",
425
+ "mode": "global",
426
+ "figma": true
427
+ }
428
+ }
429
+ },
430
+ "3": {
431
+ "$type": "dimension",
432
+ "$value": "16px",
433
+ "$extensions": {
434
+ "putio": {
435
+ "cssName": "space-3",
436
+ "mode": "global",
437
+ "figma": true
438
+ }
439
+ }
440
+ },
441
+ "4": {
442
+ "$type": "dimension",
443
+ "$value": "32px",
444
+ "$extensions": {
445
+ "putio": {
446
+ "cssName": "space-4",
447
+ "mode": "global",
448
+ "figma": true
449
+ }
450
+ }
451
+ },
452
+ "5": {
453
+ "$type": "dimension",
454
+ "$value": "64px",
455
+ "$extensions": {
456
+ "putio": {
457
+ "cssName": "space-5",
458
+ "mode": "global",
459
+ "figma": true
460
+ }
461
+ }
462
+ },
463
+ "6": {
464
+ "$type": "dimension",
465
+ "$value": "128px",
466
+ "$extensions": {
467
+ "putio": {
468
+ "cssName": "space-6",
469
+ "mode": "global",
470
+ "figma": true
471
+ }
472
+ }
473
+ },
474
+ "7": {
475
+ "$type": "dimension",
476
+ "$value": "256px",
477
+ "$extensions": {
478
+ "putio": {
479
+ "cssName": "space-7",
480
+ "mode": "global",
481
+ "figma": true
482
+ }
483
+ }
484
+ },
485
+ "8": {
486
+ "$type": "dimension",
487
+ "$value": "512px",
488
+ "$extensions": {
489
+ "putio": {
490
+ "cssName": "space-8",
491
+ "mode": "global",
492
+ "figma": true
493
+ }
494
+ }
495
+ }
496
+ },
497
+ "radius": {
498
+ "sm": {
499
+ "$type": "dimension",
500
+ "$value": "4px",
501
+ "$extensions": {
502
+ "putio": {
503
+ "cssName": "radius-sm",
504
+ "mode": "global",
505
+ "figma": true
506
+ }
507
+ }
508
+ },
509
+ "default": {
510
+ "$type": "dimension",
511
+ "$value": "6px",
512
+ "$extensions": {
513
+ "putio": {
514
+ "cssName": "radius",
515
+ "mode": "global",
516
+ "figma": true
517
+ }
518
+ }
519
+ },
520
+ "md": {
521
+ "$type": "dimension",
522
+ "$value": "8px",
523
+ "$extensions": {
524
+ "putio": {
525
+ "cssName": "radius-md",
526
+ "mode": "global",
527
+ "figma": true
528
+ }
529
+ }
530
+ },
531
+ "lg": {
532
+ "$type": "dimension",
533
+ "$value": "10px",
534
+ "$extensions": {
535
+ "putio": {
536
+ "cssName": "radius-lg",
537
+ "mode": "global",
538
+ "figma": true
539
+ }
540
+ }
541
+ },
542
+ "pill": {
543
+ "$type": "dimension",
544
+ "$value": "999px",
545
+ "$extensions": {
546
+ "putio": {
547
+ "cssName": "radius-pill",
548
+ "mode": "global",
549
+ "figma": true
550
+ }
551
+ }
552
+ }
553
+ },
554
+ "border": {
555
+ "width": {
556
+ "$type": "dimension",
557
+ "$value": "1px",
558
+ "$extensions": {
559
+ "putio": {
560
+ "cssName": "border-width",
561
+ "mode": "global",
562
+ "figma": true
563
+ }
564
+ }
565
+ }
566
+ },
567
+ "motion": {
568
+ "easing": {
569
+ "out": {
570
+ "$type": "cubicBezier",
571
+ "$value": "cubic-bezier(0.22, 1, 0.36, 1)",
572
+ "$extensions": {
573
+ "putio": {
574
+ "cssName": "ease-out",
575
+ "mode": "global",
576
+ "figma": true
577
+ }
578
+ }
579
+ },
580
+ "inOut": {
581
+ "$type": "cubicBezier",
582
+ "$value": "cubic-bezier(0.65, 0, 0.35, 1)",
583
+ "$extensions": {
584
+ "putio": {
585
+ "cssName": "ease-in-out",
586
+ "mode": "global",
587
+ "figma": true
588
+ }
589
+ }
590
+ }
591
+ },
592
+ "duration": {
593
+ "fast": {
594
+ "$type": "duration",
595
+ "$value": "120ms",
596
+ "$extensions": {
597
+ "putio": {
598
+ "cssName": "dur-fast",
599
+ "mode": "global",
600
+ "figma": true
601
+ }
602
+ }
603
+ },
604
+ "base": {
605
+ "$type": "duration",
606
+ "$value": "200ms",
607
+ "$extensions": {
608
+ "putio": {
609
+ "cssName": "dur-base",
610
+ "mode": "global",
611
+ "figma": true
612
+ }
613
+ }
614
+ },
615
+ "slow": {
616
+ "$type": "duration",
617
+ "$value": "320ms",
618
+ "$extensions": {
619
+ "putio": {
620
+ "cssName": "dur-slow",
621
+ "mode": "global",
622
+ "figma": true
623
+ }
624
+ }
625
+ }
626
+ }
627
+ }
628
+ }