@noxickon/onyx 6.1.0 → 6.1.1

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 (5) hide show
  1. package/dist/tokens/ambient.css +21 -0
  2. package/dist/tokens/console.css +17 -0
  3. package/dist/tokens/shared.css +873 -0
  4. package/dist/tokens/tones.css +730 -0
  5. package/package.json +2 -2
package/dist/tokens/tones.css ADDED
@@ -0,0 +1,730 @@
1
+ :root {
2
+ --primary: var(--color-primary-600);
3
+ --primary-fg: var(--fg-on-solid);
4
+ --primary-ink: var(--color-primary-400);
5
+ --primary-soft: color-mix(in oklab, var(--color-primary-500) 18%, transparent);
6
+ --primary-soft-fg: var(--color-primary-300);
7
+ --primary-outline: color-mix(in oklab, var(--color-primary-500) 42%, transparent);
8
+
9
+ --neutral: var(--color-neutral-700);
10
+ --neutral-fg: var(--fg-on-solid);
11
+ --neutral-ink: var(--color-neutral-400);
12
+ --neutral-soft: color-mix(in oklab, var(--color-neutral-500) 18%, transparent);
13
+ --neutral-soft-fg: var(--color-neutral-300);
14
+ --neutral-outline: color-mix(in oklab, var(--color-neutral-500) 42%, transparent);
15
+
16
+ --info: var(--color-info-700);
17
+ --info-fg: var(--fg-on-solid);
18
+ --info-ink: var(--color-info-400);
19
+ --info-soft: color-mix(in oklab, var(--color-info-500) 18%, transparent);
20
+ --info-soft-fg: var(--color-info-300);
21
+ --info-outline: color-mix(in oklab, var(--color-info-500) 42%, transparent);
22
+
23
+ --success: var(--color-success-700);
24
+ --success-fg: var(--fg-on-solid);
25
+ --success-ink: var(--color-success-400);
26
+ --success-soft: color-mix(in oklab, var(--color-success-500) 18%, transparent);
27
+ --success-soft-fg: var(--color-success-300);
28
+ --success-outline: color-mix(in oklab, var(--color-success-500) 42%, transparent);
29
+
30
+ --warning: var(--color-warning-700);
31
+ --warning-fg: var(--fg-on-solid);
32
+ --warning-ink: oklch(0.83 0.155 85);
33
+ --warning-soft: color-mix(in oklab, var(--color-warning-500) 18%, transparent);
34
+ --warning-soft-fg: var(--color-warning-300);
35
+ --warning-outline: color-mix(in oklab, var(--color-warning-500) 42%, transparent);
36
+
37
+ --danger: var(--color-danger-600);
38
+ --danger-fg: oklch(0.965 0.013 25);
39
+ --danger-ink: oklch(0.705 0.142 25);
40
+ --danger-soft: color-mix(in oklab, var(--color-danger-500) 18%, transparent);
41
+ --danger-soft-fg: var(--color-danger-300);
42
+ --danger-outline: color-mix(in oklab, var(--color-danger-500) 42%, transparent);
43
+
44
+ --trace-log: var(--color-trace-log-700);
45
+ --trace-log-fg: var(--fg-on-solid);
46
+ --trace-log-ink: var(--color-trace-log-400);
47
+ --trace-log-soft: color-mix(in oklab, var(--color-trace-log-500) 18%, transparent);
48
+ --trace-log-soft-fg: var(--color-trace-log-300);
49
+ --trace-log-outline: color-mix(in oklab, var(--color-trace-log-500) 42%, transparent);
50
+
51
+ --debug-log: var(--color-debug-log-700);
52
+ --debug-log-fg: var(--fg-on-solid);
53
+ --debug-log-ink: var(--color-debug-log-400);
54
+ --debug-log-soft: color-mix(in oklab, var(--color-debug-log-500) 18%, transparent);
55
+ --debug-log-soft-fg: var(--color-debug-log-300);
56
+ --debug-log-outline: color-mix(in oklab, var(--color-debug-log-500) 42%, transparent);
57
+
58
+ --info-log: var(--color-info-log-700);
59
+ --info-log-fg: var(--fg-on-solid);
60
+ --info-log-ink: var(--color-info-log-400);
61
+ --info-log-soft: color-mix(in oklab, var(--color-info-log-500) 18%, transparent);
62
+ --info-log-soft-fg: var(--color-info-log-300);
63
+ --info-log-outline: color-mix(in oklab, var(--color-info-log-500) 42%, transparent);
64
+
65
+ --warn-log: var(--color-warn-log-700);
66
+ --warn-log-fg: var(--fg-on-solid);
67
+ --warn-log-ink: var(--color-warn-log-400);
68
+ --warn-log-soft: color-mix(in oklab, var(--color-warn-log-500) 18%, transparent);
69
+ --warn-log-soft-fg: var(--color-warn-log-300);
70
+ --warn-log-outline: color-mix(in oklab, var(--color-warn-log-500) 42%, transparent);
71
+
72
+ --error-log: var(--color-error-log-600);
73
+ --error-log-fg: var(--fg-on-solid);
74
+ --error-log-ink: var(--color-error-log-400);
75
+ --error-log-soft: color-mix(in oklab, var(--color-error-log-500) 18%, transparent);
76
+ --error-log-soft-fg: var(--color-error-log-300);
77
+ --error-log-outline: color-mix(in oklab, var(--color-error-log-500) 42%, transparent);
78
+
79
+ --fatal-log: var(--color-fatal-log-600);
80
+ --fatal-log-fg: var(--fg-on-solid);
81
+ --fatal-log-ink: var(--color-fatal-log-400);
82
+ --fatal-log-soft: color-mix(in oklab, var(--color-fatal-log-500) 18%, transparent);
83
+ --fatal-log-soft-fg: var(--color-fatal-log-300);
84
+ --fatal-log-outline: color-mix(in oklab, var(--color-fatal-log-500) 42%, transparent);
85
+
86
+ --slate: var(--color-slate-700);
87
+ --slate-fg: var(--fg-on-solid);
88
+ --slate-ink: var(--color-slate-400);
89
+ --slate-soft: color-mix(in oklab, var(--color-slate-500) 18%, transparent);
90
+ --slate-soft-fg: var(--color-slate-300);
91
+ --slate-outline: color-mix(in oklab, var(--color-slate-500) 42%, transparent);
92
+
93
+ --gray: var(--color-gray-700);
94
+ --gray-fg: var(--fg-on-solid);
95
+ --gray-ink: var(--color-gray-400);
96
+ --gray-soft: color-mix(in oklab, var(--color-gray-500) 18%, transparent);
97
+ --gray-soft-fg: var(--color-gray-300);
98
+ --gray-outline: color-mix(in oklab, var(--color-gray-500) 42%, transparent);
99
+
100
+ --zinc: var(--color-zinc-700);
101
+ --zinc-fg: var(--fg-on-solid);
102
+ --zinc-ink: var(--color-zinc-400);
103
+ --zinc-soft: color-mix(in oklab, var(--color-zinc-500) 18%, transparent);
104
+ --zinc-soft-fg: var(--color-zinc-300);
105
+ --zinc-outline: color-mix(in oklab, var(--color-zinc-500) 42%, transparent);
106
+
107
+ --stone: var(--color-stone-700);
108
+ --stone-fg: var(--fg-on-solid);
109
+ --stone-ink: var(--color-stone-400);
110
+ --stone-soft: color-mix(in oklab, var(--color-stone-500) 18%, transparent);
111
+ --stone-soft-fg: var(--color-stone-300);
112
+ --stone-outline: color-mix(in oklab, var(--color-stone-500) 42%, transparent);
113
+
114
+ --red: var(--color-red-600);
115
+ --red-fg: var(--fg-on-solid);
116
+ --red-ink: var(--color-red-400);
117
+ --red-soft: color-mix(in oklab, var(--color-red-500) 18%, transparent);
118
+ --red-soft-fg: var(--color-red-300);
119
+ --red-outline: color-mix(in oklab, var(--color-red-500) 42%, transparent);
120
+
121
+ --sky: var(--color-sky-700);
122
+ --sky-fg: var(--fg-on-solid);
123
+ --sky-ink: var(--color-sky-400);
124
+ --sky-soft: color-mix(in oklab, var(--color-sky-500) 18%, transparent);
125
+ --sky-soft-fg: var(--color-sky-300);
126
+ --sky-outline: color-mix(in oklab, var(--color-sky-500) 42%, transparent);
127
+
128
+ --blue: var(--color-blue-700);
129
+ --blue-fg: var(--fg-on-solid);
130
+ --blue-ink: var(--color-blue-400);
131
+ --blue-soft: color-mix(in oklab, var(--color-blue-500) 18%, transparent);
132
+ --blue-soft-fg: var(--color-blue-300);
133
+ --blue-outline: color-mix(in oklab, var(--color-blue-500) 42%, transparent);
134
+
135
+ --indigo: var(--color-indigo-700);
136
+ --indigo-fg: var(--fg-on-solid);
137
+ --indigo-ink: var(--color-indigo-400);
138
+ --indigo-soft: color-mix(in oklab, var(--color-indigo-500) 18%, transparent);
139
+ --indigo-soft-fg: var(--color-indigo-300);
140
+ --indigo-outline: color-mix(in oklab, var(--color-indigo-500) 42%, transparent);
141
+
142
+ --violet: var(--color-violet-600);
143
+ --violet-fg: var(--fg-on-solid);
144
+ --violet-ink: var(--color-violet-400);
145
+ --violet-soft: color-mix(in oklab, var(--color-violet-500) 18%, transparent);
146
+ --violet-soft-fg: var(--color-violet-300);
147
+ --violet-outline: color-mix(in oklab, var(--color-violet-500) 42%, transparent);
148
+
149
+ --purple: var(--color-purple-600);
150
+ --purple-fg: var(--fg-on-solid);
151
+ --purple-ink: var(--color-purple-400);
152
+ --purple-soft: color-mix(in oklab, var(--color-purple-500) 18%, transparent);
153
+ --purple-soft-fg: var(--color-purple-300);
154
+ --purple-outline: color-mix(in oklab, var(--color-purple-500) 42%, transparent);
155
+
156
+ --fuchsia: var(--color-fuchsia-600);
157
+ --fuchsia-fg: var(--fg-on-solid);
158
+ --fuchsia-ink: var(--color-fuchsia-400);
159
+ --fuchsia-soft: color-mix(in oklab, var(--color-fuchsia-500) 18%, transparent);
160
+ --fuchsia-soft-fg: var(--color-fuchsia-300);
161
+ --fuchsia-outline: color-mix(in oklab, var(--color-fuchsia-500) 42%, transparent);
162
+
163
+ --pink: var(--color-pink-600);
164
+ --pink-fg: var(--fg-on-solid);
165
+ --pink-ink: var(--color-pink-400);
166
+ --pink-soft: color-mix(in oklab, var(--color-pink-500) 18%, transparent);
167
+ --pink-soft-fg: var(--color-pink-300);
168
+ --pink-outline: color-mix(in oklab, var(--color-pink-500) 42%, transparent);
169
+
170
+ --rose: var(--color-rose-600);
171
+ --rose-fg: var(--fg-on-solid);
172
+ --rose-ink: var(--color-rose-400);
173
+ --rose-soft: color-mix(in oklab, var(--color-rose-500) 18%, transparent);
174
+ --rose-soft-fg: var(--color-rose-300);
175
+ --rose-outline: color-mix(in oklab, var(--color-rose-500) 42%, transparent);
176
+
177
+ --orange: var(--color-orange-700);
178
+ --orange-fg: var(--fg-on-solid);
179
+ --orange-ink: var(--color-orange-400);
180
+ --orange-soft: color-mix(in oklab, var(--color-orange-500) 18%, transparent);
181
+ --orange-soft-fg: var(--color-orange-300);
182
+ --orange-outline: color-mix(in oklab, var(--color-orange-500) 42%, transparent);
183
+
184
+ --amber: var(--color-amber-700);
185
+ --amber-fg: var(--fg-on-solid);
186
+ --amber-ink: var(--color-amber-400);
187
+ --amber-soft: color-mix(in oklab, var(--color-amber-500) 18%, transparent);
188
+ --amber-soft-fg: var(--color-amber-300);
189
+ --amber-outline: color-mix(in oklab, var(--color-amber-500) 42%, transparent);
190
+
191
+ --yellow: var(--color-yellow-700);
192
+ --yellow-fg: var(--fg-on-solid);
193
+ --yellow-ink: var(--color-yellow-400);
194
+ --yellow-soft: color-mix(in oklab, var(--color-yellow-500) 18%, transparent);
195
+ --yellow-soft-fg: var(--color-yellow-300);
196
+ --yellow-outline: color-mix(in oklab, var(--color-yellow-500) 42%, transparent);
197
+
198
+ --lime: var(--color-lime-700);
199
+ --lime-fg: var(--fg-on-solid);
200
+ --lime-ink: var(--color-lime-400);
201
+ --lime-soft: color-mix(in oklab, var(--color-lime-500) 18%, transparent);
202
+ --lime-soft-fg: var(--color-lime-300);
203
+ --lime-outline: color-mix(in oklab, var(--color-lime-500) 42%, transparent);
204
+
205
+ --green: var(--color-green-700);
206
+ --green-fg: var(--fg-on-solid);
207
+ --green-ink: var(--color-green-400);
208
+ --green-soft: color-mix(in oklab, var(--color-green-500) 18%, transparent);
209
+ --green-soft-fg: var(--color-green-300);
210
+ --green-outline: color-mix(in oklab, var(--color-green-500) 42%, transparent);
211
+
212
+ --emerald: var(--color-emerald-700);
213
+ --emerald-fg: var(--fg-on-solid);
214
+ --emerald-ink: var(--color-emerald-400);
215
+ --emerald-soft: color-mix(in oklab, var(--color-emerald-500) 18%, transparent);
216
+ --emerald-soft-fg: var(--color-emerald-300);
217
+ --emerald-outline: color-mix(in oklab, var(--color-emerald-500) 42%, transparent);
218
+
219
+ --teal: var(--color-teal-700);
220
+ --teal-fg: var(--fg-on-solid);
221
+ --teal-ink: var(--color-teal-400);
222
+ --teal-soft: color-mix(in oklab, var(--color-teal-500) 18%, transparent);
223
+ --teal-soft-fg: var(--color-teal-300);
224
+ --teal-outline: color-mix(in oklab, var(--color-teal-500) 42%, transparent);
225
+
226
+ --cyan: var(--color-cyan-700);
227
+ --cyan-fg: var(--fg-on-solid);
228
+ --cyan-ink: var(--color-cyan-400);
229
+ --cyan-soft: color-mix(in oklab, var(--color-cyan-500) 18%, transparent);
230
+ --cyan-soft-fg: var(--color-cyan-300);
231
+ --cyan-outline: color-mix(in oklab, var(--color-cyan-500) 42%, transparent);
232
+ }
233
+
234
+ [data-ox-scheme='light'] {
235
+ --primary: var(--color-primary-600);
236
+ --primary-fg: var(--fg-on-solid);
237
+ --primary-ink: var(--color-primary-700);
238
+ --primary-soft: var(--color-primary-100);
239
+ --primary-soft-fg: var(--color-primary-700);
240
+ --primary-outline: var(--color-primary-300);
241
+
242
+ --neutral: var(--color-neutral-700);
243
+ --neutral-fg: var(--fg-on-solid);
244
+ --neutral-ink: var(--color-neutral-700);
245
+ --neutral-soft: var(--color-neutral-100);
246
+ --neutral-soft-fg: var(--color-neutral-700);
247
+ --neutral-outline: var(--color-neutral-300);
248
+
249
+ --info: var(--color-info-700);
250
+ --info-fg: var(--fg-on-solid);
251
+ --info-ink: var(--color-info-700);
252
+ --info-soft: var(--color-info-100);
253
+ --info-soft-fg: var(--color-info-700);
254
+ --info-outline: var(--color-info-300);
255
+
256
+ --success: var(--color-success-700);
257
+ --success-fg: var(--fg-on-solid);
258
+ --success-ink: var(--color-success-800);
259
+ --success-soft: var(--color-success-100);
260
+ --success-soft-fg: var(--color-success-800);
261
+ --success-outline: var(--color-success-300);
262
+
263
+ --warning: var(--color-warning-700);
264
+ --warning-fg: var(--fg-on-solid);
265
+ --warning-ink: var(--color-warning-700);
266
+ --warning-soft: var(--color-warning-100);
267
+ --warning-soft-fg: var(--color-warning-700);
268
+ --warning-outline: var(--color-warning-300);
269
+
270
+ --danger: var(--color-danger-600);
271
+ --danger-fg: var(--fg-on-solid);
272
+ --danger-ink: var(--color-danger-700);
273
+ --danger-soft: var(--color-danger-100);
274
+ --danger-soft-fg: var(--color-danger-700);
275
+ --danger-outline: var(--color-danger-300);
276
+
277
+ --trace-log: var(--color-trace-log-700);
278
+ --trace-log-fg: var(--fg-on-solid);
279
+ --trace-log-ink: var(--color-trace-log-700);
280
+ --trace-log-soft: var(--color-trace-log-100);
281
+ --trace-log-soft-fg: var(--color-trace-log-700);
282
+ --trace-log-outline: var(--color-trace-log-300);
283
+
284
+ --debug-log: var(--color-debug-log-700);
285
+ --debug-log-fg: var(--fg-on-solid);
286
+ --debug-log-ink: var(--color-debug-log-700);
287
+ --debug-log-soft: var(--color-debug-log-100);
288
+ --debug-log-soft-fg: var(--color-debug-log-700);
289
+ --debug-log-outline: var(--color-debug-log-300);
290
+
291
+ --info-log: var(--color-info-log-700);
292
+ --info-log-fg: var(--fg-on-solid);
293
+ --info-log-ink: var(--color-info-log-800);
294
+ --info-log-soft: var(--color-info-log-100);
295
+ --info-log-soft-fg: var(--color-info-log-800);
296
+ --info-log-outline: var(--color-info-log-300);
297
+
298
+ --warn-log: var(--color-warn-log-700);
299
+ --warn-log-fg: var(--fg-on-solid);
300
+ --warn-log-ink: var(--color-warn-log-700);
301
+ --warn-log-soft: var(--color-warn-log-100);
302
+ --warn-log-soft-fg: var(--color-warn-log-700);
303
+ --warn-log-outline: var(--color-warn-log-300);
304
+
305
+ --error-log: var(--color-error-log-600);
306
+ --error-log-fg: var(--fg-on-solid);
307
+ --error-log-ink: var(--color-error-log-700);
308
+ --error-log-soft: var(--color-error-log-100);
309
+ --error-log-soft-fg: var(--color-error-log-700);
310
+ --error-log-outline: var(--color-error-log-300);
311
+
312
+ --fatal-log: var(--color-fatal-log-600);
313
+ --fatal-log-fg: var(--fg-on-solid);
314
+ --fatal-log-ink: var(--color-fatal-log-700);
315
+ --fatal-log-soft: var(--color-fatal-log-100);
316
+ --fatal-log-soft-fg: var(--color-fatal-log-700);
317
+ --fatal-log-outline: var(--color-fatal-log-300);
318
+
319
+ --slate: var(--color-slate-700);
320
+ --slate-fg: var(--fg-on-solid);
321
+ --slate-ink: var(--color-slate-700);
322
+ --slate-soft: var(--color-slate-100);
323
+ --slate-soft-fg: var(--color-slate-700);
324
+ --slate-outline: var(--color-slate-300);
325
+
326
+ --gray: var(--color-gray-700);
327
+ --gray-fg: var(--fg-on-solid);
328
+ --gray-ink: var(--color-gray-700);
329
+ --gray-soft: var(--color-gray-100);
330
+ --gray-soft-fg: var(--color-gray-700);
331
+ --gray-outline: var(--color-gray-300);
332
+
333
+ --zinc: var(--color-zinc-700);
334
+ --zinc-fg: var(--fg-on-solid);
335
+ --zinc-ink: var(--color-zinc-700);
336
+ --zinc-soft: var(--color-zinc-100);
337
+ --zinc-soft-fg: var(--color-zinc-700);
338
+ --zinc-outline: var(--color-zinc-300);
339
+
340
+ --stone: var(--color-stone-700);
341
+ --stone-fg: var(--fg-on-solid);
342
+ --stone-ink: var(--color-stone-700);
343
+ --stone-soft: var(--color-stone-100);
344
+ --stone-soft-fg: var(--color-stone-700);
345
+ --stone-outline: var(--color-stone-300);
346
+
347
+ --red: var(--color-red-600);
348
+ --red-fg: var(--fg-on-solid);
349
+ --red-ink: var(--color-red-700);
350
+ --red-soft: var(--color-red-100);
351
+ --red-soft-fg: var(--color-red-700);
352
+ --red-outline: var(--color-red-300);
353
+
354
+ --sky: var(--color-sky-700);
355
+ --sky-fg: var(--fg-on-solid);
356
+ --sky-ink: var(--color-sky-700);
357
+ --sky-soft: var(--color-sky-100);
358
+ --sky-soft-fg: var(--color-sky-700);
359
+ --sky-outline: var(--color-sky-300);
360
+
361
+ --blue: var(--color-blue-700);
362
+ --blue-fg: var(--fg-on-solid);
363
+ --blue-ink: var(--color-blue-700);
364
+ --blue-soft: var(--color-blue-100);
365
+ --blue-soft-fg: var(--color-blue-700);
366
+ --blue-outline: var(--color-blue-300);
367
+
368
+ --indigo: var(--color-indigo-700);
369
+ --indigo-fg: var(--fg-on-solid);
370
+ --indigo-ink: var(--color-indigo-700);
371
+ --indigo-soft: var(--color-indigo-100);
372
+ --indigo-soft-fg: var(--color-indigo-700);
373
+ --indigo-outline: var(--color-indigo-300);
374
+
375
+ --violet: var(--color-violet-600);
376
+ --violet-fg: var(--fg-on-solid);
377
+ --violet-ink: var(--color-violet-700);
378
+ --violet-soft: var(--color-violet-100);
379
+ --violet-soft-fg: var(--color-violet-700);
380
+ --violet-outline: var(--color-violet-300);
381
+
382
+ --purple: var(--color-purple-600);
383
+ --purple-fg: var(--fg-on-solid);
384
+ --purple-ink: var(--color-purple-700);
385
+ --purple-soft: var(--color-purple-100);
386
+ --purple-soft-fg: var(--color-purple-700);
387
+ --purple-outline: var(--color-purple-300);
388
+
389
+ --fuchsia: var(--color-fuchsia-600);
390
+ --fuchsia-fg: var(--fg-on-solid);
391
+ --fuchsia-ink: var(--color-fuchsia-700);
392
+ --fuchsia-soft: var(--color-fuchsia-100);
393
+ --fuchsia-soft-fg: var(--color-fuchsia-700);
394
+ --fuchsia-outline: var(--color-fuchsia-300);
395
+
396
+ --pink: var(--color-pink-600);
397
+ --pink-fg: var(--fg-on-solid);
398
+ --pink-ink: var(--color-pink-700);
399
+ --pink-soft: var(--color-pink-100);
400
+ --pink-soft-fg: var(--color-pink-700);
401
+ --pink-outline: var(--color-pink-300);
402
+
403
+ --rose: var(--color-rose-600);
404
+ --rose-fg: var(--fg-on-solid);
405
+ --rose-ink: var(--color-rose-700);
406
+ --rose-soft: var(--color-rose-100);
407
+ --rose-soft-fg: var(--color-rose-700);
408
+ --rose-outline: var(--color-rose-300);
409
+
410
+ --orange: var(--color-orange-700);
411
+ --orange-fg: var(--fg-on-solid);
412
+ --orange-ink: var(--color-orange-700);
413
+ --orange-soft: var(--color-orange-100);
414
+ --orange-soft-fg: var(--color-orange-700);
415
+ --orange-outline: var(--color-orange-300);
416
+
417
+ --amber: var(--color-amber-700);
418
+ --amber-fg: var(--fg-on-solid);
419
+ --amber-ink: var(--color-amber-700);
420
+ --amber-soft: var(--color-amber-100);
421
+ --amber-soft-fg: var(--color-amber-700);
422
+ --amber-outline: var(--color-amber-300);
423
+
424
+ --yellow: var(--color-yellow-700);
425
+ --yellow-fg: var(--fg-on-solid);
426
+ --yellow-ink: var(--color-yellow-700);
427
+ --yellow-soft: var(--color-yellow-100);
428
+ --yellow-soft-fg: var(--color-yellow-700);
429
+ --yellow-outline: var(--color-yellow-300);
430
+
431
+ --lime: var(--color-lime-700);
432
+ --lime-fg: var(--fg-on-solid);
433
+ --lime-ink: var(--color-lime-700);
434
+ --lime-soft: var(--color-lime-100);
435
+ --lime-soft-fg: var(--color-lime-700);
436
+ --lime-outline: var(--color-lime-300);
437
+
438
+ --green: var(--color-green-700);
439
+ --green-fg: var(--fg-on-solid);
440
+ --green-ink: var(--color-green-800);
441
+ --green-soft: var(--color-green-100);
442
+ --green-soft-fg: var(--color-green-800);
443
+ --green-outline: var(--color-green-300);
444
+
445
+ --emerald: var(--color-emerald-700);
446
+ --emerald-fg: var(--fg-on-solid);
447
+ --emerald-ink: var(--color-emerald-800);
448
+ --emerald-soft: var(--color-emerald-100);
449
+ --emerald-soft-fg: var(--color-emerald-800);
450
+ --emerald-outline: var(--color-emerald-300);
451
+
452
+ --teal: var(--color-teal-700);
453
+ --teal-fg: var(--fg-on-solid);
454
+ --teal-ink: var(--color-teal-800);
455
+ --teal-soft: var(--color-teal-100);
456
+ --teal-soft-fg: var(--color-teal-800);
457
+ --teal-outline: var(--color-teal-300);
458
+
459
+ --cyan: var(--color-cyan-700);
460
+ --cyan-fg: var(--fg-on-solid);
461
+ --cyan-ink: var(--color-cyan-800);
462
+ --cyan-soft: var(--color-cyan-100);
463
+ --cyan-soft-fg: var(--color-cyan-800);
464
+ --cyan-outline: var(--color-cyan-300);
465
+ }
466
+
467
+ [data-ox-tone='primary'] {
468
+ --tone: var(--primary);
469
+ --tone-fg: var(--primary-fg);
470
+ --tone-ink: var(--primary-ink);
471
+ --tone-soft: var(--primary-soft);
472
+ --tone-soft-fg: var(--primary-soft-fg);
473
+ --tone-outline: var(--primary-outline);
474
+ }
475
+ [data-ox-tone='neutral'] {
476
+ --tone: var(--neutral);
477
+ --tone-fg: var(--neutral-fg);
478
+ --tone-ink: var(--neutral-ink);
479
+ --tone-soft: var(--neutral-soft);
480
+ --tone-soft-fg: var(--neutral-soft-fg);
481
+ --tone-outline: var(--neutral-outline);
482
+ }
483
+ [data-ox-tone='info'] {
484
+ --tone: var(--info);
485
+ --tone-fg: var(--info-fg);
486
+ --tone-ink: var(--info-ink);
487
+ --tone-soft: var(--info-soft);
488
+ --tone-soft-fg: var(--info-soft-fg);
489
+ --tone-outline: var(--info-outline);
490
+ }
491
+ [data-ox-tone='success'] {
492
+ --tone: var(--success);
493
+ --tone-fg: var(--success-fg);
494
+ --tone-ink: var(--success-ink);
495
+ --tone-soft: var(--success-soft);
496
+ --tone-soft-fg: var(--success-soft-fg);
497
+ --tone-outline: var(--success-outline);
498
+ }
499
+ [data-ox-tone='warning'] {
500
+ --tone: var(--warning);
501
+ --tone-fg: var(--warning-fg);
502
+ --tone-ink: var(--warning-ink);
503
+ --tone-soft: var(--warning-soft);
504
+ --tone-soft-fg: var(--warning-soft-fg);
505
+ --tone-outline: var(--warning-outline);
506
+ }
507
+ [data-ox-tone='danger'] {
508
+ --tone: var(--danger);
509
+ --tone-fg: var(--danger-fg);
510
+ --tone-ink: var(--danger-ink);
511
+ --tone-soft: var(--danger-soft);
512
+ --tone-soft-fg: var(--danger-soft-fg);
513
+ --tone-outline: var(--danger-outline);
514
+ }
515
+ [data-ox-tone='trace-log'] {
516
+ --tone: var(--trace-log);
517
+ --tone-fg: var(--trace-log-fg);
518
+ --tone-ink: var(--trace-log-ink);
519
+ --tone-soft: var(--trace-log-soft);
520
+ --tone-soft-fg: var(--trace-log-soft-fg);
521
+ --tone-outline: var(--trace-log-outline);
522
+ }
523
+ [data-ox-tone='debug-log'] {
524
+ --tone: var(--debug-log);
525
+ --tone-fg: var(--debug-log-fg);
526
+ --tone-ink: var(--debug-log-ink);
527
+ --tone-soft: var(--debug-log-soft);
528
+ --tone-soft-fg: var(--debug-log-soft-fg);
529
+ --tone-outline: var(--debug-log-outline);
530
+ }
531
+ [data-ox-tone='info-log'] {
532
+ --tone: var(--info-log);
533
+ --tone-fg: var(--info-log-fg);
534
+ --tone-ink: var(--info-log-ink);
535
+ --tone-soft: var(--info-log-soft);
536
+ --tone-soft-fg: var(--info-log-soft-fg);
537
+ --tone-outline: var(--info-log-outline);
538
+ }
539
+ [data-ox-tone='warn-log'] {
540
+ --tone: var(--warn-log);
541
+ --tone-fg: var(--warn-log-fg);
542
+ --tone-ink: var(--warn-log-ink);
543
+ --tone-soft: var(--warn-log-soft);
544
+ --tone-soft-fg: var(--warn-log-soft-fg);
545
+ --tone-outline: var(--warn-log-outline);
546
+ }
547
+ [data-ox-tone='error-log'] {
548
+ --tone: var(--error-log);
549
+ --tone-fg: var(--error-log-fg);
550
+ --tone-ink: var(--error-log-ink);
551
+ --tone-soft: var(--error-log-soft);
552
+ --tone-soft-fg: var(--error-log-soft-fg);
553
+ --tone-outline: var(--error-log-outline);
554
+ }
555
+ [data-ox-tone='fatal-log'] {
556
+ --tone: var(--fatal-log);
557
+ --tone-fg: var(--fatal-log-fg);
558
+ --tone-ink: var(--fatal-log-ink);
559
+ --tone-soft: var(--fatal-log-soft);
560
+ --tone-soft-fg: var(--fatal-log-soft-fg);
561
+ --tone-outline: var(--fatal-log-outline);
562
+ }
563
+ [data-ox-tone='slate'] {
564
+ --tone: var(--slate);
565
+ --tone-fg: var(--slate-fg);
566
+ --tone-ink: var(--slate-ink);
567
+ --tone-soft: var(--slate-soft);
568
+ --tone-soft-fg: var(--slate-soft-fg);
569
+ --tone-outline: var(--slate-outline);
570
+ }
571
+ [data-ox-tone='gray'] {
572
+ --tone: var(--gray);
573
+ --tone-fg: var(--gray-fg);
574
+ --tone-ink: var(--gray-ink);
575
+ --tone-soft: var(--gray-soft);
576
+ --tone-soft-fg: var(--gray-soft-fg);
577
+ --tone-outline: var(--gray-outline);
578
+ }
579
+ [data-ox-tone='zinc'] {
580
+ --tone: var(--zinc);
581
+ --tone-fg: var(--zinc-fg);
582
+ --tone-ink: var(--zinc-ink);
583
+ --tone-soft: var(--zinc-soft);
584
+ --tone-soft-fg: var(--zinc-soft-fg);
585
+ --tone-outline: var(--zinc-outline);
586
+ }
587
+ [data-ox-tone='stone'] {
588
+ --tone: var(--stone);
589
+ --tone-fg: var(--stone-fg);
590
+ --tone-ink: var(--stone-ink);
591
+ --tone-soft: var(--stone-soft);
592
+ --tone-soft-fg: var(--stone-soft-fg);
593
+ --tone-outline: var(--stone-outline);
594
+ }
595
+ [data-ox-tone='red'] {
596
+ --tone: var(--red);
597
+ --tone-fg: var(--red-fg);
598
+ --tone-ink: var(--red-ink);
599
+ --tone-soft: var(--red-soft);
600
+ --tone-soft-fg: var(--red-soft-fg);
601
+ --tone-outline: var(--red-outline);
602
+ }
603
+ [data-ox-tone='sky'] {
604
+ --tone: var(--sky);
605
+ --tone-fg: var(--sky-fg);
606
+ --tone-ink: var(--sky-ink);
607
+ --tone-soft: var(--sky-soft);
608
+ --tone-soft-fg: var(--sky-soft-fg);
609
+ --tone-outline: var(--sky-outline);
610
+ }
611
+ [data-ox-tone='blue'] {
612
+ --tone: var(--blue);
613
+ --tone-fg: var(--blue-fg);
614
+ --tone-ink: var(--blue-ink);
615
+ --tone-soft: var(--blue-soft);
616
+ --tone-soft-fg: var(--blue-soft-fg);
617
+ --tone-outline: var(--blue-outline);
618
+ }
619
+ [data-ox-tone='indigo'] {
620
+ --tone: var(--indigo);
621
+ --tone-fg: var(--indigo-fg);
622
+ --tone-ink: var(--indigo-ink);
623
+ --tone-soft: var(--indigo-soft);
624
+ --tone-soft-fg: var(--indigo-soft-fg);
625
+ --tone-outline: var(--indigo-outline);
626
+ }
627
+ [data-ox-tone='violet'] {
628
+ --tone: var(--violet);
629
+ --tone-fg: var(--violet-fg);
630
+ --tone-ink: var(--violet-ink);
631
+ --tone-soft: var(--violet-soft);
632
+ --tone-soft-fg: var(--violet-soft-fg);
633
+ --tone-outline: var(--violet-outline);
634
+ }
635
+ [data-ox-tone='purple'] {
636
+ --tone: var(--purple);
637
+ --tone-fg: var(--purple-fg);
638
+ --tone-ink: var(--purple-ink);
639
+ --tone-soft: var(--purple-soft);
640
+ --tone-soft-fg: var(--purple-soft-fg);
641
+ --tone-outline: var(--purple-outline);
642
+ }
643
+ [data-ox-tone='fuchsia'] {
644
+ --tone: var(--fuchsia);
645
+ --tone-fg: var(--fuchsia-fg);
646
+ --tone-ink: var(--fuchsia-ink);
647
+ --tone-soft: var(--fuchsia-soft);
648
+ --tone-soft-fg: var(--fuchsia-soft-fg);
649
+ --tone-outline: var(--fuchsia-outline);
650
+ }
651
+ [data-ox-tone='pink'] {
652
+ --tone: var(--pink);
653
+ --tone-fg: var(--pink-fg);
654
+ --tone-ink: var(--pink-ink);
655
+ --tone-soft: var(--pink-soft);
656
+ --tone-soft-fg: var(--pink-soft-fg);
657
+ --tone-outline: var(--pink-outline);
658
+ }
659
+ [data-ox-tone='rose'] {
660
+ --tone: var(--rose);
661
+ --tone-fg: var(--rose-fg);
662
+ --tone-ink: var(--rose-ink);
663
+ --tone-soft: var(--rose-soft);
664
+ --tone-soft-fg: var(--rose-soft-fg);
665
+ --tone-outline: var(--rose-outline);
666
+ }
667
+ [data-ox-tone='orange'] {
668
+ --tone: var(--orange);
669
+ --tone-fg: var(--orange-fg);
670
+ --tone-ink: var(--orange-ink);
671
+ --tone-soft: var(--orange-soft);
672
+ --tone-soft-fg: var(--orange-soft-fg);
673
+ --tone-outline: var(--orange-outline);
674
+ }
675
+ [data-ox-tone='amber'] {
676
+ --tone: var(--amber);
677
+ --tone-fg: var(--amber-fg);
678
+ --tone-ink: var(--amber-ink);
679
+ --tone-soft: var(--amber-soft);
680
+ --tone-soft-fg: var(--amber-soft-fg);
681
+ --tone-outline: var(--amber-outline);
682
+ }
683
+ [data-ox-tone='yellow'] {
684
+ --tone: var(--yellow);
685
+ --tone-fg: var(--yellow-fg);
686
+ --tone-ink: var(--yellow-ink);
687
+ --tone-soft: var(--yellow-soft);
688
+ --tone-soft-fg: var(--yellow-soft-fg);
689
+ --tone-outline: var(--yellow-outline);
690
+ }
691
+ [data-ox-tone='lime'] {
692
+ --tone: var(--lime);
693
+ --tone-fg: var(--lime-fg);
694
+ --tone-ink: var(--lime-ink);
695
+ --tone-soft: var(--lime-soft);
696
+ --tone-soft-fg: var(--lime-soft-fg);
697
+ --tone-outline: var(--lime-outline);
698
+ }
699
+ [data-ox-tone='green'] {
700
+ --tone: var(--green);
701
+ --tone-fg: var(--green-fg);
702
+ --tone-ink: var(--green-ink);
703
+ --tone-soft: var(--green-soft);
704
+ --tone-soft-fg: var(--green-soft-fg);
705
+ --tone-outline: var(--green-outline);
706
+ }
707
+ [data-ox-tone='emerald'] {
708
+ --tone: var(--emerald);
709
+ --tone-fg: var(--emerald-fg);
710
+ --tone-ink: var(--emerald-ink);
711
+ --tone-soft: var(--emerald-soft);
712
+ --tone-soft-fg: var(--emerald-soft-fg);
713
+ --tone-outline: var(--emerald-outline);
714
+ }
715
+ [data-ox-tone='teal'] {
716
+ --tone: var(--teal);
717
+ --tone-fg: var(--teal-fg);
718
+ --tone-ink: var(--teal-ink);
719
+ --tone-soft: var(--teal-soft);
720
+ --tone-soft-fg: var(--teal-soft-fg);
721
+ --tone-outline: var(--teal-outline);
722
+ }
723
+ [data-ox-tone='cyan'] {
724
+ --tone: var(--cyan);
725
+ --tone-fg: var(--cyan-fg);
726
+ --tone-ink: var(--cyan-ink);
727
+ --tone-soft: var(--cyan-soft);
728
+ --tone-soft-fg: var(--cyan-soft-fg);
729
+ --tone-outline: var(--cyan-outline);
730
+ }