@humanforest/tokens 0.1.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 (45) hide show
  1. package/LICENSE +67 -0
  2. package/dataviz/dataviz.css +149 -0
  3. package/dataviz/tokens.json +1591 -0
  4. package/dataviz/unovis.css +151 -0
  5. package/deck/deck.css +515 -0
  6. package/deck/deck.json +358 -0
  7. package/geo/london-boroughs.json +1 -0
  8. package/geo/london-dots-coarse.json +1 -0
  9. package/geo/london-dots-fine.json +1 -0
  10. package/geo/london-dots-medium.json +1 -0
  11. package/geo/london-dots-ultra.json +1 -0
  12. package/geo/london-wards.json +1 -0
  13. package/glyphs/glyphs.json +1 -0
  14. package/logos/f-rot.svg +4 -0
  15. package/logos/f.svg +4 -0
  16. package/logos/favicon-c2w.svg +9 -0
  17. package/logos/favicon-console.svg +9 -0
  18. package/logos/favicon-ds.svg +9 -0
  19. package/logos/favicon-fleet.svg +9 -0
  20. package/logos/favicon-flex.svg +9 -0
  21. package/logos/favicon-plus.svg +9 -0
  22. package/logos/favicon-radar.svg +9 -0
  23. package/logos/favicon-tower.svg +9 -0
  24. package/logos/lockup-horizontal.svg +17 -0
  25. package/logos/lockup-vertical.svg +17 -0
  26. package/logos/mark-mono.svg +4 -0
  27. package/logos/mark.svg +7 -0
  28. package/logos/wordmark.svg +9 -0
  29. package/motion/motion.css +104 -0
  30. package/motion/motion.json +85 -0
  31. package/motion/motion.theme.css +16 -0
  32. package/package.json +50 -0
  33. package/scales/ramps.css +182 -0
  34. package/scales/ramps.json +605 -0
  35. package/scales/theme.css +256 -0
  36. package/src/colourEngine.ts +604 -0
  37. package/src/glyphs.ts +127 -0
  38. package/src/logo.ts +50 -0
  39. package/src/subbrands.ts +44 -0
  40. package/src/sublogo.ts +80 -0
  41. package/src/sublogoSvg.ts +134 -0
  42. package/type/type.css +232 -0
  43. package/type/type.deck.css +74 -0
  44. package/type/type.json +548 -0
  45. package/type/type.theme.css +31 -0
package/scales/theme.css ADDED
@@ -0,0 +1,256 @@
1
+ /* Forest ramps → Tailwind/Nuxt UI colours — generated by scripts/scales.ts. Do not edit.
2
+ @theme: literal hex registers each family as a Tailwind colour (generates bg-forest-* etc.).
3
+ :root: re-points --color-<fam>-* to the P3-capable ramp var, and bridges the raw families to
4
+ Nuxt UI's --ui-color-<family>-* so `color="forest"` works. Semantic roles auto-derive. */
5
+ @theme static {
6
+ --color-forest-0: #F4FDF7;
7
+ --color-forest-50: #E8FBEE;
8
+ --color-forest-100: #CEF5DD;
9
+ --color-forest-200: #99E9BC;
10
+ --color-forest-300: #3BD996;
11
+ --color-forest-400: #0ABB7F;
12
+ --color-forest-500: #019F6D;
13
+ --color-forest-600: #00845C;
14
+ --color-forest-700: #046C4C;
15
+ --color-forest-800: #075640;
16
+ --color-forest-900: #074235;
17
+ --color-forest-950: #002A24;
18
+ --color-maple-0: #FFF8F8;
19
+ --color-maple-50: #FFF1F2;
20
+ --color-maple-100: #FFE1E2;
21
+ --color-maple-200: #FFC2C4;
22
+ --color-maple-300: #FF9A9B;
23
+ --color-maple-400: #F26F70;
24
+ --color-maple-500: #D35A59;
25
+ --color-maple-600: #AA514E;
26
+ --color-maple-700: #8C4340;
27
+ --color-maple-800: #6E3633;
28
+ --color-maple-900: #532A27;
29
+ --color-maple-950: #3B1C1A;
30
+ --color-river-0: #F6FBFF;
31
+ --color-river-50: #EDF6FF;
32
+ --color-river-100: #D8ECFF;
33
+ --color-river-200: #B2D9FF;
34
+ --color-river-300: #81C0FF;
35
+ --color-river-400: #43A2FF;
36
+ --color-river-500: #3588DF;
37
+ --color-river-600: #3C72B2;
38
+ --color-river-700: #355D93;
39
+ --color-river-800: #2D4974;
40
+ --color-river-900: #253858;
41
+ --color-river-950: #19263E;
42
+ --color-warm-0: #FDFAF6;
43
+ --color-warm-50: #FFF9F2;
44
+ --color-warm-100: #FCE6CB;
45
+ --color-warm-200: #FFD6A6;
46
+ --color-warm-300: #FEAF59;
47
+ --color-warm-400: #F48519;
48
+ --color-warm-500: #DB6300;
49
+ --color-warm-600: #A75633;
50
+ --color-warm-700: #8A462E;
51
+ --color-warm-800: #6D3828;
52
+ --color-warm-900: #532B22;
53
+ --color-warm-950: #44231C;
54
+ --color-amber-0: #FBFAF3;
55
+ --color-amber-50: #FAF7E9;
56
+ --color-amber-100: #F8EFCB;
57
+ --color-amber-200: #F6DC99;
58
+ --color-amber-300: #F7BD41;
59
+ --color-amber-400: #E59E00;
60
+ --color-amber-500: #C78100;
61
+ --color-amber-600: #A56819;
62
+ --color-amber-700: #875219;
63
+ --color-amber-800: #6A3F18;
64
+ --color-amber-900: #502F16;
65
+ --color-amber-950: #391F0E;
66
+ --color-acid-0: #F8FCF1;
67
+ --color-acid-50: #F2F8E5;
68
+ --color-acid-100: #E5EFC9;
69
+ --color-acid-200: #CFDD90;
70
+ --color-acid-300: #B4BD11;
71
+ --color-acid-400: #A2A707;
72
+ --color-acid-500: #8C8C00;
73
+ --color-acid-600: #767502;
74
+ --color-acid-700: #626006;
75
+ --color-acid-800: #4E4B0C;
76
+ --color-acid-900: #3C3A0E;
77
+ --color-acid-950: #2A2808;
78
+ --color-neutral-0: #FEFBFC;
79
+ --color-neutral-50: #F9F6F7;
80
+ --color-neutral-100: #F3EFF0;
81
+ --color-neutral-200: #E7E3E4;
82
+ --color-neutral-300: #D5D1D2;
83
+ --color-neutral-400: #A29FA0;
84
+ --color-neutral-500: #757273;
85
+ --color-neutral-600: #545252;
86
+ --color-neutral-700: #423F40;
87
+ --color-neutral-800: #282626;
88
+ --color-neutral-900: #191617;
89
+ --color-neutral-950: #0C090A;
90
+ }
91
+
92
+ :root {
93
+ --color-forest-0: var(--forest-0);
94
+ --color-forest-50: var(--forest-50);
95
+ --color-forest-100: var(--forest-100);
96
+ --color-forest-200: var(--forest-200);
97
+ --color-forest-300: var(--forest-300);
98
+ --color-forest-400: var(--forest-400);
99
+ --color-forest-500: var(--forest-500);
100
+ --color-forest-600: var(--forest-600);
101
+ --color-forest-700: var(--forest-700);
102
+ --color-forest-800: var(--forest-800);
103
+ --color-forest-900: var(--forest-900);
104
+ --color-forest-950: var(--forest-950);
105
+ --color-maple-0: var(--maple-0);
106
+ --color-maple-50: var(--maple-50);
107
+ --color-maple-100: var(--maple-100);
108
+ --color-maple-200: var(--maple-200);
109
+ --color-maple-300: var(--maple-300);
110
+ --color-maple-400: var(--maple-400);
111
+ --color-maple-500: var(--maple-500);
112
+ --color-maple-600: var(--maple-600);
113
+ --color-maple-700: var(--maple-700);
114
+ --color-maple-800: var(--maple-800);
115
+ --color-maple-900: var(--maple-900);
116
+ --color-maple-950: var(--maple-950);
117
+ --color-river-0: var(--river-0);
118
+ --color-river-50: var(--river-50);
119
+ --color-river-100: var(--river-100);
120
+ --color-river-200: var(--river-200);
121
+ --color-river-300: var(--river-300);
122
+ --color-river-400: var(--river-400);
123
+ --color-river-500: var(--river-500);
124
+ --color-river-600: var(--river-600);
125
+ --color-river-700: var(--river-700);
126
+ --color-river-800: var(--river-800);
127
+ --color-river-900: var(--river-900);
128
+ --color-river-950: var(--river-950);
129
+ --color-warm-0: var(--warm-0);
130
+ --color-warm-50: var(--warm-50);
131
+ --color-warm-100: var(--warm-100);
132
+ --color-warm-200: var(--warm-200);
133
+ --color-warm-300: var(--warm-300);
134
+ --color-warm-400: var(--warm-400);
135
+ --color-warm-500: var(--warm-500);
136
+ --color-warm-600: var(--warm-600);
137
+ --color-warm-700: var(--warm-700);
138
+ --color-warm-800: var(--warm-800);
139
+ --color-warm-900: var(--warm-900);
140
+ --color-warm-950: var(--warm-950);
141
+ --color-amber-0: var(--amber-0);
142
+ --color-amber-50: var(--amber-50);
143
+ --color-amber-100: var(--amber-100);
144
+ --color-amber-200: var(--amber-200);
145
+ --color-amber-300: var(--amber-300);
146
+ --color-amber-400: var(--amber-400);
147
+ --color-amber-500: var(--amber-500);
148
+ --color-amber-600: var(--amber-600);
149
+ --color-amber-700: var(--amber-700);
150
+ --color-amber-800: var(--amber-800);
151
+ --color-amber-900: var(--amber-900);
152
+ --color-amber-950: var(--amber-950);
153
+ --color-acid-0: var(--acid-0);
154
+ --color-acid-50: var(--acid-50);
155
+ --color-acid-100: var(--acid-100);
156
+ --color-acid-200: var(--acid-200);
157
+ --color-acid-300: var(--acid-300);
158
+ --color-acid-400: var(--acid-400);
159
+ --color-acid-500: var(--acid-500);
160
+ --color-acid-600: var(--acid-600);
161
+ --color-acid-700: var(--acid-700);
162
+ --color-acid-800: var(--acid-800);
163
+ --color-acid-900: var(--acid-900);
164
+ --color-acid-950: var(--acid-950);
165
+ --color-neutral-0: var(--neutral-0);
166
+ --color-neutral-50: var(--neutral-50);
167
+ --color-neutral-100: var(--neutral-100);
168
+ --color-neutral-200: var(--neutral-200);
169
+ --color-neutral-300: var(--neutral-300);
170
+ --color-neutral-400: var(--neutral-400);
171
+ --color-neutral-500: var(--neutral-500);
172
+ --color-neutral-600: var(--neutral-600);
173
+ --color-neutral-700: var(--neutral-700);
174
+ --color-neutral-800: var(--neutral-800);
175
+ --color-neutral-900: var(--neutral-900);
176
+ --color-neutral-950: var(--neutral-950);
177
+
178
+ --ui-color-forest-0: var(--forest-0);
179
+ --ui-color-forest-50: var(--forest-50);
180
+ --ui-color-forest-100: var(--forest-100);
181
+ --ui-color-forest-200: var(--forest-200);
182
+ --ui-color-forest-300: var(--forest-300);
183
+ --ui-color-forest-400: var(--forest-400);
184
+ --ui-color-forest-500: var(--forest-500);
185
+ --ui-color-forest-600: var(--forest-600);
186
+ --ui-color-forest-700: var(--forest-700);
187
+ --ui-color-forest-800: var(--forest-800);
188
+ --ui-color-forest-900: var(--forest-900);
189
+ --ui-color-forest-950: var(--forest-950);
190
+ --ui-forest: var(--forest-500);
191
+ --ui-color-maple-0: var(--maple-0);
192
+ --ui-color-maple-50: var(--maple-50);
193
+ --ui-color-maple-100: var(--maple-100);
194
+ --ui-color-maple-200: var(--maple-200);
195
+ --ui-color-maple-300: var(--maple-300);
196
+ --ui-color-maple-400: var(--maple-400);
197
+ --ui-color-maple-500: var(--maple-500);
198
+ --ui-color-maple-600: var(--maple-600);
199
+ --ui-color-maple-700: var(--maple-700);
200
+ --ui-color-maple-800: var(--maple-800);
201
+ --ui-color-maple-900: var(--maple-900);
202
+ --ui-color-maple-950: var(--maple-950);
203
+ --ui-maple: var(--maple-500);
204
+ --ui-color-river-0: var(--river-0);
205
+ --ui-color-river-50: var(--river-50);
206
+ --ui-color-river-100: var(--river-100);
207
+ --ui-color-river-200: var(--river-200);
208
+ --ui-color-river-300: var(--river-300);
209
+ --ui-color-river-400: var(--river-400);
210
+ --ui-color-river-500: var(--river-500);
211
+ --ui-color-river-600: var(--river-600);
212
+ --ui-color-river-700: var(--river-700);
213
+ --ui-color-river-800: var(--river-800);
214
+ --ui-color-river-900: var(--river-900);
215
+ --ui-color-river-950: var(--river-950);
216
+ --ui-river: var(--river-500);
217
+ --ui-color-warm-0: var(--warm-0);
218
+ --ui-color-warm-50: var(--warm-50);
219
+ --ui-color-warm-100: var(--warm-100);
220
+ --ui-color-warm-200: var(--warm-200);
221
+ --ui-color-warm-300: var(--warm-300);
222
+ --ui-color-warm-400: var(--warm-400);
223
+ --ui-color-warm-500: var(--warm-500);
224
+ --ui-color-warm-600: var(--warm-600);
225
+ --ui-color-warm-700: var(--warm-700);
226
+ --ui-color-warm-800: var(--warm-800);
227
+ --ui-color-warm-900: var(--warm-900);
228
+ --ui-color-warm-950: var(--warm-950);
229
+ --ui-warm: var(--warm-500);
230
+ --ui-color-acid-0: var(--acid-0);
231
+ --ui-color-acid-50: var(--acid-50);
232
+ --ui-color-acid-100: var(--acid-100);
233
+ --ui-color-acid-200: var(--acid-200);
234
+ --ui-color-acid-300: var(--acid-300);
235
+ --ui-color-acid-400: var(--acid-400);
236
+ --ui-color-acid-500: var(--acid-500);
237
+ --ui-color-acid-600: var(--acid-600);
238
+ --ui-color-acid-700: var(--acid-700);
239
+ --ui-color-acid-800: var(--acid-800);
240
+ --ui-color-acid-900: var(--acid-900);
241
+ --ui-color-acid-950: var(--acid-950);
242
+ --ui-acid: var(--acid-500);
243
+ --ui-color-neutral-0: var(--neutral-0);
244
+ --ui-color-neutral-50: var(--neutral-50);
245
+ --ui-color-neutral-100: var(--neutral-100);
246
+ --ui-color-neutral-200: var(--neutral-200);
247
+ --ui-color-neutral-300: var(--neutral-300);
248
+ --ui-color-neutral-400: var(--neutral-400);
249
+ --ui-color-neutral-500: var(--neutral-500);
250
+ --ui-color-neutral-600: var(--neutral-600);
251
+ --ui-color-neutral-700: var(--neutral-700);
252
+ --ui-color-neutral-800: var(--neutral-800);
253
+ --ui-color-neutral-900: var(--neutral-900);
254
+ --ui-color-neutral-950: var(--neutral-950);
255
+ --ui-neutral: var(--neutral-500);
256
+ }