@fusion.dev/helix-styles 0.140.0 → 0.142.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/dist/base.css +2 -2
- package/dist/primitives.css +18 -1
- package/dist/tokens.css +107 -66
- package/dist/tokens.json +50 -40
- package/package.json +1 -1
package/dist/base.css
CHANGED
|
@@ -281,7 +281,7 @@ helix-text[tone="warning"]:is([emphasis="muted"], [emphasis="subtle"]) {
|
|
|
281
281
|
--_button-edge: var(--helix-color-primary);
|
|
282
282
|
--_button-fill: var(--helix-color-primary-surface);
|
|
283
283
|
--_button-fill-hover: var(--helix-color-primary-surface-hover);
|
|
284
|
-
--_button-on-tone: var(--helix-color-foreground-on-
|
|
284
|
+
--_button-on-tone: var(--helix-color-foreground-on-primary);
|
|
285
285
|
--_button-tone: var(--helix-color-primary);
|
|
286
286
|
--_button-tone-hover: var(--helix-color-primary-hover);
|
|
287
287
|
}
|
|
@@ -297,7 +297,7 @@ helix-text[tone="warning"]:is([emphasis="muted"], [emphasis="subtle"]) {
|
|
|
297
297
|
--_button-edge: var(--helix-color-danger);
|
|
298
298
|
--_button-fill: var(--helix-color-danger-surface);
|
|
299
299
|
--_button-fill-hover: var(--helix-color-danger-surface-hover);
|
|
300
|
-
--_button-on-tone: var(--helix-color-foreground-on-
|
|
300
|
+
--_button-on-tone: var(--helix-color-foreground-on-status);
|
|
301
301
|
--_button-tone: var(--helix-color-danger);
|
|
302
302
|
--_button-tone-hover: color-mix(
|
|
303
303
|
in oklab,
|
package/dist/primitives.css
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
/* primitives.css from @fusion.dev/helix-styles. The source, with the reasoning in it, is in the repository. */
|
|
2
2
|
:root,
|
|
3
3
|
[data-helix-theme] {
|
|
4
|
-
--_helix-
|
|
4
|
+
--_helix-unset: initial;
|
|
5
|
+
--_helix-seed-brand: var(--helix-seed-brand, var(--_helix-unset));
|
|
6
|
+
--_helix-series-origin: var(--helix-seed-brand, oklch(0.539 0.19 258));
|
|
5
7
|
--helix-seed-accent-hue: 0;
|
|
6
8
|
--_helix-accent-lightness: var(--helix-seed-accent-lightness, l);
|
|
7
9
|
--_helix-seed-accent: var(
|
|
@@ -48,12 +50,27 @@
|
|
|
48
50
|
--_helix-brand-200: oklch(from var(--_helix-seed-brand) calc(l + 0.23) c h);
|
|
49
51
|
--_helix-brand-50: oklch(from var(--_helix-seed-brand) 0.95 calc(c * 0.25) h);
|
|
50
52
|
--_helix-brand-900: oklch(from var(--_helix-seed-brand) 0.28 calc(c * 0.5) h);
|
|
53
|
+
--_helix-brand-quiet-500: oklch(from var(--_helix-brand-500) l calc(c * 0.5) h);
|
|
54
|
+
--_helix-brand-quiet-400: oklch(from var(--_helix-brand-400) l calc(c * 0.5) h);
|
|
55
|
+
--_helix-brand-on: oklch(from var(--_helix-seed-brand) 1 0 0);
|
|
56
|
+
--_helix-ink-500: var(--_helix-neutral-800);
|
|
57
|
+
--_helix-ink-600: oklch(from var(--_helix-ink-500) calc(l - 0.05) c h);
|
|
58
|
+
--_helix-ink-700: oklch(from var(--_helix-ink-500) calc(l - 0.1) c h);
|
|
59
|
+
--_helix-ink-400: var(--_helix-neutral-300);
|
|
60
|
+
--_helix-ink-450: oklch(from var(--_helix-ink-400) calc(l - 0.05) c h);
|
|
61
|
+
--_helix-ink-300: oklch(from var(--_helix-ink-400) calc(l + 0.05) c h);
|
|
62
|
+
--_helix-ink-200: var(--_helix-neutral-0);
|
|
63
|
+
--_helix-ink-50: oklch(0.95 var(--_helix-neutral-cast));
|
|
64
|
+
--_helix-ink-900: oklch(0.28 var(--_helix-neutral-cast));
|
|
51
65
|
--_helix-accent-500: var(--_helix-seed-accent);
|
|
52
66
|
--_helix-accent-600: oklch(from var(--_helix-seed-accent) calc(l - 0.05) c h);
|
|
53
67
|
--_helix-accent-700: oklch(from var(--_helix-seed-accent) calc(l - 0.1) c h);
|
|
54
68
|
--_helix-accent-400: oklch(from var(--_helix-seed-accent) calc(l + 0.13) c h);
|
|
55
69
|
--_helix-accent-50: oklch(from var(--_helix-seed-accent) 0.95 calc(c * 0.25) h);
|
|
56
70
|
--_helix-accent-900: oklch(from var(--_helix-seed-accent) 0.28 calc(c * 0.5) h);
|
|
71
|
+
--_helix-accent-on: oklch(from var(--_helix-seed-accent) 1 0 0);
|
|
72
|
+
--_helix-accent-quiet-500: oklch(from var(--_helix-accent-500) l calc(c * 0.5) h);
|
|
73
|
+
--_helix-accent-quiet-400: oklch(from var(--_helix-accent-400) l calc(c * 0.5) h);
|
|
57
74
|
--_helix-info-500: oklch(0.58 0.16 245);
|
|
58
75
|
--_helix-success-500: oklch(0.58 0.15 155);
|
|
59
76
|
--_helix-warning-500: oklch(0.7 0.185 75);
|
package/dist/tokens.css
CHANGED
|
@@ -47,7 +47,9 @@
|
|
|
47
47
|
--helix-color-foreground: light-dark(var(--_helix-neutral-1000), var(--_helix-neutral-0));
|
|
48
48
|
--helix-color-foreground-muted: light-dark(var(--_helix-neutral-600), var(--_helix-neutral-400));
|
|
49
49
|
--helix-color-foreground-subtle: light-dark(var(--_helix-neutral-550), var(--_helix-neutral-450));
|
|
50
|
-
--helix-color-foreground-on-
|
|
50
|
+
--helix-color-foreground-on-primary: var(--_helix-brand-on, var(--helix-color-background));
|
|
51
|
+
--helix-color-foreground-on-accent: var(--_helix-accent-on, var(--helix-color-background));
|
|
52
|
+
--helix-color-foreground-on-status: var(--_helix-neutral-0);
|
|
51
53
|
--helix-color-surface-inverse: light-dark(var(--_helix-neutral-900), var(--_helix-neutral-100));
|
|
52
54
|
--helix-color-foreground-inverse: light-dark(var(--_helix-neutral-50), var(--_helix-neutral-900));
|
|
53
55
|
--helix-color-surface-media: light-dark(var(--_helix-neutral-1000), var(--_helix-neutral-1000));
|
|
@@ -56,20 +58,59 @@
|
|
|
56
58
|
color-mix(in oklab, var(--_helix-neutral-300) 60%, var(--_helix-neutral-200)),
|
|
57
59
|
color-mix(in oklab, var(--_helix-neutral-700) 30%, var(--_helix-neutral-800))
|
|
58
60
|
);
|
|
59
|
-
--helix-color-primary: light-dark(
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
--helix-color-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
--helix-color-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
61
|
+
--helix-color-primary: light-dark(
|
|
62
|
+
var(--_helix-brand-500, var(--_helix-ink-500)),
|
|
63
|
+
var(--_helix-brand-400, var(--_helix-ink-400))
|
|
64
|
+
);
|
|
65
|
+
--helix-color-primary-hover: light-dark(
|
|
66
|
+
var(--_helix-brand-600, var(--_helix-ink-600)),
|
|
67
|
+
var(--_helix-brand-300, var(--_helix-ink-300))
|
|
68
|
+
);
|
|
69
|
+
--helix-color-primary-active: light-dark(
|
|
70
|
+
var(--_helix-brand-700, var(--_helix-ink-700)),
|
|
71
|
+
var(--_helix-brand-200, var(--_helix-ink-200))
|
|
72
|
+
);
|
|
73
|
+
--helix-color-primary-subtle: light-dark(
|
|
74
|
+
var(--_helix-brand-50, var(--_helix-ink-50)),
|
|
75
|
+
var(--_helix-brand-900, var(--_helix-ink-900))
|
|
76
|
+
);
|
|
77
|
+
--helix-color-accent: light-dark(
|
|
78
|
+
var(--_helix-accent-500, var(--_helix-ink-500)),
|
|
79
|
+
var(--_helix-accent-400, var(--_helix-ink-400))
|
|
80
|
+
);
|
|
81
|
+
--helix-color-accent-hover: light-dark(
|
|
82
|
+
var(--_helix-accent-600, var(--_helix-ink-600)),
|
|
83
|
+
var(--_helix-accent-600, var(--_helix-ink-300))
|
|
84
|
+
);
|
|
85
|
+
--helix-color-accent-active: light-dark(
|
|
86
|
+
var(--_helix-accent-700, var(--_helix-ink-700)),
|
|
87
|
+
var(--_helix-accent-700, var(--_helix-ink-200))
|
|
88
|
+
);
|
|
89
|
+
--helix-color-accent-subtle: light-dark(
|
|
90
|
+
var(--_helix-accent-50, var(--_helix-ink-50)),
|
|
91
|
+
var(--_helix-accent-900, var(--_helix-ink-900))
|
|
92
|
+
);
|
|
93
|
+
--helix-color-accent-surface: light-dark(
|
|
94
|
+
var(--_helix-accent-600, var(--_helix-ink-500)),
|
|
95
|
+
var(--_helix-accent-600, var(--_helix-ink-400))
|
|
96
|
+
);
|
|
97
|
+
--helix-color-accent-surface-hover: light-dark(
|
|
98
|
+
var(--_helix-accent-700, var(--_helix-ink-600)),
|
|
99
|
+
var(--_helix-accent-700, var(--_helix-ink-450))
|
|
100
|
+
);
|
|
101
|
+
--helix-color-primary-surface: light-dark(
|
|
102
|
+
var(--_helix-brand-600, var(--_helix-ink-500)),
|
|
103
|
+
var(--_helix-brand-600, var(--_helix-ink-400))
|
|
104
|
+
);
|
|
105
|
+
--helix-color-primary-surface-hover: light-dark(
|
|
106
|
+
var(--_helix-brand-700, var(--_helix-ink-600)),
|
|
107
|
+
var(--_helix-brand-700, var(--_helix-ink-450))
|
|
108
|
+
);
|
|
71
109
|
--helix-color-focus-ring: var(--helix-color-primary);
|
|
72
|
-
--helix-color-brand-mark: light-dark(
|
|
110
|
+
--helix-color-brand-mark: light-dark(
|
|
111
|
+
var(--_helix-brand-500, var(--_helix-ink-500)),
|
|
112
|
+
var(--_helix-brand-400, var(--_helix-ink-400))
|
|
113
|
+
);
|
|
73
114
|
--helix-color-syntax-callable: light-dark(
|
|
74
115
|
var(--_helix-syntax-callable-light),
|
|
75
116
|
var(--_helix-syntax-callable-dark)
|
|
@@ -104,241 +145,241 @@
|
|
|
104
145
|
);
|
|
105
146
|
--helix-color-series-1: light-dark(
|
|
106
147
|
oklch(
|
|
107
|
-
from var(--_helix-
|
|
148
|
+
from var(--_helix-series-origin) 0.595 calc(0.221 * var(--_helix-seed-chroma-scale))
|
|
108
149
|
calc(h + var(--_helix-series-hue-1))
|
|
109
150
|
),
|
|
110
151
|
oklch(
|
|
111
|
-
from var(--_helix-
|
|
152
|
+
from var(--_helix-series-origin) 0.62 calc(0.206 * var(--_helix-seed-chroma-scale))
|
|
112
153
|
calc(h + var(--_helix-series-hue-1))
|
|
113
154
|
)
|
|
114
155
|
);
|
|
115
156
|
--helix-color-series-2: light-dark(
|
|
116
157
|
oklch(
|
|
117
|
-
from var(--_helix-
|
|
158
|
+
from var(--_helix-series-origin) 0.645 calc(0.238 * var(--_helix-seed-chroma-scale))
|
|
118
159
|
calc(h + var(--_helix-series-hue-2))
|
|
119
160
|
),
|
|
120
161
|
oklch(
|
|
121
|
-
from var(--_helix-
|
|
162
|
+
from var(--_helix-series-origin) 0.645 calc(0.238 * var(--_helix-seed-chroma-scale))
|
|
122
163
|
calc(h + var(--_helix-series-hue-2))
|
|
123
164
|
)
|
|
124
165
|
);
|
|
125
166
|
--helix-color-series-3: light-dark(
|
|
126
167
|
oklch(
|
|
127
|
-
from var(--_helix-
|
|
168
|
+
from var(--_helix-series-origin) 0.625 calc(0.126 * var(--_helix-seed-chroma-scale))
|
|
128
169
|
calc(h + var(--_helix-series-hue-3))
|
|
129
170
|
),
|
|
130
171
|
oklch(
|
|
131
|
-
from var(--_helix-
|
|
172
|
+
from var(--_helix-series-origin) 0.885 calc(0.179 * var(--_helix-seed-chroma-scale))
|
|
132
173
|
calc(h + var(--_helix-series-hue-3))
|
|
133
174
|
)
|
|
134
175
|
);
|
|
135
176
|
--helix-color-series-4: light-dark(
|
|
136
177
|
oklch(
|
|
137
|
-
from var(--_helix-
|
|
178
|
+
from var(--_helix-series-origin) 0.565 calc(0.295 * var(--_helix-seed-chroma-scale))
|
|
138
179
|
calc(h + var(--_helix-series-hue-4))
|
|
139
180
|
),
|
|
140
181
|
oklch(
|
|
141
|
-
from var(--_helix-
|
|
182
|
+
from var(--_helix-series-origin) 0.62 calc(0.252 * var(--_helix-seed-chroma-scale))
|
|
142
183
|
calc(h + var(--_helix-series-hue-4))
|
|
143
184
|
)
|
|
144
185
|
);
|
|
145
186
|
--helix-color-series-5: light-dark(
|
|
146
187
|
oklch(
|
|
147
|
-
from var(--_helix-
|
|
188
|
+
from var(--_helix-series-origin) 0.64 calc(0.133 * var(--_helix-seed-chroma-scale))
|
|
148
189
|
calc(h + var(--_helix-series-hue-5))
|
|
149
190
|
),
|
|
150
191
|
oklch(
|
|
151
|
-
from var(--_helix-
|
|
192
|
+
from var(--_helix-series-origin) 0.815 calc(0.17 * var(--_helix-seed-chroma-scale))
|
|
152
193
|
calc(h + var(--_helix-series-hue-5))
|
|
153
194
|
)
|
|
154
195
|
);
|
|
155
196
|
--helix-color-series-6: light-dark(
|
|
156
197
|
oklch(
|
|
157
|
-
from var(--_helix-
|
|
198
|
+
from var(--_helix-series-origin) 0.63 calc(0.11 * var(--_helix-seed-chroma-scale))
|
|
158
199
|
calc(h + var(--_helix-series-hue-6))
|
|
159
200
|
),
|
|
160
201
|
oklch(
|
|
161
|
-
from var(--_helix-
|
|
202
|
+
from var(--_helix-series-origin) 0.825 calc(0.144 * var(--_helix-seed-chroma-scale))
|
|
162
203
|
calc(h + var(--_helix-series-hue-6))
|
|
163
204
|
)
|
|
164
205
|
);
|
|
165
206
|
--helix-color-series-7: light-dark(
|
|
166
207
|
oklch(
|
|
167
|
-
from var(--_helix-
|
|
208
|
+
from var(--_helix-series-origin) 0.66 calc(0.277 * var(--_helix-seed-chroma-scale))
|
|
168
209
|
calc(h + var(--_helix-series-hue-7))
|
|
169
210
|
),
|
|
170
211
|
oklch(
|
|
171
|
-
from var(--_helix-
|
|
212
|
+
from var(--_helix-series-origin) 0.66 calc(0.277 * var(--_helix-seed-chroma-scale))
|
|
172
213
|
calc(h + var(--_helix-series-hue-7))
|
|
173
214
|
)
|
|
174
215
|
);
|
|
175
216
|
--helix-color-series-8: light-dark(
|
|
176
217
|
oklch(
|
|
177
|
-
from var(--_helix-
|
|
218
|
+
from var(--_helix-series-origin) 0.63 calc(0.154 * var(--_helix-seed-chroma-scale))
|
|
178
219
|
calc(h + var(--_helix-series-hue-8))
|
|
179
220
|
),
|
|
180
221
|
oklch(
|
|
181
|
-
from var(--_helix-
|
|
222
|
+
from var(--_helix-series-origin) 0.895 calc(0.219 * var(--_helix-seed-chroma-scale))
|
|
182
223
|
calc(h + var(--_helix-series-hue-8))
|
|
183
224
|
)
|
|
184
225
|
);
|
|
185
226
|
--helix-color-series-9: light-dark(
|
|
186
227
|
oklch(
|
|
187
|
-
from var(--_helix-
|
|
228
|
+
from var(--_helix-series-origin) 0.52 calc(0.145 * var(--_helix-seed-chroma-scale))
|
|
188
229
|
calc(h + var(--_helix-series-hue-1))
|
|
189
230
|
),
|
|
190
231
|
oklch(
|
|
191
|
-
from var(--_helix-
|
|
232
|
+
from var(--_helix-series-origin) 0.7 calc(0.135 * var(--_helix-seed-chroma-scale))
|
|
192
233
|
calc(h + var(--_helix-series-hue-1))
|
|
193
234
|
)
|
|
194
235
|
);
|
|
195
236
|
--helix-color-series-10: light-dark(
|
|
196
237
|
oklch(
|
|
197
|
-
from var(--_helix-
|
|
238
|
+
from var(--_helix-series-origin) 0.6 calc(0.145 * var(--_helix-seed-chroma-scale))
|
|
198
239
|
calc(h + var(--_helix-series-hue-2))
|
|
199
240
|
),
|
|
200
241
|
oklch(
|
|
201
|
-
from var(--_helix-
|
|
242
|
+
from var(--_helix-series-origin) 0.78 calc(0.129 * var(--_helix-seed-chroma-scale))
|
|
202
243
|
calc(h + var(--_helix-series-hue-2))
|
|
203
244
|
)
|
|
204
245
|
);
|
|
205
246
|
--helix-color-series-11: light-dark(
|
|
206
247
|
oklch(
|
|
207
|
-
from var(--_helix-
|
|
248
|
+
from var(--_helix-series-origin) 0.52 calc(0.105 * var(--_helix-seed-chroma-scale))
|
|
208
249
|
calc(h + var(--_helix-series-hue-3))
|
|
209
250
|
),
|
|
210
251
|
oklch(
|
|
211
|
-
from var(--_helix-
|
|
252
|
+
from var(--_helix-series-origin) 0.7 calc(0.135 * var(--_helix-seed-chroma-scale))
|
|
212
253
|
calc(h + var(--_helix-series-hue-3))
|
|
213
254
|
)
|
|
214
255
|
);
|
|
215
256
|
--helix-color-series-12: light-dark(
|
|
216
257
|
oklch(
|
|
217
|
-
from var(--_helix-
|
|
258
|
+
from var(--_helix-series-origin) 0.6 calc(0.145 * var(--_helix-seed-chroma-scale))
|
|
218
259
|
calc(h + var(--_helix-series-hue-4))
|
|
219
260
|
),
|
|
220
261
|
oklch(
|
|
221
|
-
from var(--_helix-
|
|
262
|
+
from var(--_helix-series-origin) 0.78 calc(0.135 * var(--_helix-seed-chroma-scale))
|
|
222
263
|
calc(h + var(--_helix-series-hue-4))
|
|
223
264
|
)
|
|
224
265
|
);
|
|
225
266
|
--helix-color-series-13: light-dark(
|
|
226
267
|
oklch(
|
|
227
|
-
from var(--_helix-
|
|
268
|
+
from var(--_helix-series-origin) 0.52 calc(0.108 * var(--_helix-seed-chroma-scale))
|
|
228
269
|
calc(h + var(--_helix-series-hue-5))
|
|
229
270
|
),
|
|
230
271
|
oklch(
|
|
231
|
-
from var(--_helix-
|
|
272
|
+
from var(--_helix-series-origin) 0.7 calc(0.135 * var(--_helix-seed-chroma-scale))
|
|
232
273
|
calc(h + var(--_helix-series-hue-5))
|
|
233
274
|
)
|
|
234
275
|
);
|
|
235
276
|
--helix-color-series-14: light-dark(
|
|
236
277
|
oklch(
|
|
237
|
-
from var(--_helix-
|
|
278
|
+
from var(--_helix-series-origin) 0.6 calc(0.105 * var(--_helix-seed-chroma-scale))
|
|
238
279
|
calc(h + var(--_helix-series-hue-6))
|
|
239
280
|
),
|
|
240
281
|
oklch(
|
|
241
|
-
from var(--_helix-
|
|
282
|
+
from var(--_helix-series-origin) 0.78 calc(0.135 * var(--_helix-seed-chroma-scale))
|
|
242
283
|
calc(h + var(--_helix-series-hue-6))
|
|
243
284
|
)
|
|
244
285
|
);
|
|
245
286
|
--helix-color-series-15: light-dark(
|
|
246
287
|
oklch(
|
|
247
|
-
from var(--_helix-
|
|
288
|
+
from var(--_helix-series-origin) 0.52 calc(0.145 * var(--_helix-seed-chroma-scale))
|
|
248
289
|
calc(h + var(--_helix-series-hue-7))
|
|
249
290
|
),
|
|
250
291
|
oklch(
|
|
251
|
-
from var(--_helix-
|
|
292
|
+
from var(--_helix-series-origin) 0.7 calc(0.135 * var(--_helix-seed-chroma-scale))
|
|
252
293
|
calc(h + var(--_helix-series-hue-7))
|
|
253
294
|
)
|
|
254
295
|
);
|
|
255
296
|
--helix-color-series-16: light-dark(
|
|
256
297
|
oklch(
|
|
257
|
-
from var(--_helix-
|
|
298
|
+
from var(--_helix-series-origin) 0.6 calc(0.145 * var(--_helix-seed-chroma-scale))
|
|
258
299
|
calc(h + var(--_helix-series-hue-8))
|
|
259
300
|
),
|
|
260
301
|
oklch(
|
|
261
|
-
from var(--_helix-
|
|
302
|
+
from var(--_helix-series-origin) 0.78 calc(0.135 * var(--_helix-seed-chroma-scale))
|
|
262
303
|
calc(h + var(--_helix-series-hue-8))
|
|
263
304
|
)
|
|
264
305
|
);
|
|
265
306
|
--helix-color-series-17: light-dark(
|
|
266
307
|
oklch(
|
|
267
|
-
from var(--_helix-
|
|
308
|
+
from var(--_helix-series-origin) 0.52 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
268
309
|
calc(h + var(--_helix-series-hue-1))
|
|
269
310
|
),
|
|
270
311
|
oklch(
|
|
271
|
-
from var(--_helix-
|
|
312
|
+
from var(--_helix-series-origin) 0.7 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
272
313
|
calc(h + var(--_helix-series-hue-1))
|
|
273
314
|
)
|
|
274
315
|
);
|
|
275
316
|
--helix-color-series-18: light-dark(
|
|
276
317
|
oklch(
|
|
277
|
-
from var(--_helix-
|
|
318
|
+
from var(--_helix-series-origin) 0.6 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
278
319
|
calc(h + var(--_helix-series-hue-2))
|
|
279
320
|
),
|
|
280
321
|
oklch(
|
|
281
|
-
from var(--_helix-
|
|
322
|
+
from var(--_helix-series-origin) 0.78 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
282
323
|
calc(h + var(--_helix-series-hue-2))
|
|
283
324
|
)
|
|
284
325
|
);
|
|
285
326
|
--helix-color-series-19: light-dark(
|
|
286
327
|
oklch(
|
|
287
|
-
from var(--_helix-
|
|
328
|
+
from var(--_helix-series-origin) 0.52 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
288
329
|
calc(h + var(--_helix-series-hue-3))
|
|
289
330
|
),
|
|
290
331
|
oklch(
|
|
291
|
-
from var(--_helix-
|
|
332
|
+
from var(--_helix-series-origin) 0.7 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
292
333
|
calc(h + var(--_helix-series-hue-3))
|
|
293
334
|
)
|
|
294
335
|
);
|
|
295
336
|
--helix-color-series-20: light-dark(
|
|
296
337
|
oklch(
|
|
297
|
-
from var(--_helix-
|
|
338
|
+
from var(--_helix-series-origin) 0.6 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
298
339
|
calc(h + var(--_helix-series-hue-4))
|
|
299
340
|
),
|
|
300
341
|
oklch(
|
|
301
|
-
from var(--_helix-
|
|
342
|
+
from var(--_helix-series-origin) 0.78 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
302
343
|
calc(h + var(--_helix-series-hue-4))
|
|
303
344
|
)
|
|
304
345
|
);
|
|
305
346
|
--helix-color-series-21: light-dark(
|
|
306
347
|
oklch(
|
|
307
|
-
from var(--_helix-
|
|
348
|
+
from var(--_helix-series-origin) 0.52 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
308
349
|
calc(h + var(--_helix-series-hue-5))
|
|
309
350
|
),
|
|
310
351
|
oklch(
|
|
311
|
-
from var(--_helix-
|
|
352
|
+
from var(--_helix-series-origin) 0.7 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
312
353
|
calc(h + var(--_helix-series-hue-5))
|
|
313
354
|
)
|
|
314
355
|
);
|
|
315
356
|
--helix-color-series-22: light-dark(
|
|
316
357
|
oklch(
|
|
317
|
-
from var(--_helix-
|
|
358
|
+
from var(--_helix-series-origin) 0.6 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
318
359
|
calc(h + var(--_helix-series-hue-6))
|
|
319
360
|
),
|
|
320
361
|
oklch(
|
|
321
|
-
from var(--_helix-
|
|
362
|
+
from var(--_helix-series-origin) 0.78 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
322
363
|
calc(h + var(--_helix-series-hue-6))
|
|
323
364
|
)
|
|
324
365
|
);
|
|
325
366
|
--helix-color-series-23: light-dark(
|
|
326
367
|
oklch(
|
|
327
|
-
from var(--_helix-
|
|
368
|
+
from var(--_helix-series-origin) 0.52 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
328
369
|
calc(h + var(--_helix-series-hue-7))
|
|
329
370
|
),
|
|
330
371
|
oklch(
|
|
331
|
-
from var(--_helix-
|
|
372
|
+
from var(--_helix-series-origin) 0.7 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
332
373
|
calc(h + var(--_helix-series-hue-7))
|
|
333
374
|
)
|
|
334
375
|
);
|
|
335
376
|
--helix-color-series-24: light-dark(
|
|
336
377
|
oklch(
|
|
337
|
-
from var(--_helix-
|
|
378
|
+
from var(--_helix-series-origin) 0.6 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
338
379
|
calc(h + var(--_helix-series-hue-8))
|
|
339
380
|
),
|
|
340
381
|
oklch(
|
|
341
|
-
from var(--_helix-
|
|
382
|
+
from var(--_helix-series-origin) 0.78 calc(0.07 * var(--_helix-seed-chroma-scale))
|
|
342
383
|
calc(h + var(--_helix-series-hue-8))
|
|
343
384
|
)
|
|
344
385
|
);
|
|
@@ -347,12 +388,12 @@
|
|
|
347
388
|
--helix-color-warning: light-dark(var(--_helix-warning-600), var(--_helix-warning-400));
|
|
348
389
|
--helix-color-danger: light-dark(var(--_helix-danger-600), var(--_helix-danger-400));
|
|
349
390
|
--helix-color-primary-muted: light-dark(
|
|
350
|
-
|
|
351
|
-
|
|
391
|
+
var(--_helix-brand-quiet-500, var(--helix-color-foreground-muted)),
|
|
392
|
+
var(--_helix-brand-quiet-400, var(--helix-color-foreground-muted))
|
|
352
393
|
);
|
|
353
394
|
--helix-color-accent-muted: light-dark(
|
|
354
|
-
|
|
355
|
-
|
|
395
|
+
var(--_helix-accent-quiet-500, var(--helix-color-foreground-muted)),
|
|
396
|
+
var(--_helix-accent-quiet-400, var(--helix-color-foreground-muted))
|
|
356
397
|
);
|
|
357
398
|
--helix-color-danger-muted: light-dark(
|
|
358
399
|
oklch(from var(--_helix-danger-600) l calc(c * 0.5) h),
|
package/dist/tokens.json
CHANGED
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
"size",
|
|
17
17
|
"layer"
|
|
18
18
|
],
|
|
19
|
-
"count":
|
|
19
|
+
"count": 193,
|
|
20
20
|
"groups": {
|
|
21
21
|
"separation-policy": ["border-surface", "shadow-surface", "border-floating", "shadow-floating"],
|
|
22
22
|
"surface-ladder": [
|
|
@@ -83,9 +83,19 @@
|
|
|
83
83
|
"name": "--helix-color-foreground-subtle",
|
|
84
84
|
"value": "light-dark(var(--_helix-neutral-550), var(--_helix-neutral-450))"
|
|
85
85
|
},
|
|
86
|
+
{
|
|
87
|
+
"category": "color",
|
|
88
|
+
"name": "--helix-color-foreground-on-primary",
|
|
89
|
+
"value": "var(--_helix-brand-on, var(--helix-color-background))"
|
|
90
|
+
},
|
|
86
91
|
{
|
|
87
92
|
"category": "color",
|
|
88
93
|
"name": "--helix-color-foreground-on-accent",
|
|
94
|
+
"value": "var(--_helix-accent-on, var(--helix-color-background))"
|
|
95
|
+
},
|
|
96
|
+
{
|
|
97
|
+
"category": "color",
|
|
98
|
+
"name": "--helix-color-foreground-on-status",
|
|
89
99
|
"value": "var(--_helix-neutral-0)"
|
|
90
100
|
},
|
|
91
101
|
{
|
|
@@ -116,62 +126,62 @@
|
|
|
116
126
|
{
|
|
117
127
|
"category": "color",
|
|
118
128
|
"name": "--helix-color-primary",
|
|
119
|
-
"value": "light-dark(var(--_helix-brand-500), var(--_helix-brand-400))"
|
|
129
|
+
"value": "light-dark(var(--_helix-brand-500, var(--_helix-ink-500)), var(--_helix-brand-400, var(--_helix-ink-400)))"
|
|
120
130
|
},
|
|
121
131
|
{
|
|
122
132
|
"category": "color",
|
|
123
133
|
"name": "--helix-color-primary-hover",
|
|
124
|
-
"value": "light-dark(var(--_helix-brand-600), var(--_helix-brand-300))"
|
|
134
|
+
"value": "light-dark(var(--_helix-brand-600, var(--_helix-ink-600)), var(--_helix-brand-300, var(--_helix-ink-300)))"
|
|
125
135
|
},
|
|
126
136
|
{
|
|
127
137
|
"category": "color",
|
|
128
138
|
"name": "--helix-color-primary-active",
|
|
129
|
-
"value": "light-dark(var(--_helix-brand-700), var(--_helix-brand-200))"
|
|
139
|
+
"value": "light-dark(var(--_helix-brand-700, var(--_helix-ink-700)), var(--_helix-brand-200, var(--_helix-ink-200)))"
|
|
130
140
|
},
|
|
131
141
|
{
|
|
132
142
|
"category": "color",
|
|
133
143
|
"name": "--helix-color-primary-subtle",
|
|
134
|
-
"value": "light-dark(var(--_helix-brand-50), var(--_helix-brand-900))"
|
|
144
|
+
"value": "light-dark(var(--_helix-brand-50, var(--_helix-ink-50)), var(--_helix-brand-900, var(--_helix-ink-900)))"
|
|
135
145
|
},
|
|
136
146
|
{
|
|
137
147
|
"category": "color",
|
|
138
148
|
"name": "--helix-color-accent",
|
|
139
|
-
"value": "light-dark(var(--_helix-accent-500), var(--_helix-accent-400))"
|
|
149
|
+
"value": "light-dark(var(--_helix-accent-500, var(--_helix-ink-500)), var(--_helix-accent-400, var(--_helix-ink-400)))"
|
|
140
150
|
},
|
|
141
151
|
{
|
|
142
152
|
"category": "color",
|
|
143
153
|
"name": "--helix-color-accent-hover",
|
|
144
|
-
"value": "var(--_helix-accent-600)"
|
|
154
|
+
"value": "light-dark(var(--_helix-accent-600, var(--_helix-ink-600)), var(--_helix-accent-600, var(--_helix-ink-300)))"
|
|
145
155
|
},
|
|
146
156
|
{
|
|
147
157
|
"category": "color",
|
|
148
158
|
"name": "--helix-color-accent-active",
|
|
149
|
-
"value": "var(--_helix-accent-700)"
|
|
159
|
+
"value": "light-dark(var(--_helix-accent-700, var(--_helix-ink-700)), var(--_helix-accent-700, var(--_helix-ink-200)))"
|
|
150
160
|
},
|
|
151
161
|
{
|
|
152
162
|
"category": "color",
|
|
153
163
|
"name": "--helix-color-accent-subtle",
|
|
154
|
-
"value": "light-dark(var(--_helix-accent-50), var(--_helix-accent-900))"
|
|
164
|
+
"value": "light-dark(var(--_helix-accent-50, var(--_helix-ink-50)), var(--_helix-accent-900, var(--_helix-ink-900)))"
|
|
155
165
|
},
|
|
156
166
|
{
|
|
157
167
|
"category": "color",
|
|
158
168
|
"name": "--helix-color-accent-surface",
|
|
159
|
-
"value": "var(--_helix-accent-600)"
|
|
169
|
+
"value": "light-dark(var(--_helix-accent-600, var(--_helix-ink-500)), var(--_helix-accent-600, var(--_helix-ink-400)))"
|
|
160
170
|
},
|
|
161
171
|
{
|
|
162
172
|
"category": "color",
|
|
163
173
|
"name": "--helix-color-accent-surface-hover",
|
|
164
|
-
"value": "var(--_helix-accent-700)"
|
|
174
|
+
"value": "light-dark(var(--_helix-accent-700, var(--_helix-ink-600)), var(--_helix-accent-700, var(--_helix-ink-450)))"
|
|
165
175
|
},
|
|
166
176
|
{
|
|
167
177
|
"category": "color",
|
|
168
178
|
"name": "--helix-color-primary-surface",
|
|
169
|
-
"value": "var(--_helix-brand-600)"
|
|
179
|
+
"value": "light-dark(var(--_helix-brand-600, var(--_helix-ink-500)), var(--_helix-brand-600, var(--_helix-ink-400)))"
|
|
170
180
|
},
|
|
171
181
|
{
|
|
172
182
|
"category": "color",
|
|
173
183
|
"name": "--helix-color-primary-surface-hover",
|
|
174
|
-
"value": "var(--_helix-brand-700)"
|
|
184
|
+
"value": "light-dark(var(--_helix-brand-700, var(--_helix-ink-600)), var(--_helix-brand-700, var(--_helix-ink-450)))"
|
|
175
185
|
},
|
|
176
186
|
{
|
|
177
187
|
"category": "color",
|
|
@@ -181,7 +191,7 @@
|
|
|
181
191
|
{
|
|
182
192
|
"category": "color",
|
|
183
193
|
"name": "--helix-color-brand-mark",
|
|
184
|
-
"value": "light-dark(var(--_helix-brand-500), var(--_helix-brand-400))"
|
|
194
|
+
"value": "light-dark(var(--_helix-brand-500, var(--_helix-ink-500)), var(--_helix-brand-400, var(--_helix-ink-400)))"
|
|
185
195
|
},
|
|
186
196
|
{
|
|
187
197
|
"category": "color",
|
|
@@ -226,122 +236,122 @@
|
|
|
226
236
|
{
|
|
227
237
|
"category": "color",
|
|
228
238
|
"name": "--helix-color-series-1",
|
|
229
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
239
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.595 calc(0.221 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-1)) ), oklch( from var(--_helix-series-origin) 0.62 calc(0.206 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-1)) ) )"
|
|
230
240
|
},
|
|
231
241
|
{
|
|
232
242
|
"category": "color",
|
|
233
243
|
"name": "--helix-color-series-2",
|
|
234
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
244
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.645 calc(0.238 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-2)) ), oklch( from var(--_helix-series-origin) 0.645 calc(0.238 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-2)) ) )"
|
|
235
245
|
},
|
|
236
246
|
{
|
|
237
247
|
"category": "color",
|
|
238
248
|
"name": "--helix-color-series-3",
|
|
239
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
249
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.625 calc(0.126 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-3)) ), oklch( from var(--_helix-series-origin) 0.885 calc(0.179 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-3)) ) )"
|
|
240
250
|
},
|
|
241
251
|
{
|
|
242
252
|
"category": "color",
|
|
243
253
|
"name": "--helix-color-series-4",
|
|
244
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
254
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.565 calc(0.295 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-4)) ), oklch( from var(--_helix-series-origin) 0.62 calc(0.252 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-4)) ) )"
|
|
245
255
|
},
|
|
246
256
|
{
|
|
247
257
|
"category": "color",
|
|
248
258
|
"name": "--helix-color-series-5",
|
|
249
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
259
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.64 calc(0.133 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-5)) ), oklch( from var(--_helix-series-origin) 0.815 calc(0.17 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-5)) ) )"
|
|
250
260
|
},
|
|
251
261
|
{
|
|
252
262
|
"category": "color",
|
|
253
263
|
"name": "--helix-color-series-6",
|
|
254
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
264
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.63 calc(0.11 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-6)) ), oklch( from var(--_helix-series-origin) 0.825 calc(0.144 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-6)) ) )"
|
|
255
265
|
},
|
|
256
266
|
{
|
|
257
267
|
"category": "color",
|
|
258
268
|
"name": "--helix-color-series-7",
|
|
259
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
269
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.66 calc(0.277 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-7)) ), oklch( from var(--_helix-series-origin) 0.66 calc(0.277 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-7)) ) )"
|
|
260
270
|
},
|
|
261
271
|
{
|
|
262
272
|
"category": "color",
|
|
263
273
|
"name": "--helix-color-series-8",
|
|
264
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
274
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.63 calc(0.154 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-8)) ), oklch( from var(--_helix-series-origin) 0.895 calc(0.219 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-8)) ) )"
|
|
265
275
|
},
|
|
266
276
|
{
|
|
267
277
|
"category": "color",
|
|
268
278
|
"name": "--helix-color-series-9",
|
|
269
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
279
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.52 calc(0.145 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-1)) ), oklch( from var(--_helix-series-origin) 0.7 calc(0.135 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-1)) ) )"
|
|
270
280
|
},
|
|
271
281
|
{
|
|
272
282
|
"category": "color",
|
|
273
283
|
"name": "--helix-color-series-10",
|
|
274
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
284
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.6 calc(0.145 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-2)) ), oklch( from var(--_helix-series-origin) 0.78 calc(0.129 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-2)) ) )"
|
|
275
285
|
},
|
|
276
286
|
{
|
|
277
287
|
"category": "color",
|
|
278
288
|
"name": "--helix-color-series-11",
|
|
279
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
289
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.52 calc(0.105 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-3)) ), oklch( from var(--_helix-series-origin) 0.7 calc(0.135 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-3)) ) )"
|
|
280
290
|
},
|
|
281
291
|
{
|
|
282
292
|
"category": "color",
|
|
283
293
|
"name": "--helix-color-series-12",
|
|
284
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
294
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.6 calc(0.145 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-4)) ), oklch( from var(--_helix-series-origin) 0.78 calc(0.135 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-4)) ) )"
|
|
285
295
|
},
|
|
286
296
|
{
|
|
287
297
|
"category": "color",
|
|
288
298
|
"name": "--helix-color-series-13",
|
|
289
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
299
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.52 calc(0.108 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-5)) ), oklch( from var(--_helix-series-origin) 0.7 calc(0.135 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-5)) ) )"
|
|
290
300
|
},
|
|
291
301
|
{
|
|
292
302
|
"category": "color",
|
|
293
303
|
"name": "--helix-color-series-14",
|
|
294
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
304
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.6 calc(0.105 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-6)) ), oklch( from var(--_helix-series-origin) 0.78 calc(0.135 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-6)) ) )"
|
|
295
305
|
},
|
|
296
306
|
{
|
|
297
307
|
"category": "color",
|
|
298
308
|
"name": "--helix-color-series-15",
|
|
299
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
309
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.52 calc(0.145 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-7)) ), oklch( from var(--_helix-series-origin) 0.7 calc(0.135 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-7)) ) )"
|
|
300
310
|
},
|
|
301
311
|
{
|
|
302
312
|
"category": "color",
|
|
303
313
|
"name": "--helix-color-series-16",
|
|
304
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
314
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.6 calc(0.145 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-8)) ), oklch( from var(--_helix-series-origin) 0.78 calc(0.135 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-8)) ) )"
|
|
305
315
|
},
|
|
306
316
|
{
|
|
307
317
|
"category": "color",
|
|
308
318
|
"name": "--helix-color-series-17",
|
|
309
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
319
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.52 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-1)) ), oklch( from var(--_helix-series-origin) 0.7 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-1)) ) )"
|
|
310
320
|
},
|
|
311
321
|
{
|
|
312
322
|
"category": "color",
|
|
313
323
|
"name": "--helix-color-series-18",
|
|
314
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
324
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.6 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-2)) ), oklch( from var(--_helix-series-origin) 0.78 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-2)) ) )"
|
|
315
325
|
},
|
|
316
326
|
{
|
|
317
327
|
"category": "color",
|
|
318
328
|
"name": "--helix-color-series-19",
|
|
319
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
329
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.52 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-3)) ), oklch( from var(--_helix-series-origin) 0.7 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-3)) ) )"
|
|
320
330
|
},
|
|
321
331
|
{
|
|
322
332
|
"category": "color",
|
|
323
333
|
"name": "--helix-color-series-20",
|
|
324
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
334
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.6 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-4)) ), oklch( from var(--_helix-series-origin) 0.78 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-4)) ) )"
|
|
325
335
|
},
|
|
326
336
|
{
|
|
327
337
|
"category": "color",
|
|
328
338
|
"name": "--helix-color-series-21",
|
|
329
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
339
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.52 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-5)) ), oklch( from var(--_helix-series-origin) 0.7 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-5)) ) )"
|
|
330
340
|
},
|
|
331
341
|
{
|
|
332
342
|
"category": "color",
|
|
333
343
|
"name": "--helix-color-series-22",
|
|
334
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
344
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.6 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-6)) ), oklch( from var(--_helix-series-origin) 0.78 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-6)) ) )"
|
|
335
345
|
},
|
|
336
346
|
{
|
|
337
347
|
"category": "color",
|
|
338
348
|
"name": "--helix-color-series-23",
|
|
339
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
349
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.52 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-7)) ), oklch( from var(--_helix-series-origin) 0.7 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-7)) ) )"
|
|
340
350
|
},
|
|
341
351
|
{
|
|
342
352
|
"category": "color",
|
|
343
353
|
"name": "--helix-color-series-24",
|
|
344
|
-
"value": "light-dark( oklch( from var(--_helix-
|
|
354
|
+
"value": "light-dark( oklch( from var(--_helix-series-origin) 0.6 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-8)) ), oklch( from var(--_helix-series-origin) 0.78 calc(0.07 * var(--_helix-seed-chroma-scale)) calc(h + var(--_helix-series-hue-8)) ) )"
|
|
345
355
|
},
|
|
346
356
|
{
|
|
347
357
|
"category": "color",
|
|
@@ -366,12 +376,12 @@
|
|
|
366
376
|
{
|
|
367
377
|
"category": "color",
|
|
368
378
|
"name": "--helix-color-primary-muted",
|
|
369
|
-
"value": "light-dark(
|
|
379
|
+
"value": "light-dark(var(--_helix-brand-quiet-500, var(--helix-color-foreground-muted)), var(--_helix-brand-quiet-400, var(--helix-color-foreground-muted)))"
|
|
370
380
|
},
|
|
371
381
|
{
|
|
372
382
|
"category": "color",
|
|
373
383
|
"name": "--helix-color-accent-muted",
|
|
374
|
-
"value": "light-dark(
|
|
384
|
+
"value": "light-dark(var(--_helix-accent-quiet-500, var(--helix-color-foreground-muted)), var(--_helix-accent-quiet-400, var(--helix-color-foreground-muted)))"
|
|
375
385
|
},
|
|
376
386
|
{
|
|
377
387
|
"category": "color",
|
package/package.json
CHANGED