@krizaka/tokens 3.34.0 → 3.36.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 (18) hide show
  1. package/BRAND.md +42 -59
  2. package/README.md +23 -14
  3. package/dist/brands/akinaza.css +4 -6
  4. package/dist/brands/kachizaka.css +4 -6
  5. package/dist/brands/krizaka.css +4 -6
  6. package/dist/brands/orazaka.css +4 -6
  7. package/dist/brands/orochia.css +4 -6
  8. package/dist/brands/scoped.css +54 -54
  9. package/dist/brands/yasakia.css +4 -6
  10. package/dist/brands/yazakia.css +4 -6
  11. package/dist/brands/yomizaka.css +4 -6
  12. package/dist/brands/yororis.css +4 -6
  13. package/dist/index.d.ts +8 -0
  14. package/dist/index.js +212 -188
  15. package/dist/native.d.ts +16 -10
  16. package/dist/native.js +139 -127
  17. package/dist/tokens.css +125 -103
  18. package/package.json +2 -2
package/dist/brands/scoped.css CHANGED
@@ -11,8 +11,8 @@
11
11
  --kz-ring: var(--kz-accent);
12
12
  --kz-info: var(--kz-accent);
13
13
  --kz-info-text: var(--kz-accent-text);
14
- --kz-brand-gradient-from: hsl(210 30% 10%);
15
- --kz-brand-gradient-via: hsl(220 14% 7%);
14
+ --kz-brand-gradient-from: var(--kz-surface-0);
15
+ --kz-brand-gradient-via: var(--kz-surface-0);
16
16
  --kz-brand-gradient-to: var(--kz-surface-0);
17
17
  }
18
18
  html.light .brand-krizaka, html .theme-light .brand-krizaka, html .brand-krizaka.theme-light {
@@ -25,8 +25,8 @@ html.light .brand-krizaka, html .theme-light .brand-krizaka, html .brand-krizaka
25
25
  --kz-ring: var(--kz-accent);
26
26
  --kz-info: var(--kz-accent);
27
27
  --kz-info-text: var(--kz-accent-text);
28
- --kz-brand-gradient-from: hsl(208 36% 93%);
29
- --kz-brand-gradient-via: hsl(210 30% 97%);
28
+ --kz-brand-gradient-from: var(--kz-surface-0);
29
+ --kz-brand-gradient-via: var(--kz-surface-0);
30
30
  --kz-brand-gradient-to: var(--kz-surface-0);
31
31
  }
32
32
  html .theme-dark .brand-krizaka, html .brand-krizaka.theme-dark {
@@ -39,8 +39,8 @@ html .theme-dark .brand-krizaka, html .brand-krizaka.theme-dark {
39
39
  --kz-ring: var(--kz-accent);
40
40
  --kz-info: var(--kz-accent);
41
41
  --kz-info-text: var(--kz-accent-text);
42
- --kz-brand-gradient-from: hsl(210 30% 10%);
43
- --kz-brand-gradient-via: hsl(220 14% 7%);
42
+ --kz-brand-gradient-from: var(--kz-surface-0);
43
+ --kz-brand-gradient-via: var(--kz-surface-0);
44
44
  --kz-brand-gradient-to: var(--kz-surface-0);
45
45
  }
46
46
 
@@ -54,8 +54,8 @@ html .theme-dark .brand-krizaka, html .brand-krizaka.theme-dark {
54
54
  --kz-ring: var(--kz-accent);
55
55
  --kz-info: hsl(207 50% 58%);
56
56
  --kz-info-text: hsl(206 58% 72%);
57
- --kz-brand-gradient-from: hsl(24 55% 10%);
58
- --kz-brand-gradient-via: hsl(34 30% 7%);
57
+ --kz-brand-gradient-from: var(--kz-surface-0);
58
+ --kz-brand-gradient-via: var(--kz-surface-0);
59
59
  --kz-brand-gradient-to: var(--kz-surface-0);
60
60
  }
61
61
  html.light .brand-orazaka, html .theme-light .brand-orazaka, html .brand-orazaka.theme-light {
@@ -68,8 +68,8 @@ html.light .brand-orazaka, html .theme-light .brand-orazaka, html .brand-orazaka
68
68
  --kz-ring: var(--kz-accent);
69
69
  --kz-info: hsl(208 54% 36%);
70
70
  --kz-info-text: hsl(208 54% 33%);
71
- --kz-brand-gradient-from: hsl(30 100% 92%);
72
- --kz-brand-gradient-via: hsl(38 80% 96%);
71
+ --kz-brand-gradient-from: var(--kz-surface-0);
72
+ --kz-brand-gradient-via: var(--kz-surface-0);
73
73
  --kz-brand-gradient-to: var(--kz-surface-0);
74
74
  }
75
75
  html .theme-dark .brand-orazaka, html .brand-orazaka.theme-dark {
@@ -82,8 +82,8 @@ html .theme-dark .brand-orazaka, html .brand-orazaka.theme-dark {
82
82
  --kz-ring: var(--kz-accent);
83
83
  --kz-info: hsl(207 50% 58%);
84
84
  --kz-info-text: hsl(206 58% 72%);
85
- --kz-brand-gradient-from: hsl(24 55% 10%);
86
- --kz-brand-gradient-via: hsl(34 30% 7%);
85
+ --kz-brand-gradient-from: var(--kz-surface-0);
86
+ --kz-brand-gradient-via: var(--kz-surface-0);
87
87
  --kz-brand-gradient-to: var(--kz-surface-0);
88
88
  }
89
89
 
@@ -97,8 +97,8 @@ html .theme-dark .brand-orazaka, html .brand-orazaka.theme-dark {
97
97
  --kz-ring: hsl(255.1 91.7% 76.3%);
98
98
  --kz-info: var(--kz-accent);
99
99
  --kz-info-text: var(--kz-accent-text);
100
- --kz-brand-gradient-from: hsl(266 50% 11%);
101
- --kz-brand-gradient-via: hsl(320 35% 8%);
100
+ --kz-brand-gradient-from: var(--kz-surface-0);
101
+ --kz-brand-gradient-via: var(--kz-surface-0);
102
102
  --kz-brand-gradient-to: var(--kz-surface-0);
103
103
  }
104
104
  html.light .brand-orochia, html .theme-light .brand-orochia, html .brand-orochia.theme-light {
@@ -111,8 +111,8 @@ html.light .brand-orochia, html .theme-light .brand-orochia, html .brand-orochia
111
111
  --kz-ring: hsl(262.1 83.3% 57.8%);
112
112
  --kz-info: var(--kz-accent);
113
113
  --kz-info-text: var(--kz-accent-text);
114
- --kz-brand-gradient-from: hsl(262 90% 95%);
115
- --kz-brand-gradient-via: hsl(330 80% 96%);
114
+ --kz-brand-gradient-from: var(--kz-surface-0);
115
+ --kz-brand-gradient-via: var(--kz-surface-0);
116
116
  --kz-brand-gradient-to: var(--kz-surface-0);
117
117
  }
118
118
  html .theme-dark .brand-orochia, html .brand-orochia.theme-dark {
@@ -125,8 +125,8 @@ html .theme-dark .brand-orochia, html .brand-orochia.theme-dark {
125
125
  --kz-ring: hsl(255.1 91.7% 76.3%);
126
126
  --kz-info: var(--kz-accent);
127
127
  --kz-info-text: var(--kz-accent-text);
128
- --kz-brand-gradient-from: hsl(266 50% 11%);
129
- --kz-brand-gradient-via: hsl(320 35% 8%);
128
+ --kz-brand-gradient-from: var(--kz-surface-0);
129
+ --kz-brand-gradient-via: var(--kz-surface-0);
130
130
  --kz-brand-gradient-to: var(--kz-surface-0);
131
131
  }
132
132
 
@@ -140,8 +140,8 @@ html .theme-dark .brand-orochia, html .brand-orochia.theme-dark {
140
140
  --kz-ring: var(--kz-accent);
141
141
  --kz-info: hsl(207 50% 58%);
142
142
  --kz-info-text: hsl(206 58% 72%);
143
- --kz-brand-gradient-from: hsl(166 55% 9%);
144
- --kz-brand-gradient-via: hsl(180 35% 7%);
143
+ --kz-brand-gradient-from: var(--kz-surface-0);
144
+ --kz-brand-gradient-via: var(--kz-surface-0);
145
145
  --kz-brand-gradient-to: var(--kz-surface-0);
146
146
  }
147
147
  html.light .brand-yasakia, html .theme-light .brand-yasakia, html .brand-yasakia.theme-light {
@@ -154,8 +154,8 @@ html.light .brand-yasakia, html .theme-light .brand-yasakia, html .brand-yasakia
154
154
  --kz-ring: var(--kz-accent);
155
155
  --kz-info: hsl(208 54% 36%);
156
156
  --kz-info-text: hsl(208 54% 33%);
157
- --kz-brand-gradient-from: hsl(160 70% 93%);
158
- --kz-brand-gradient-via: hsl(176 70% 95%);
157
+ --kz-brand-gradient-from: var(--kz-surface-0);
158
+ --kz-brand-gradient-via: var(--kz-surface-0);
159
159
  --kz-brand-gradient-to: var(--kz-surface-0);
160
160
  }
161
161
  html .theme-dark .brand-yasakia, html .brand-yasakia.theme-dark {
@@ -168,8 +168,8 @@ html .theme-dark .brand-yasakia, html .brand-yasakia.theme-dark {
168
168
  --kz-ring: var(--kz-accent);
169
169
  --kz-info: hsl(207 50% 58%);
170
170
  --kz-info-text: hsl(206 58% 72%);
171
- --kz-brand-gradient-from: hsl(166 55% 9%);
172
- --kz-brand-gradient-via: hsl(180 35% 7%);
171
+ --kz-brand-gradient-from: var(--kz-surface-0);
172
+ --kz-brand-gradient-via: var(--kz-surface-0);
173
173
  --kz-brand-gradient-to: var(--kz-surface-0);
174
174
  }
175
175
 
@@ -183,8 +183,8 @@ html .theme-dark .brand-yasakia, html .brand-yasakia.theme-dark {
183
183
  --kz-ring: var(--kz-accent);
184
184
  --kz-info: hsl(207 50% 58%);
185
185
  --kz-info-text: hsl(206 58% 72%);
186
- --kz-brand-gradient-from: hsl(36 22% 9%);
187
- --kz-brand-gradient-via: hsl(98 14% 7%);
186
+ --kz-brand-gradient-from: var(--kz-surface-0);
187
+ --kz-brand-gradient-via: var(--kz-surface-0);
188
188
  --kz-brand-gradient-to: var(--kz-surface-0);
189
189
  }
190
190
  html.light .brand-yororis, html .theme-light .brand-yororis, html .brand-yororis.theme-light {
@@ -197,8 +197,8 @@ html.light .brand-yororis, html .theme-light .brand-yororis, html .brand-yororis
197
197
  --kz-ring: var(--kz-accent);
198
198
  --kz-info: hsl(208 54% 36%);
199
199
  --kz-info-text: hsl(208 54% 33%);
200
- --kz-brand-gradient-from: hsl(38 45% 93%);
201
- --kz-brand-gradient-via: hsl(96 30% 95%);
200
+ --kz-brand-gradient-from: var(--kz-surface-0);
201
+ --kz-brand-gradient-via: var(--kz-surface-0);
202
202
  --kz-brand-gradient-to: var(--kz-surface-0);
203
203
  }
204
204
  html .theme-dark .brand-yororis, html .brand-yororis.theme-dark {
@@ -211,8 +211,8 @@ html .theme-dark .brand-yororis, html .brand-yororis.theme-dark {
211
211
  --kz-ring: var(--kz-accent);
212
212
  --kz-info: hsl(207 50% 58%);
213
213
  --kz-info-text: hsl(206 58% 72%);
214
- --kz-brand-gradient-from: hsl(36 22% 9%);
215
- --kz-brand-gradient-via: hsl(98 14% 7%);
214
+ --kz-brand-gradient-from: var(--kz-surface-0);
215
+ --kz-brand-gradient-via: var(--kz-surface-0);
216
216
  --kz-brand-gradient-to: var(--kz-surface-0);
217
217
  }
218
218
 
@@ -226,8 +226,8 @@ html .theme-dark .brand-yororis, html .brand-yororis.theme-dark {
226
226
  --kz-ring: var(--kz-accent);
227
227
  --kz-info: hsl(207 50% 58%);
228
228
  --kz-info-text: hsl(206 58% 72%);
229
- --kz-brand-gradient-from: hsl(236 30% 10%);
230
- --kz-brand-gradient-via: hsl(244 22% 8%);
229
+ --kz-brand-gradient-from: var(--kz-surface-0);
230
+ --kz-brand-gradient-via: var(--kz-surface-0);
231
231
  --kz-brand-gradient-to: var(--kz-surface-0);
232
232
  }
233
233
  html.light .brand-yomizaka, html .theme-light .brand-yomizaka, html .brand-yomizaka.theme-light {
@@ -240,8 +240,8 @@ html.light .brand-yomizaka, html .theme-light .brand-yomizaka, html .brand-yomiz
240
240
  --kz-ring: var(--kz-accent);
241
241
  --kz-info: hsl(208 54% 36%);
242
242
  --kz-info-text: hsl(208 54% 33%);
243
- --kz-brand-gradient-from: hsl(236 60% 95%);
244
- --kz-brand-gradient-via: hsl(244 50% 96%);
243
+ --kz-brand-gradient-from: var(--kz-surface-0);
244
+ --kz-brand-gradient-via: var(--kz-surface-0);
245
245
  --kz-brand-gradient-to: var(--kz-surface-0);
246
246
  }
247
247
  html .theme-dark .brand-yomizaka, html .brand-yomizaka.theme-dark {
@@ -254,8 +254,8 @@ html .theme-dark .brand-yomizaka, html .brand-yomizaka.theme-dark {
254
254
  --kz-ring: var(--kz-accent);
255
255
  --kz-info: hsl(207 50% 58%);
256
256
  --kz-info-text: hsl(206 58% 72%);
257
- --kz-brand-gradient-from: hsl(236 30% 10%);
258
- --kz-brand-gradient-via: hsl(244 22% 8%);
257
+ --kz-brand-gradient-from: var(--kz-surface-0);
258
+ --kz-brand-gradient-via: var(--kz-surface-0);
259
259
  --kz-brand-gradient-to: var(--kz-surface-0);
260
260
  }
261
261
 
@@ -269,8 +269,8 @@ html .theme-dark .brand-yomizaka, html .brand-yomizaka.theme-dark {
269
269
  --kz-ring: hsl(48 96% 56%);
270
270
  --kz-info: hsl(207 50% 58%);
271
271
  --kz-info-text: hsl(206 58% 72%);
272
- --kz-brand-gradient-from: hsl(226 42% 11%);
273
- --kz-brand-gradient-via: hsl(232 26% 8%);
272
+ --kz-brand-gradient-from: var(--kz-surface-0);
273
+ --kz-brand-gradient-via: var(--kz-surface-0);
274
274
  --kz-brand-gradient-to: var(--kz-surface-0);
275
275
  }
276
276
  html.light .brand-kachizaka, html .theme-light .brand-kachizaka, html .brand-kachizaka.theme-light {
@@ -283,8 +283,8 @@ html.light .brand-kachizaka, html .theme-light .brand-kachizaka, html .brand-kac
283
283
  --kz-ring: hsl(226 80% 46%);
284
284
  --kz-info: hsl(208 54% 36%);
285
285
  --kz-info-text: hsl(208 54% 33%);
286
- --kz-brand-gradient-from: hsl(226 80% 95%);
287
- --kz-brand-gradient-via: hsl(48 80% 95%);
286
+ --kz-brand-gradient-from: var(--kz-surface-0);
287
+ --kz-brand-gradient-via: var(--kz-surface-0);
288
288
  --kz-brand-gradient-to: var(--kz-surface-0);
289
289
  }
290
290
  html .theme-dark .brand-kachizaka, html .brand-kachizaka.theme-dark {
@@ -297,8 +297,8 @@ html .theme-dark .brand-kachizaka, html .brand-kachizaka.theme-dark {
297
297
  --kz-ring: hsl(48 96% 56%);
298
298
  --kz-info: hsl(207 50% 58%);
299
299
  --kz-info-text: hsl(206 58% 72%);
300
- --kz-brand-gradient-from: hsl(226 42% 11%);
301
- --kz-brand-gradient-via: hsl(232 26% 8%);
300
+ --kz-brand-gradient-from: var(--kz-surface-0);
301
+ --kz-brand-gradient-via: var(--kz-surface-0);
302
302
  --kz-brand-gradient-to: var(--kz-surface-0);
303
303
  }
304
304
 
@@ -312,8 +312,8 @@ html .theme-dark .brand-kachizaka, html .brand-kachizaka.theme-dark {
312
312
  --kz-ring: var(--kz-accent);
313
313
  --kz-info: hsl(207 50% 58%);
314
314
  --kz-info-text: hsl(206 58% 72%);
315
- --kz-brand-gradient-from: hsl(140 28% 9%);
316
- --kz-brand-gradient-via: hsl(24 20% 8%);
315
+ --kz-brand-gradient-from: var(--kz-surface-0);
316
+ --kz-brand-gradient-via: var(--kz-surface-0);
317
317
  --kz-brand-gradient-to: var(--kz-surface-0);
318
318
  }
319
319
  html.light .brand-akinaza, html .theme-light .brand-akinaza, html .brand-akinaza.theme-light {
@@ -326,8 +326,8 @@ html.light .brand-akinaza, html .theme-light .brand-akinaza, html .brand-akinaza
326
326
  --kz-ring: var(--kz-accent);
327
327
  --kz-info: hsl(208 54% 36%);
328
328
  --kz-info-text: hsl(208 54% 33%);
329
- --kz-brand-gradient-from: hsl(130 45% 94%);
330
- --kz-brand-gradient-via: hsl(26 60% 95%);
329
+ --kz-brand-gradient-from: var(--kz-surface-0);
330
+ --kz-brand-gradient-via: var(--kz-surface-0);
331
331
  --kz-brand-gradient-to: var(--kz-surface-0);
332
332
  }
333
333
  html .theme-dark .brand-akinaza, html .brand-akinaza.theme-dark {
@@ -340,8 +340,8 @@ html .theme-dark .brand-akinaza, html .brand-akinaza.theme-dark {
340
340
  --kz-ring: var(--kz-accent);
341
341
  --kz-info: hsl(207 50% 58%);
342
342
  --kz-info-text: hsl(206 58% 72%);
343
- --kz-brand-gradient-from: hsl(140 28% 9%);
344
- --kz-brand-gradient-via: hsl(24 20% 8%);
343
+ --kz-brand-gradient-from: var(--kz-surface-0);
344
+ --kz-brand-gradient-via: var(--kz-surface-0);
345
345
  --kz-brand-gradient-to: var(--kz-surface-0);
346
346
  }
347
347
 
@@ -356,8 +356,8 @@ html .theme-dark .brand-akinaza, html .brand-akinaza.theme-dark {
356
356
  --kz-ring: var(--kz-accent);
357
357
  --kz-info: hsl(207 50% 58%);
358
358
  --kz-info-text: hsl(206 58% 72%);
359
- --kz-brand-gradient-from: hsl(166 55% 9%);
360
- --kz-brand-gradient-via: hsl(180 35% 7%);
359
+ --kz-brand-gradient-from: var(--kz-surface-0);
360
+ --kz-brand-gradient-via: var(--kz-surface-0);
361
361
  --kz-brand-gradient-to: var(--kz-surface-0);
362
362
  }
363
363
  html.light .brand-yazakia, html .theme-light .brand-yazakia, html .brand-yazakia.theme-light {
@@ -370,8 +370,8 @@ html.light .brand-yazakia, html .theme-light .brand-yazakia, html .brand-yazakia
370
370
  --kz-ring: var(--kz-accent);
371
371
  --kz-info: hsl(208 54% 36%);
372
372
  --kz-info-text: hsl(208 54% 33%);
373
- --kz-brand-gradient-from: hsl(160 70% 93%);
374
- --kz-brand-gradient-via: hsl(176 70% 95%);
373
+ --kz-brand-gradient-from: var(--kz-surface-0);
374
+ --kz-brand-gradient-via: var(--kz-surface-0);
375
375
  --kz-brand-gradient-to: var(--kz-surface-0);
376
376
  }
377
377
  html .theme-dark .brand-yazakia, html .brand-yazakia.theme-dark {
@@ -384,7 +384,7 @@ html .theme-dark .brand-yazakia, html .brand-yazakia.theme-dark {
384
384
  --kz-ring: var(--kz-accent);
385
385
  --kz-info: hsl(207 50% 58%);
386
386
  --kz-info-text: hsl(206 58% 72%);
387
- --kz-brand-gradient-from: hsl(166 55% 9%);
388
- --kz-brand-gradient-via: hsl(180 35% 7%);
387
+ --kz-brand-gradient-from: var(--kz-surface-0);
388
+ --kz-brand-gradient-via: var(--kz-surface-0);
389
389
  --kz-brand-gradient-to: var(--kz-surface-0);
390
390
  }
package/dist/brands/yasakia.css CHANGED
@@ -12,8 +12,8 @@
12
12
  --kz-ring: var(--kz-accent);
13
13
  --kz-info: hsl(207 50% 58%);
14
14
  --kz-info-text: hsl(206 58% 72%);
15
- --kz-brand-gradient-from: hsl(166 55% 9%);
16
- --kz-brand-gradient-via: hsl(180 35% 7%);
15
+ --kz-brand-gradient-from: var(--kz-surface-0);
16
+ --kz-brand-gradient-via: var(--kz-surface-0);
17
17
  --kz-brand-gradient-to: var(--kz-surface-0);
18
18
  }
19
19
 
@@ -26,8 +26,6 @@ html.light {
26
26
  --kz-on-accent: hsl(0 0% 100%);
27
27
  --kz-info: hsl(208 54% 36%);
28
28
  --kz-info-text: hsl(208 54% 33%);
29
- --kz-brand-gradient-from: hsl(160 70% 93%);
30
- --kz-brand-gradient-via: hsl(176 70% 95%);
31
29
  }
32
30
 
33
31
  .theme-light {
@@ -40,7 +38,7 @@ html.light {
40
38
  --kz-ring: var(--kz-accent);
41
39
  --kz-info: hsl(208 54% 36%);
42
40
  --kz-info-text: hsl(208 54% 33%);
43
- --kz-brand-gradient-from: hsl(160 70% 93%);
44
- --kz-brand-gradient-via: hsl(176 70% 95%);
41
+ --kz-brand-gradient-from: var(--kz-surface-0);
42
+ --kz-brand-gradient-via: var(--kz-surface-0);
45
43
  --kz-brand-gradient-to: var(--kz-surface-0);
46
44
  }
package/dist/brands/yazakia.css CHANGED
@@ -13,8 +13,8 @@
13
13
  --kz-ring: var(--kz-accent);
14
14
  --kz-info: hsl(207 50% 58%);
15
15
  --kz-info-text: hsl(206 58% 72%);
16
- --kz-brand-gradient-from: hsl(166 55% 9%);
17
- --kz-brand-gradient-via: hsl(180 35% 7%);
16
+ --kz-brand-gradient-from: var(--kz-surface-0);
17
+ --kz-brand-gradient-via: var(--kz-surface-0);
18
18
  --kz-brand-gradient-to: var(--kz-surface-0);
19
19
  }
20
20
 
@@ -27,8 +27,6 @@ html.light {
27
27
  --kz-on-accent: hsl(0 0% 100%);
28
28
  --kz-info: hsl(208 54% 36%);
29
29
  --kz-info-text: hsl(208 54% 33%);
30
- --kz-brand-gradient-from: hsl(160 70% 93%);
31
- --kz-brand-gradient-via: hsl(176 70% 95%);
32
30
  }
33
31
 
34
32
  .theme-light {
@@ -41,7 +39,7 @@ html.light {
41
39
  --kz-ring: var(--kz-accent);
42
40
  --kz-info: hsl(208 54% 36%);
43
41
  --kz-info-text: hsl(208 54% 33%);
44
- --kz-brand-gradient-from: hsl(160 70% 93%);
45
- --kz-brand-gradient-via: hsl(176 70% 95%);
42
+ --kz-brand-gradient-from: var(--kz-surface-0);
43
+ --kz-brand-gradient-via: var(--kz-surface-0);
46
44
  --kz-brand-gradient-to: var(--kz-surface-0);
47
45
  }
package/dist/brands/yomizaka.css CHANGED
@@ -12,8 +12,8 @@
12
12
  --kz-ring: var(--kz-accent);
13
13
  --kz-info: hsl(207 50% 58%);
14
14
  --kz-info-text: hsl(206 58% 72%);
15
- --kz-brand-gradient-from: hsl(236 30% 10%);
16
- --kz-brand-gradient-via: hsl(244 22% 8%);
15
+ --kz-brand-gradient-from: var(--kz-surface-0);
16
+ --kz-brand-gradient-via: var(--kz-surface-0);
17
17
  --kz-brand-gradient-to: var(--kz-surface-0);
18
18
  }
19
19
 
@@ -26,8 +26,6 @@ html.light {
26
26
  --kz-on-accent: hsl(0 0% 100%);
27
27
  --kz-info: hsl(208 54% 36%);
28
28
  --kz-info-text: hsl(208 54% 33%);
29
- --kz-brand-gradient-from: hsl(236 60% 95%);
30
- --kz-brand-gradient-via: hsl(244 50% 96%);
31
29
  }
32
30
 
33
31
  .theme-light {
@@ -40,7 +38,7 @@ html.light {
40
38
  --kz-ring: var(--kz-accent);
41
39
  --kz-info: hsl(208 54% 36%);
42
40
  --kz-info-text: hsl(208 54% 33%);
43
- --kz-brand-gradient-from: hsl(236 60% 95%);
44
- --kz-brand-gradient-via: hsl(244 50% 96%);
41
+ --kz-brand-gradient-from: var(--kz-surface-0);
42
+ --kz-brand-gradient-via: var(--kz-surface-0);
45
43
  --kz-brand-gradient-to: var(--kz-surface-0);
46
44
  }
package/dist/brands/yororis.css CHANGED
@@ -12,8 +12,8 @@
12
12
  --kz-ring: var(--kz-accent);
13
13
  --kz-info: hsl(207 50% 58%);
14
14
  --kz-info-text: hsl(206 58% 72%);
15
- --kz-brand-gradient-from: hsl(36 22% 9%);
16
- --kz-brand-gradient-via: hsl(98 14% 7%);
15
+ --kz-brand-gradient-from: var(--kz-surface-0);
16
+ --kz-brand-gradient-via: var(--kz-surface-0);
17
17
  --kz-brand-gradient-to: var(--kz-surface-0);
18
18
  }
19
19
 
@@ -26,8 +26,6 @@ html.light {
26
26
  --kz-on-accent: hsl(0 0% 100%);
27
27
  --kz-info: hsl(208 54% 36%);
28
28
  --kz-info-text: hsl(208 54% 33%);
29
- --kz-brand-gradient-from: hsl(38 45% 93%);
30
- --kz-brand-gradient-via: hsl(96 30% 95%);
31
29
  }
32
30
 
33
31
  .theme-light {
@@ -40,7 +38,7 @@ html.light {
40
38
  --kz-ring: var(--kz-accent);
41
39
  --kz-info: hsl(208 54% 36%);
42
40
  --kz-info-text: hsl(208 54% 33%);
43
- --kz-brand-gradient-from: hsl(38 45% 93%);
44
- --kz-brand-gradient-via: hsl(96 30% 95%);
41
+ --kz-brand-gradient-from: var(--kz-surface-0);
42
+ --kz-brand-gradient-via: var(--kz-surface-0);
45
43
  --kz-brand-gradient-to: var(--kz-surface-0);
46
44
  }
package/dist/index.d.ts CHANGED
@@ -38,6 +38,12 @@ export declare const tokens: {
38
38
  readonly scrim: "var(--kz-scrim)";
39
39
  readonly scrimStrong: "var(--kz-scrim-strong)";
40
40
  readonly overlay: "var(--kz-overlay)";
41
+ readonly paperRuleMajor: "var(--kz-paper-rule-major)";
42
+ readonly paperRuleMinor: "var(--kz-paper-rule-minor)";
43
+ readonly paperRuleMargin: "var(--kz-paper-rule-margin)";
44
+ readonly paperTag: "var(--kz-paper-tag)";
45
+ readonly paperTagEdge: "var(--kz-paper-tag-edge)";
46
+ readonly paperTagInk: "var(--kz-paper-tag-ink)";
41
47
  readonly radiusXs: "var(--kz-radius-xs)";
42
48
  readonly radiusSm: "var(--kz-radius-sm)";
43
49
  readonly radiusMd: "var(--kz-radius-md)";
@@ -68,6 +74,8 @@ export declare const tokens: {
68
74
  readonly controlField: "var(--kz-control-field)";
69
75
  readonly cutShape: "var(--kz-cut-shape)";
70
76
  readonly cutSize: "var(--kz-cut-size)";
77
+ readonly paperModule: "var(--kz-paper-module)";
78
+ readonly paperLine: "var(--kz-paper-line)";
71
79
  readonly ease: "var(--kz-ease)";
72
80
  readonly easeSpring: "var(--kz-ease-spring)";
73
81
  readonly durationInstant: "var(--kz-duration-instant)";