UNPKG

@wonderflow/tokens

Version:

Design tokens from Wonderflow design language

github.com/wonderflow-bv/wanda

wonderflow-bv/wanda

36 lines (35 loc) • 3.53 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
export type TokensTypes = { colors: 'gray' | 'blue'|'cyan'|'dipsy'|'green'|'indigo'|'magenta'|'mint'|'purple'|'red'|'salmon'|'support'|'violet'|'yellow'; color: { blue: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; cyan: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; dipsy: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; green: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; indigo: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; magenta: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; mint: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; primary: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; purple: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; red: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; salmon: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; support: 'brand' | 'black' | 'white'; violet: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; yellow: 0 | '0' | 5 | '5' | 10 | '10' | 20 | '20' | 30 | '30' | 40 | '40' | 50 | '50' | 60 | '60' | 70 | '70' | 80 | '80' | 90 | '90' | 100 | '100'; }; breakpoint: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large'; container: 'extra-large' | 'large' | 'medium' | 'small' | 'extra-small'; icon: { size: 12 | '12' | 16 | '16' | 18 | '18' | 24 | '24' | 32 | '32' | 40 | '40' | 48 | '48' | 56 | '56'; }; radius: 4 | '4' | 8 | '8' | 16 | '16' | 24 | '24' | 32 | '32' | 40 | '40' | 48 | '48'; space: 2 | '2' | 4 | '4' | 8 | '8' | 16 | '16' | 24 | '24' | 32 | '32' | 40 | '40' | 48 | '48' | 56 | '56' | 64 | '64' | 72 | '72' | 80 | '80' | 88 | '88' | 96 | '96' | 104 | '104' | 112 | '112' | 120 | '120' | 128 | '128' | 136 | '136' | 144 | '144' | 152 | '152' | 160 | '160' | 168 | '168' | 176 | '176' | 184 | '184' | 192 | '192' | 200 | '200'; duration: 100 | '100' | 200 | '200' | 250 | '250' | 300 | '300' | 500 | '500' | 750 | '750' | 1000 | '1000'; easing: 'standard' | 'entrance' | 'exit'; wds: { font: { family: 'sans' | 'mono'; size: 12 | '12' | 14 | '14' | 16 | '16' | 20 | '20' | 24 | '24' | 28 | '28' | 32 | '32' | 40 | '40' | 48 | '48' | 56 | '56' | 68 | '68' | 80 | '80' | 96 | '96'; weight: 'heavy' | 'bold' | 'semibold' | 'regular' | 'light'; }; line: { height: 16 | '16' | 20 | '20' | 24 | '24' | 28 | '28' | 32 | '32' | 36 | '36' | 40 | '40' | 48 | '48' | 56 | '56' | 64 | '64' | 80 | '80' | 96 | '96' | 108 | '108'; }; letter: { spacing: 0 | '0' | 16 | '16' | 24 | '24' | 32 | '32'; }; }; };