@phcdevworks/spectre-tokens 0.2.1 → 1.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.
package/tokens/core.json CHANGED
@@ -1,22 +1,22 @@
1
1
  {
2
2
  "colors": {
3
3
  "brand": {
4
- "50": "#f5f0ff",
5
- "100": "#ebe2ff",
6
- "200": "#d7c6ff",
7
- "300": "#bfa1ff",
8
- "400": "#a37aff",
9
- "500": "#8652ff",
10
- "600": "#6c32e6",
11
- "700": "#5626b4",
12
- "800": "#3d1b7f",
13
- "900": "#241147"
4
+ "50": "#eff6ff",
5
+ "100": "#dbeafe",
6
+ "200": "#bfdbfe",
7
+ "300": "#93c5fd",
8
+ "400": "#60a5fa",
9
+ "500": "#3b82f6",
10
+ "600": "#2563eb",
11
+ "700": "#1d4ed8",
12
+ "800": "#1e40af",
13
+ "900": "#1e3a8a"
14
14
  },
15
15
  "neutral": {
16
16
  "50": "#f8fafc",
17
17
  "100": "#f1f5f9",
18
18
  "200": "#e2e8f0",
19
- "300": "#cbd5f5",
19
+ "300": "#cbd5e1",
20
20
  "400": "#94a3b8",
21
21
  "500": "#64748b",
22
22
  "600": "#475569",
@@ -25,16 +25,16 @@
25
25
  "900": "#0f172a"
26
26
  },
27
27
  "accent": {
28
- "50": "#e5fff8",
29
- "100": "#b8ffed",
30
- "200": "#89ffe1",
31
- "300": "#59ffd6",
32
- "400": "#29ffca",
33
- "500": "#03e6b3",
34
- "600": "#00b389",
35
- "700": "#008060",
36
- "800": "#004d38",
37
- "900": "#002a20"
28
+ "50": "#eff6ff",
29
+ "100": "#dbeafe",
30
+ "200": "#bfdbfe",
31
+ "300": "#93c5fd",
32
+ "400": "#60a5fa",
33
+ "500": "#3b82f6",
34
+ "600": "#2563eb",
35
+ "700": "#1d4ed8",
36
+ "800": "#1e40af",
37
+ "900": "#1e3a8a"
38
38
  },
39
39
  "success": {
40
40
  "50": "#f0fdf4",
@@ -85,7 +85,7 @@
85
85
  "900": "#1e3a8a"
86
86
  },
87
87
  "focus": {
88
- "primary": "#8652ff",
88
+ "primary": "#3b82f6",
89
89
  "error": "#ef4444",
90
90
  "info": "#3b82f6"
91
91
  }
@@ -117,7 +117,7 @@
117
117
  },
118
118
  "onSurface": {
119
119
  "default": "#0f172a",
120
- "muted": "#6b7280",
120
+ "muted": "#64748b",
121
121
  "subtle": "#94a3b8",
122
122
  "meta": "#94a3b8"
123
123
  }
@@ -125,7 +125,7 @@
125
125
  "component": {
126
126
  "card": {
127
127
  "text": "#0f172a",
128
- "textMuted": "#6b7280"
128
+ "textMuted": "#64748b"
129
129
  },
130
130
  "input": {
131
131
  "text": "#0f172a",
@@ -150,10 +150,33 @@
150
150
  "iconBox": {
151
151
  "bg": "#ffffff",
152
152
  "border": "#e2e8f0",
153
- "iconDefault": "#6c32e6",
153
+ "iconDefault": "#2563eb",
154
154
  "iconSuccess": "#16a34a",
155
155
  "iconWarning": "#d97706",
156
156
  "iconDanger": "#dc2626"
157
+ },
158
+ "testimonial": {
159
+ "bg": "#ffffff",
160
+ "border": "#e2e8f0",
161
+ "text": "#334155",
162
+ "authorName": "#0f172a",
163
+ "authorTitle": "#64748b",
164
+ "quoteMark": "#cbd5e1"
165
+ },
166
+ "pricingCard": {
167
+ "bg": "#ffffff",
168
+ "border": "#e2e8f0",
169
+ "featuredBg": "#2563eb",
170
+ "featuredText": "#ffffff",
171
+ "featuredBadgeBg": "#f59e0b",
172
+ "featuredBadgeText": "#ffffff",
173
+ "price": "#0f172a",
174
+ "priceDescription": "#64748b"
175
+ },
176
+ "rating": {
177
+ "starFilled": "#f59e0b",
178
+ "starEmpty": "#e2e8f0",
179
+ "text": "#64748b"
157
180
  }
158
181
  },
159
182
  "modes": {
@@ -170,6 +193,12 @@
170
193
  },
171
194
  "overlay": {
172
195
  "value": "rgba(15,23,42,0.6)"
196
+ },
197
+ "alternate": {
198
+ "value": "#f1f5f9"
199
+ },
200
+ "hero": {
201
+ "value": "linear-gradient(135deg, #667eea 0%, #764ba2 100%)"
173
202
  }
174
203
  },
175
204
  "text": {
@@ -192,7 +221,7 @@
192
221
  "value": "#0f172a"
193
222
  },
194
223
  "muted": {
195
- "value": "#6b7280"
224
+ "value": "#64748b"
196
225
  },
197
226
  "subtle": {
198
227
  "value": "#94a3b8"
@@ -208,7 +237,7 @@
208
237
  "value": "#0f172a"
209
238
  },
210
239
  "textMuted": {
211
- "value": "#6b7280"
240
+ "value": "#64748b"
212
241
  }
213
242
  },
214
243
  "input": {
@@ -267,7 +296,7 @@
267
296
  "value": "#e2e8f0"
268
297
  },
269
298
  "iconDefault": {
270
- "value": "#6c32e6"
299
+ "value": "#2563eb"
271
300
  },
272
301
  "iconSuccess": {
273
302
  "value": "#16a34a"
@@ -278,6 +307,63 @@
278
307
  "iconDanger": {
279
308
  "value": "#dc2626"
280
309
  }
310
+ },
311
+ "testimonial": {
312
+ "bg": {
313
+ "value": "#ffffff"
314
+ },
315
+ "border": {
316
+ "value": "#e2e8f0"
317
+ },
318
+ "text": {
319
+ "value": "#334155"
320
+ },
321
+ "authorName": {
322
+ "value": "#0f172a"
323
+ },
324
+ "authorTitle": {
325
+ "value": "#64748b"
326
+ },
327
+ "quoteMark": {
328
+ "value": "#cbd5e1"
329
+ }
330
+ },
331
+ "pricingCard": {
332
+ "bg": {
333
+ "value": "#ffffff"
334
+ },
335
+ "border": {
336
+ "value": "#e2e8f0"
337
+ },
338
+ "featuredBg": {
339
+ "value": "#2563eb"
340
+ },
341
+ "featuredText": {
342
+ "value": "#ffffff"
343
+ },
344
+ "featuredBadgeBg": {
345
+ "value": "#f59e0b"
346
+ },
347
+ "featuredBadgeText": {
348
+ "value": "#ffffff"
349
+ },
350
+ "price": {
351
+ "value": "#0f172a"
352
+ },
353
+ "priceDescription": {
354
+ "value": "#64748b"
355
+ }
356
+ },
357
+ "rating": {
358
+ "starFilled": {
359
+ "value": "#f59e0b"
360
+ },
361
+ "starEmpty": {
362
+ "value": "#e2e8f0"
363
+ },
364
+ "text": {
365
+ "value": "#64748b"
366
+ }
281
367
  }
282
368
  }
283
369
  },
@@ -294,6 +380,12 @@
294
380
  },
295
381
  "overlay": {
296
382
  "value": "#1e293b"
383
+ },
384
+ "alternate": {
385
+ "value": "#1e293b"
386
+ },
387
+ "hero": {
388
+ "value": "linear-gradient(135deg, #4c1d95 0%, #5b21b6 100%)"
297
389
  }
298
390
  },
299
391
  "text": {
@@ -302,7 +394,7 @@
302
394
  "value": "#f8fafc"
303
395
  },
304
396
  "muted": {
305
- "value": "#cbd5f5"
397
+ "value": "#cbd5e1"
306
398
  },
307
399
  "subtle": {
308
400
  "value": "#94a3b8"
@@ -316,7 +408,7 @@
316
408
  "value": "#f1f5f9"
317
409
  },
318
410
  "muted": {
319
- "value": "#cbd5f5"
411
+ "value": "#cbd5e1"
320
412
  },
321
413
  "subtle": {
322
414
  "value": "#94a3b8"
@@ -332,7 +424,7 @@
332
424
  "value": "#f1f5f9"
333
425
  },
334
426
  "textMuted": {
335
- "value": "#cbd5f5"
427
+ "value": "#cbd5e1"
336
428
  }
337
429
  },
338
430
  "input": {
@@ -391,7 +483,7 @@
391
483
  "value": "#334155"
392
484
  },
393
485
  "iconDefault": {
394
- "value": "#a37aff"
486
+ "value": "#93c5fd"
395
487
  },
396
488
  "iconSuccess": {
397
489
  "value": "#4ade80"
@@ -402,6 +494,63 @@
402
494
  "iconDanger": {
403
495
  "value": "#f87171"
404
496
  }
497
+ },
498
+ "testimonial": {
499
+ "bg": {
500
+ "value": "#1e293b"
501
+ },
502
+ "border": {
503
+ "value": "#334155"
504
+ },
505
+ "text": {
506
+ "value": "#cbd5e1"
507
+ },
508
+ "authorName": {
509
+ "value": "#f1f5f9"
510
+ },
511
+ "authorTitle": {
512
+ "value": "#94a3b8"
513
+ },
514
+ "quoteMark": {
515
+ "value": "#475569"
516
+ }
517
+ },
518
+ "pricingCard": {
519
+ "bg": {
520
+ "value": "#1e293b"
521
+ },
522
+ "border": {
523
+ "value": "#334155"
524
+ },
525
+ "featuredBg": {
526
+ "value": "#3b82f6"
527
+ },
528
+ "featuredText": {
529
+ "value": "#ffffff"
530
+ },
531
+ "featuredBadgeBg": {
532
+ "value": "#f59e0b"
533
+ },
534
+ "featuredBadgeText": {
535
+ "value": "#ffffff"
536
+ },
537
+ "price": {
538
+ "value": "#f1f5f9"
539
+ },
540
+ "priceDescription": {
541
+ "value": "#94a3b8"
542
+ }
543
+ },
544
+ "rating": {
545
+ "starFilled": {
546
+ "value": "#fbbf24"
547
+ },
548
+ "starEmpty": {
549
+ "value": "#334155"
550
+ },
551
+ "text": {
552
+ "value": "#94a3b8"
553
+ }
405
554
  }
406
555
  }
407
556
  }
@@ -425,29 +574,29 @@
425
574
  },
426
575
  "buttons": {
427
576
  "primary": {
428
- "bg": "#8652ff",
429
- "bgHover": "#6c32e6",
430
- "bgActive": "#5626b4",
431
- "bgDisabled": "#cbd5f5",
577
+ "bg": "#2563eb",
578
+ "bgHover": "#1d4ed8",
579
+ "bgActive": "#1e40af",
580
+ "bgDisabled": "#e2e8f0",
432
581
  "text": "#ffffff",
433
582
  "textDisabled": "#94a3b8"
434
583
  },
435
584
  "secondary": {
436
585
  "bg": "#ffffff",
437
- "bgHover": "#f1f5f9",
438
- "bgActive": "#e2e8f0",
586
+ "bgHover": "#f8fafc",
587
+ "bgActive": "#f1f5f9",
439
588
  "bgDisabled": "#f8fafc",
440
- "text": "#8652ff",
589
+ "text": "#2563eb",
441
590
  "textDisabled": "#94a3b8",
442
- "border": "#8652ff",
443
- "borderDisabled": "#cbd5f5"
591
+ "border": "#2563eb",
592
+ "borderDisabled": "#e2e8f0"
444
593
  },
445
594
  "ghost": {
446
595
  "bg": "transparent",
447
- "bgHover": "#f5f0ff",
448
- "bgActive": "#ebe2ff",
596
+ "bgHover": "#eff6ff",
597
+ "bgActive": "#dbeafe",
449
598
  "bgDisabled": "transparent",
450
- "text": "#8652ff",
599
+ "text": "#2563eb",
451
600
  "textDisabled": "#94a3b8"
452
601
  },
453
602
  "danger": {
@@ -465,21 +614,38 @@
465
614
  "bgDisabled": "#bbf7d0",
466
615
  "text": "#ffffff",
467
616
  "textDisabled": "#94a3b8"
617
+ },
618
+ "cta": {
619
+ "bg": "#f59e0b",
620
+ "bgHover": "#d97706",
621
+ "bgActive": "#b45309",
622
+ "bgDisabled": "#fde68a",
623
+ "text": "#ffffff",
624
+ "textDisabled": "#94a3b8",
625
+ "shadow": "0 4px 14px 0 rgba(245, 158, 11, 0.39)"
626
+ },
627
+ "accent": {
628
+ "bg": "#8b5cf6",
629
+ "bgHover": "#7c3aed",
630
+ "bgActive": "#6d28d9",
631
+ "bgDisabled": "#ddd6fe",
632
+ "text": "#ffffff",
633
+ "textDisabled": "#94a3b8"
468
634
  }
469
635
  },
470
636
  "forms": {
471
637
  "default": {
472
638
  "bg": "#ffffff",
473
- "border": "#cbd5f5",
639
+ "border": "#cbd5e1",
474
640
  "text": "#0f172a",
475
641
  "placeholder": "#94a3b8"
476
642
  },
477
643
  "hover": {
478
- "border": "#8652ff"
644
+ "border": "#3b82f6"
479
645
  },
480
646
  "focus": {
481
- "border": "#8652ff",
482
- "ring": "#8652ff"
647
+ "border": "#3b82f6",
648
+ "ring": "#3b82f6"
483
649
  },
484
650
  "valid": {
485
651
  "border": "#22c55e",
@@ -549,8 +715,8 @@
549
715
  "pill": "999px"
550
716
  },
551
717
  "borders": {
552
- "card": "#334155",
553
- "input": "#cbd5f5"
718
+ "card": "#e2e8f0",
719
+ "input": "#cbd5e1"
554
720
  },
555
721
  "font": {
556
722
  "xs": {
@@ -586,9 +752,9 @@
586
752
  },
587
753
  "typography": {
588
754
  "families": {
589
- "sans": "'Inter', 'Helvetica Neue', Arial, sans-serif",
590
- "serif": "'Spectre Serif', 'Georgia', serif",
591
- "mono": "'JetBrains Mono', 'SFMono-Regular', Consolas, monospace"
755
+ "sans": "system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif",
756
+ "serif": "'Times New Roman', Times, serif",
757
+ "mono": "'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace"
592
758
  },
593
759
  "scale": {
594
760
  "xs": {
@@ -626,14 +792,29 @@
626
792
  "fontSize": "2.25rem",
627
793
  "lineHeight": "2.75rem",
628
794
  "fontWeight": 700
795
+ },
796
+ "4xl": {
797
+ "fontSize": "3rem",
798
+ "lineHeight": "3.5rem",
799
+ "fontWeight": 800
800
+ },
801
+ "5xl": {
802
+ "fontSize": "3.75rem",
803
+ "lineHeight": "4.25rem",
804
+ "fontWeight": 800
805
+ },
806
+ "6xl": {
807
+ "fontSize": "4.5rem",
808
+ "lineHeight": "5rem",
809
+ "fontWeight": 900
629
810
  }
630
811
  }
631
812
  },
632
813
  "shadows": {
633
814
  "none": "none",
634
- "sm": "0 1px 2px 0 rgba(15, 23, 42, 0.08)",
635
- "md": "0 3px 8px -1px rgba(15, 23, 42, 0.1)",
636
- "lg": "0 8px 20px -4px rgba(15, 23, 42, 0.18)"
815
+ "sm": "0 1px 2px 0 rgba(15, 23, 42, 0.06)",
816
+ "md": "0 2px 6px -1px rgba(15, 23, 42, 0.08)",
817
+ "lg": "0 6px 16px -4px rgba(15, 23, 42, 0.12)"
637
818
  },
638
819
  "breakpoints": {
639
820
  "sm": "640px",
@@ -666,7 +847,7 @@
666
847
  "in": "cubic-bezier(0.4, 0, 1, 1)",
667
848
  "out": "cubic-bezier(0, 0, 0.2, 1)",
668
849
  "inOut": "cubic-bezier(0.4, 0, 0.2, 1)",
669
- "spring": "cubic-bezier(0.34, 1.56, 0.64, 1)"
850
+ "spring": "cubic-bezier(0.4, 0, 0.2, 1)"
670
851
  }
671
852
  },
672
853
  "animations": {
@@ -696,19 +877,36 @@
696
877
  "keyframes": "scale-in"
697
878
  },
698
879
  "bounce": {
699
- "duration": "500ms",
700
- "easing": "cubic-bezier(0.34, 1.56, 0.64, 1)",
880
+ "duration": "300ms",
881
+ "easing": "cubic-bezier(0.4, 0, 0.2, 1)",
701
882
  "keyframes": "bounce"
702
883
  },
703
884
  "shake": {
704
- "duration": "400ms",
885
+ "duration": "250ms",
705
886
  "easing": "cubic-bezier(0.4, 0, 0.2, 1)",
706
887
  "keyframes": "shake"
707
888
  },
708
889
  "pulse": {
709
- "duration": "1500ms",
890
+ "duration": "1200ms",
710
891
  "easing": "cubic-bezier(0.4, 0, 0.2, 1)",
711
892
  "keyframes": "pulse"
712
893
  }
894
+ },
895
+ "icons": {
896
+ "xs": "12px",
897
+ "sm": "16px",
898
+ "md": "20px",
899
+ "lg": "24px",
900
+ "xl": "32px",
901
+ "2xl": "40px",
902
+ "3xl": "48px"
903
+ },
904
+ "aspectRatios": {
905
+ "square": "1/1",
906
+ "video": "16/9",
907
+ "portrait": "3/4",
908
+ "landscape": "4/3",
909
+ "ultrawide": "21/9",
910
+ "hero": "2/1"
713
911
  }
714
912
  }