@workday/canvas-tokens-web 3.1.6 → 4.0.0-alpha.10

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 (29) hide show
  1. package/css/base/_variables.css +155 -39
  2. package/css/brand/_variables.css +136 -38
  3. package/css/system/_variables.css +460 -216
  4. package/dist/common-js/base/index.d.ts +195 -46
  5. package/dist/common-js/base/index.js +155 -39
  6. package/dist/common-js/brand/index.d.ts +381 -65
  7. package/dist/common-js/brand/index.js +102 -2
  8. package/dist/common-js/index.d.ts +3 -3
  9. package/dist/common-js/index.js +3 -3
  10. package/dist/common-js/system/index.d.ts +2154 -1340
  11. package/dist/common-js/system/index.js +554 -240
  12. package/dist/es6/base/index.d.ts +195 -46
  13. package/dist/es6/base/index.js +155 -39
  14. package/dist/es6/brand/index.d.ts +381 -65
  15. package/dist/es6/brand/index.js +102 -2
  16. package/dist/es6/index.d.ts +3 -3
  17. package/dist/es6/index.js +3 -3
  18. package/dist/es6/system/index.d.ts +2154 -1340
  19. package/dist/es6/system/index.js +554 -240
  20. package/less/base/_variables.less +155 -39
  21. package/less/brand/_variables.less +136 -38
  22. package/less/system/_variables.less +460 -216
  23. package/package.json +5 -1
  24. package/scss/base/_variables.sass +155 -39
  25. package/scss/base/_variables.scss +155 -39
  26. package/scss/brand/_variables.sass +136 -38
  27. package/scss/brand/_variables.scss +136 -38
  28. package/scss/system/_variables.sass +460 -216
  29. package/scss/system/_variables.scss +460 -216
package/css/base/_variables.css CHANGED
@@ -1,9 +1,22 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 18 Nov 2025 22:01:37 GMT
3
+ * Generated on Fri, 16 Jan 2026 20:45:01 GMT
4
4
  */
5
5
 
6
6
  :root {
7
+ --cnvs-base-font-size: 1rem; /* Default fontSize for the browser, may be overriden by user preferences */
8
+ --cnvs-base-baseline: 0.5rem; /* Baseline unit used for the 8pt sizing grid */
9
+ --cnvs-base-opacity-0: 0;
10
+ --cnvs-base-opacity-80: 0.08;
11
+ --cnvs-base-opacity-100: 0.08;
12
+ --cnvs-base-opacity-120: 0.12;
13
+ --cnvs-base-opacity-200: 0.2;
14
+ --cnvs-base-opacity-250: 0.2;
15
+ --cnvs-base-opacity-300: 0.4;
16
+ --cnvs-base-opacity-400: 0.4;
17
+ --cnvs-base-opacity-500: 0.84;
18
+ --cnvs-base-opacity-640: 0.64;
19
+ --cnvs-base-opacity-840: 0.84;
7
20
  --cnvs-base-palette-amber-25: oklch(0.9779 0.0214 95.33 / 1);
8
21
  --cnvs-base-palette-amber-50: oklch(0.969 0.0619 101.63 / 1);
9
22
  --cnvs-base-palette-amber-100: oklch(0.9567 0.0948 100.22 / 1);
@@ -17,6 +30,10 @@
17
30
  --cnvs-base-palette-amber-900: oklch(0.32 0.098 41.19 / 1);
18
31
  --cnvs-base-palette-amber-950: oklch(0.2489 0.0771 40.64 / 1);
19
32
  --cnvs-base-palette-amber-975: oklch(0.2165 0.0674 40.35 / 1);
33
+ --cnvs-base-palette-amber-a25: oklch(0.7982 0.159 92.57 / 0.1);
34
+ --cnvs-base-palette-amber-a50: oklch(0.8864 0.1845 100.28 / 0.22);
35
+ --cnvs-base-palette-amber-a100: oklch(0.8988 0.185 97.8 / 0.35);
36
+ --cnvs-base-palette-amber-a200: oklch(0.886 0.1822 96.83 / 0.64);
20
37
  --cnvs-base-palette-azure-25: oklch(0.981 0.0131 220.96 / 1);
21
38
  --cnvs-base-palette-azure-50: oklch(0.9549 0.0295 223.86 / 1);
22
39
  --cnvs-base-palette-azure-100: oklch(0.9321 0.0425 227.25 / 1);
@@ -30,6 +47,10 @@
30
47
  --cnvs-base-palette-azure-900: oklch(0.326 0.07 235.91 / 1);
31
48
  --cnvs-base-palette-azure-950: oklch(0.249 0.053 235.41 / 1);
32
49
  --cnvs-base-palette-azure-975: oklch(0.2138 0.0455 235.23 / 1);
50
+ --cnvs-base-palette-azure-a25: oklch(0.7487 0.1547 233.36 / 0.06);
51
+ --cnvs-base-palette-azure-a50: oklch(0.7394 0.1572 235.46 / 0.14);
52
+ --cnvs-base-palette-azure-a100: oklch(0.7186 0.1639 239.76 / 0.2);
53
+ --cnvs-base-palette-azure-a200: oklch(0.7117 0.1663 241.15 / 0.42);
33
54
  --cnvs-base-palette-blue-25: oklch(0.969 0.0155 248.07 / 1);
34
55
  --cnvs-base-palette-blue-50: oklch(0.9523 0.0239 248.12 / 1);
35
56
  --cnvs-base-palette-blue-100: oklch(0.928 0.0359 250.6 / 1);
@@ -43,6 +64,10 @@
43
64
  --cnvs-base-palette-blue-900: oklch(0.3152 0.1054 261.09 / 1);
44
65
  --cnvs-base-palette-blue-950: oklch(0.2452 0.0752 254.55 / 1);
45
66
  --cnvs-base-palette-blue-975: oklch(0.209 0.07 255.61 / 1);
67
+ --cnvs-base-palette-blue-a25: oklch(0.6499 0.1912 253.52 / 0.08);
68
+ --cnvs-base-palette-blue-a50: oklch(0.6152 0.2108 256.1 / 0.11);
69
+ --cnvs-base-palette-blue-a100: oklch(0.6225 0.2064 255.9 / 0.17);
70
+ --cnvs-base-palette-blue-a200: oklch(0.6048 0.2166 257.21 / 0.31);
46
71
  --cnvs-base-palette-coral-25: oklch(0.9837 0.0085 44.54 / 1);
47
72
  --cnvs-base-palette-coral-50: oklch(0.9659 0.0171 35.14 / 1);
48
73
  --cnvs-base-palette-coral-100: oklch(0.9344 0.0339 35.8 / 1);
@@ -56,6 +81,10 @@
56
81
  --cnvs-base-palette-coral-900: oklch(0.3043 0.1137 32.49 / 1);
57
82
  --cnvs-base-palette-coral-950: oklch(0.236 0.0899 31.8 / 1);
58
83
  --cnvs-base-palette-coral-975: oklch(0.2114 0.07 29.72 / 1);
84
+ --cnvs-base-palette-coral-a25: oklch(0.6708 0.221 37.37 / 0.04);
85
+ --cnvs-base-palette-coral-a50: oklch(0.6598 0.229 34.15 / 0.08);
86
+ --cnvs-base-palette-coral-a100: oklch(0.6545 0.2337 33.76 / 0.15);
87
+ --cnvs-base-palette-coral-a200: oklch(0.6552 0.2332 34.09 / 0.36);
59
88
  --cnvs-base-palette-green-25: oklch(0.9824 0.0282 148.77 / 1);
60
89
  --cnvs-base-palette-green-50: oklch(0.9655 0.0561 149.93 / 1);
61
90
  --cnvs-base-palette-green-100: oklch(0.9278 0.1024 149.88 / 1);
@@ -69,6 +98,10 @@
69
98
  --cnvs-base-palette-green-900: oklch(0.3197 0.0997 145.3 / 1);
70
99
  --cnvs-base-palette-green-950: oklch(0.2548 0.0796 145.23 / 1);
71
100
  --cnvs-base-palette-green-975: oklch(0.2118 0.0653 145.69 / 1);
101
+ --cnvs-base-palette-green-a25: oklch(0.8695 0.2801 143.52 / 0.08);
102
+ --cnvs-base-palette-green-a50: oklch(0.8685 0.2814 143.77 / 0.15);
103
+ --cnvs-base-palette-green-a100: oklch(0.8316 0.2716 143.71 / 0.29);
104
+ --cnvs-base-palette-green-a200: oklch(0.796 0.2508 144.9 / 0.6);
72
105
  --cnvs-base-palette-indigo-25: oklch(0.9703 0.0147 286 / 1);
73
106
  --cnvs-base-palette-indigo-50: oklch(0.9499 0.0243 280.81 / 1);
74
107
  --cnvs-base-palette-indigo-100: oklch(0.9201 0.0395 282.43 / 1);
@@ -82,6 +115,27 @@
82
115
  --cnvs-base-palette-indigo-900: oklch(0.317 0.142 278.2 / 1);
83
116
  --cnvs-base-palette-indigo-950: oklch(0.2448 0.1108 277.85 / 1);
84
117
  --cnvs-base-palette-indigo-975: oklch(0.1951 0.0693 277.85 / 1);
118
+ --cnvs-base-palette-indigo-a25: oklch(0.4762 0.2966 267.42 / 0.05);
119
+ --cnvs-base-palette-indigo-a50: oklch(0.4661 0.3036 264.5 / 0.08);
120
+ --cnvs-base-palette-indigo-a100: oklch(0.4693 0.3013 265.31 / 0.13);
121
+ --cnvs-base-palette-indigo-a200: oklch(0.4666 0.3032 264.75 / 0.24);
122
+ --cnvs-base-palette-magenta-25: oklch(0.9782 0.0191 325.55 / 1);
123
+ --cnvs-base-palette-magenta-50: oklch(0.9637 0.0322 325.69 / 1);
124
+ --cnvs-base-palette-magenta-100: oklch(0.9253 0.0627 329.34 / 1);
125
+ --cnvs-base-palette-magenta-200: oklch(0.887 0.1029 327.44 / 1);
126
+ --cnvs-base-palette-magenta-300: oklch(0.807 0.166 333.78 / 1);
127
+ --cnvs-base-palette-magenta-400: oklch(0.737 0.198 341.58 / 1);
128
+ --cnvs-base-palette-magenta-500: oklch(0.6557 0.2007 346.62 / 1);
129
+ --cnvs-base-palette-magenta-600: oklch(0.534 0.183 344.19 / 1);
130
+ --cnvs-base-palette-magenta-700: oklch(0.4641 0.1602 344.45 / 1);
131
+ --cnvs-base-palette-magenta-800: oklch(0.4011 0.1269 344.4 / 1);
132
+ --cnvs-base-palette-magenta-900: oklch(0.297 0.095 343.19 / 1);
133
+ --cnvs-base-palette-magenta-950: oklch(0.2332 0.0908 343.78 / 1);
134
+ --cnvs-base-palette-magenta-975: oklch(0.2016 0.0706 345.97 / 1);
135
+ --cnvs-base-palette-magenta-a25: oklch(0.7091 0.3124 328.27 / 0.05);
136
+ --cnvs-base-palette-magenta-a50: oklch(0.7044 0.3188 328.33 / 0.08);
137
+ --cnvs-base-palette-magenta-a100: oklch(0.6892 0.3052 333.97 / 0.16);
138
+ --cnvs-base-palette-magenta-a200: oklch(0.6972 0.3174 330.1 / 0.24);
85
139
  --cnvs-base-palette-neutral-0: oklch(1 0 0 / 1);
86
140
  --cnvs-base-palette-neutral-25: oklch(0.9851 0 0 / 1);
87
141
  --cnvs-base-palette-neutral-50: oklch(0.9702 0 0 / 1);
@@ -97,6 +151,20 @@
97
151
  --cnvs-base-palette-neutral-950: oklch(0.2308 0 0 / 1);
98
152
  --cnvs-base-palette-neutral-975: oklch(0.1591 0 0 / 1);
99
153
  --cnvs-base-palette-neutral-1000: oklch(0 0 0 / 1);
154
+ --cnvs-base-palette-neutral-a0: oklch(0 0 0 / 1);
155
+ --cnvs-base-palette-neutral-a25: oklch(0.1149 0 0 / 0.02);
156
+ --cnvs-base-palette-neutral-a50: oklch(0.1149 0 0 / 0.04);
157
+ --cnvs-base-palette-neutral-a100: oklch(0.1822 0 0 / 0.08);
158
+ --cnvs-base-palette-neutral-a200: oklch(0.0847 0 0 / 0.17);
159
+ --cnvs-base-palette-neutral-a300: oklch(0.1149 0 0 / 0.26);
160
+ --cnvs-base-palette-neutral-a400: oklch(0.0847 0 0 / 0.36);
161
+ --cnvs-base-palette-neutral-a500: oklch(0.1149 0 0 / 0.48);
162
+ --cnvs-base-palette-neutral-a600: oklch(0 0 0 / 0.6);
163
+ --cnvs-base-palette-neutral-a700: oklch(0.0672 0 0 / 0.67);
164
+ --cnvs-base-palette-neutral-a800: oklch(0 0 0 / 0.77);
165
+ --cnvs-base-palette-neutral-a900: oklch(0.0969 0 0 / 0.84);
166
+ --cnvs-base-palette-neutral-a950: oklch(0.0672 0 0 / 0.89);
167
+ --cnvs-base-palette-neutral-a975: oklch(0 0 0 / 0.95);
100
168
  --cnvs-base-palette-orange-25: oklch(0.9673 0.0205 67.52 / 1);
101
169
  --cnvs-base-palette-orange-50: oklch(0.9523 0.0366 72.6 / 1);
102
170
  --cnvs-base-palette-orange-100: oklch(0.9243 0.0542 67.95 / 1);
@@ -110,19 +178,10 @@
110
178
  --cnvs-base-palette-orange-900: oklch(0.3243 0.1084 37.05 / 1);
111
179
  --cnvs-base-palette-orange-950: oklch(0.2421 0.082 36.47 / 1);
112
180
  --cnvs-base-palette-orange-975: oklch(0.2121 0.0706 37.19 / 1);
113
- --cnvs-base-palette-magenta-25: oklch(0.9782 0.0191 325.55 / 1);
114
- --cnvs-base-palette-magenta-50: oklch(0.9637 0.0322 325.69 / 1);
115
- --cnvs-base-palette-magenta-100: oklch(0.9253 0.0627 329.34 / 1);
116
- --cnvs-base-palette-magenta-200: oklch(0.887 0.1029 327.44 / 1);
117
- --cnvs-base-palette-magenta-300: oklch(0.807 0.166 333.78 / 1);
118
- --cnvs-base-palette-magenta-400: oklch(0.737 0.198 341.58 / 1);
119
- --cnvs-base-palette-magenta-500: oklch(0.6557 0.2007 346.62 / 1);
120
- --cnvs-base-palette-magenta-600: oklch(0.534 0.183 344.19 / 1);
121
- --cnvs-base-palette-magenta-700: oklch(0.4641 0.1602 344.45 / 1);
122
- --cnvs-base-palette-magenta-800: oklch(0.4011 0.1269 344.4 / 1);
123
- --cnvs-base-palette-magenta-900: oklch(0.297 0.095 343.19 / 1);
124
- --cnvs-base-palette-magenta-950: oklch(0.2332 0.0908 343.78 / 1);
125
- --cnvs-base-palette-magenta-975: oklch(0.2016 0.0706 345.97 / 1);
181
+ --cnvs-base-palette-orange-a25: oklch(0.7136 0.1784 53.73 / 0.1);
182
+ --cnvs-base-palette-orange-a50: oklch(0.7555 0.1769 59.35 / 0.17);
183
+ --cnvs-base-palette-orange-a100: oklch(0.7365 0.1837 54.12 / 0.25);
184
+ --cnvs-base-palette-orange-a200: oklch(0.7304 0.1863 52.52 / 0.46);
126
185
  --cnvs-base-palette-purple-25: oklch(0.9776 0.0147 312 / 1);
127
186
  --cnvs-base-palette-purple-50: oklch(0.951 0.0321 311.49 / 1);
128
187
  --cnvs-base-palette-purple-100: oklch(0.909 0.0637 314.43 / 1);
@@ -136,6 +195,10 @@
136
195
  --cnvs-base-palette-purple-900: oklch(0.3143 0.0996 313.76 / 1);
137
196
  --cnvs-base-palette-purple-950: oklch(0.2351 0.0734 313.34 / 1);
138
197
  --cnvs-base-palette-purple-975: oklch(0.194 0.062 312.79 / 1);
198
+ --cnvs-base-palette-purple-a25: oklch(0.5632 0.2948 302.45 / 0.04);
199
+ --cnvs-base-palette-purple-a50: oklch(0.5645 0.2935 302.36 / 0.09);
200
+ --cnvs-base-palette-purple-a100: oklch(0.5867 0.2975 307.8 / 0.17);
201
+ --cnvs-base-palette-purple-a200: oklch(0.6051 0.3009 311.78 / 0.25);
139
202
  --cnvs-base-palette-red-25: oklch(0.9667 0.0163 21.82 / 1);
140
203
  --cnvs-base-palette-red-50: oklch(0.9533 0.0231 23.95 / 1);
141
204
  --cnvs-base-palette-red-100: oklch(0.9225 0.0394 25.51 / 1);
@@ -149,6 +212,10 @@
149
212
  --cnvs-base-palette-red-900: oklch(0.291 0.118 25.59 / 1);
150
213
  --cnvs-base-palette-red-950: oklch(0.2318 0.0937 24.02 / 1);
151
214
  --cnvs-base-palette-red-975: oklch(0.1988 0.0718 20.63 / 1);
215
+ --cnvs-base-palette-red-a25: oklch(0.6289 0.2567 29.11 / 0.04);
216
+ --cnvs-base-palette-red-a50: oklch(0.6434 0.2428 30.17 / 0.1);
217
+ --cnvs-base-palette-red-a100: oklch(0.6382 0.248 30.42 / 0.16);
218
+ --cnvs-base-palette-red-a200: oklch(0.6375 0.2487 30.71 / 0.35);
152
219
  --cnvs-base-palette-slate-25: oklch(0.9846 0.0018 248.57 / 1);
153
220
  --cnvs-base-palette-slate-50: oklch(0.9692 0.0035 248.23 / 1);
154
221
  --cnvs-base-palette-slate-100: oklch(0.9447 0.0053 248.12 / 1);
@@ -162,6 +229,19 @@
162
229
  --cnvs-base-palette-slate-900: oklch(0.278 0.0156 252.4 / 1);
163
230
  --cnvs-base-palette-slate-950: oklch(0.2453 0.0136 253.1 / 1);
164
231
  --cnvs-base-palette-slate-975: oklch(0.18 0.008 248.33 / 1);
232
+ --cnvs-base-palette-slate-a25: oklch(0.4688 0.0781 250.43 / 0.03);
233
+ --cnvs-base-palette-slate-a50: oklch(0.3343 0.0951 253.3 / 0.05);
234
+ --cnvs-base-palette-slate-a100: oklch(0.3337 0.0688 250.79 / 0.09);
235
+ --cnvs-base-palette-slate-a200: oklch(0.3057 0.079 256.22 / 0.13);
236
+ --cnvs-base-palette-slate-a300: oklch(0.2442 0.0693 257.66 / 0.21);
237
+ --cnvs-base-palette-slate-a400: oklch(0.2333 0.0665 257.09 / 0.35);
238
+ --cnvs-base-palette-slate-a500: oklch(0.2187 0.0685 255.77 / 0.51);
239
+ --cnvs-base-palette-slate-a600: oklch(0.1793 0.0503 254.55 / 0.64);
240
+ --cnvs-base-palette-slate-a700: oklch(0.1595 0.0431 250.87 / 0.7);
241
+ --cnvs-base-palette-slate-a800: oklch(0.157 0.0349 253.16 / 0.79);
242
+ --cnvs-base-palette-slate-a900: oklch(0.1351 0.0244 244.09 / 0.87);
243
+ --cnvs-base-palette-slate-a950: oklch(0.1312 0.0198 248.87 / 0.9);
244
+ --cnvs-base-palette-slate-a975: oklch(0.1168 0.014 231.47 / 0.95);
165
245
  --cnvs-base-palette-teal-25: oklch(0.9827 0.021 200.66 / 1);
166
246
  --cnvs-base-palette-teal-50: oklch(0.9575 0.0424 203.83 / 1);
167
247
  --cnvs-base-palette-teal-100: oklch(0.935 0.046 205.09 / 1);
@@ -175,6 +255,24 @@
175
255
  --cnvs-base-palette-teal-900: oklch(0.3052 0.0529 210.69 / 1);
176
256
  --cnvs-base-palette-teal-950: oklch(0.2425 0.042 210.69 / 1);
177
257
  --cnvs-base-palette-teal-975: oklch(0.2037 0.0354 211.24 / 1);
258
+ --cnvs-base-palette-teal-a25: oklch(0.8804 0.1478 200.72 / 0.09);
259
+ --cnvs-base-palette-teal-a50: oklch(0.8427 0.1433 206.66 / 0.19);
260
+ --cnvs-base-palette-teal-a100: oklch(0.7626 0.1316 209.35 / 0.22);
261
+ --cnvs-base-palette-teal-a200: oklch(0.7101 0.1219 207.98 / 0.37);
262
+ --cnvs-base-palette-white-a0: oklch(1 0 0 / 1);
263
+ --cnvs-base-palette-white-a25: oklch(1 0 0 / 0.02);
264
+ --cnvs-base-palette-white-a50: oklch(1 0 0 / 0.03);
265
+ --cnvs-base-palette-white-a100: oklch(1 0 0 / 0.08);
266
+ --cnvs-base-palette-white-a200: oklch(1 0 0 / 0.16);
267
+ --cnvs-base-palette-white-a300: oklch(1 0 0 / 0.26);
268
+ --cnvs-base-palette-white-a400: oklch(1 0 0 / 0.36);
269
+ --cnvs-base-palette-white-a500: oklch(1 0 0 / 0.47);
270
+ --cnvs-base-palette-white-a600: oklch(1 0 0 / 0.6);
271
+ --cnvs-base-palette-white-a700: oklch(1 0 0 / 0.67);
272
+ --cnvs-base-palette-white-a800: oklch(1 0 0 / 0.77);
273
+ --cnvs-base-palette-white-a900: oklch(1 0 0 / 0.83);
274
+ --cnvs-base-palette-white-a950: oklch(1 0 0 / 0.89);
275
+ --cnvs-base-palette-white-a975: oklch(1 0 0 / 0.95);
178
276
  --cnvs-base-palette-cinnamon-100: oklch(0.9533 0.0231 23.95 / 1);
179
277
  --cnvs-base-palette-cinnamon-200: oklch(0.9225 0.0394 25.51 / 1);
180
278
  --cnvs-base-palette-cinnamon-300: oklch(0.7533 0.1484 28.45 / 1);
@@ -337,13 +435,49 @@
337
435
  --cnvs-base-palette-cappuccino-400: #4A4242;
338
436
  --cnvs-base-palette-cappuccino-500: #352f2f;
339
437
  --cnvs-base-palette-cappuccino-600: #231f20;
340
- --cnvs-base-opacity-0: 0;
341
- --cnvs-base-opacity-100: 0.08;
342
- --cnvs-base-opacity-200: 0.12;
343
- --cnvs-base-opacity-250: 0.2;
344
- --cnvs-base-opacity-300: 0.4;
345
- --cnvs-base-opacity-400: 0.64;
346
- --cnvs-base-opacity-500: 0.84;
438
+ --cnvs-base-size-0: 0; /* 0px / 0rem */
439
+ --cnvs-base-size-25: 0.125rem; /* 2px / 0.125rem */
440
+ --cnvs-base-size-50: 0.25rem; /* 4px / 0.25rem */
441
+ --cnvs-base-size-75: 0.375rem; /* 6px / 0.375rem */
442
+ --cnvs-base-size-100: 0.5rem; /* 8px / 0.5rem */
443
+ --cnvs-base-size-125: 0.625rem; /* 10px / 0.625rem */
444
+ --cnvs-base-size-150: 0.75rem; /* 12px / 0.75rem */
445
+ --cnvs-base-size-175: 0.875rem; /* 14px / 0.875rem */
446
+ --cnvs-base-size-200: 1rem; /* 16px / 1rem */
447
+ --cnvs-base-size-225: 1.125rem; /* 18px / 1.125rem */
448
+ --cnvs-base-size-250: 1.25rem; /* 20px / 1.25rem */
449
+ --cnvs-base-size-300: 1.5rem; /* 24px / 1.5rem */
450
+ --cnvs-base-size-350: 1.75rem; /* 28px / 1.75rem */
451
+ --cnvs-base-size-400: 2rem; /* 32px / 2rem */
452
+ --cnvs-base-size-450: 2.25rem; /* 36px / 2.25rem */
453
+ --cnvs-base-size-500: 2.5rem; /* 40px / 2.5rem */
454
+ --cnvs-base-size-600: 3rem; /* 48px / 3rem */
455
+ --cnvs-base-size-700: 3.5rem; /* 56px / 3.5rem */
456
+ --cnvs-base-size-800: 4rem; /* 64px / 4rem */
457
+ --cnvs-base-size-900: 4.5rem; /* 72px / 4.5rem */
458
+ --cnvs-base-size-1000: 5rem; /* 80px / 5rem */
459
+ --cnvs-base-size-1100: 5.5rem; /* 88px / 5.5rem */
460
+ --cnvs-base-size-1200: 6rem; /* 96px / 6rem */
461
+ --cnvs-base-size-1300: 6.5rem; /* 104px / 6.5rem */
462
+ --cnvs-base-size-1400: 7rem; /* 112px / 7rem */
463
+ --cnvs-base-font-family-50: "Roboto"; /* Default font-family */
464
+ --cnvs-base-font-family-100: "Roboto Mono";
465
+ --cnvs-base-font-family-200: "Noto Sans";
466
+ --cnvs-base-font-weight-300: 300;
467
+ --cnvs-base-font-weight-400: 400;
468
+ --cnvs-base-font-weight-500: 500;
469
+ --cnvs-base-font-weight-700: 700;
470
+ --cnvs-base-letter-spacing-50: 0.025rem;
471
+ --cnvs-base-letter-spacing-100: 0.02rem;
472
+ --cnvs-base-letter-spacing-150: 0.015rem;
473
+ --cnvs-base-letter-spacing-200: 0.01rem;
474
+ --cnvs-base-unit: 0.25rem; /* The base unit used for the typographic grid system.; */
475
+ --cnvs-base-extended-palette-dragon-fruit-100: oklch(0.9776 0.0147 312 / 1);
476
+ --cnvs-base-extended-palette-dragon-fruit-200: oklch(0.909 0.0637 314.43 / 1);
477
+ --cnvs-base-extended-palette-dragon-fruit-300: oklch(0.615 0.2131 280.7 / 1);
478
+ --cnvs-base-extended-palette-dragon-fruit-400: oklch(0.5289 0.2241 281.65 / 1);
479
+ --cnvs-base-extended-palette-dragon-fruit-500: oklch(0.466 0.1961 280.9 / 1);
480
+ --cnvs-base-extended-palette-dragon-fruit-600: oklch(0.317 0.142 278.2 / 1);
347
481
  --cnvs-base-font-size-25: 0.625rem;
348
482
  --cnvs-base-font-size-50: 0.75rem;
349
483
  --cnvs-base-font-size-75: 0.875rem;
@@ -372,22 +506,4 @@
372
506
  --cnvs-base-line-height-750: 4.5rem;
373
507
  --cnvs-base-line-height-900: 5.5rem;
374
508
  --cnvs-base-line-height-1050: 6.5rem;
375
- --cnvs-base-font-family-50: "Roboto"; /* Default font-family */
376
- --cnvs-base-font-family-100: "Roboto Mono";
377
- --cnvs-base-font-family-200: "Noto Sans";
378
- --cnvs-base-font-weight-300: 300;
379
- --cnvs-base-font-weight-400: 400;
380
- --cnvs-base-font-weight-500: 500;
381
- --cnvs-base-font-weight-700: 700;
382
- --cnvs-base-letter-spacing-50: 0.025rem;
383
- --cnvs-base-letter-spacing-100: 0.02rem;
384
- --cnvs-base-letter-spacing-150: 0.015rem;
385
- --cnvs-base-letter-spacing-200: 0.01rem;
386
- --cnvs-base-unit: 0.25rem; /* The base unit used in the grid system.; */
387
- --cnvs-base-extended-palette-dragon-fruit-100: oklch(0.9776 0.0147 312 / 1);
388
- --cnvs-base-extended-palette-dragon-fruit-200: oklch(0.909 0.0637 314.43 / 1);
389
- --cnvs-base-extended-palette-dragon-fruit-300: oklch(0.615 0.2131 280.7 / 1);
390
- --cnvs-base-extended-palette-dragon-fruit-400: oklch(0.5289 0.2241 281.65 / 1);
391
- --cnvs-base-extended-palette-dragon-fruit-500: oklch(0.466 0.1961 280.9 / 1);
392
- --cnvs-base-extended-palette-dragon-fruit-600: oklch(0.317 0.142 278.2 / 1);
393
509
  }
package/css/brand/_variables.css CHANGED
@@ -1,49 +1,147 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 18 Nov 2025 22:01:37 GMT
3
+ * Generated on Fri, 16 Jan 2026 20:45:01 GMT
4
4
  */
5
5
 
6
6
  :root {
7
- --cnvs-brand-common-alert-outer: var(--cnvs-base-palette-amber-500);
8
- --cnvs-brand-common-alert-inner: var(--cnvs-base-palette-amber-400);
9
- --cnvs-brand-common-error-inner: var(--cnvs-base-palette-red-500);
10
- --cnvs-brand-common-focus-outline: var(--cnvs-base-palette-blue-500);
7
+ --cnvs-brand-positive-a200: var(--cnvs-base-palette-green-a200);
8
+ --cnvs-brand-positive-a100: var(--cnvs-base-palette-green-a100);
9
+ --cnvs-brand-positive-a50: var(--cnvs-base-palette-green-a50);
10
+ --cnvs-brand-positive-a25: var(--cnvs-base-palette-green-a25);
11
+ --cnvs-brand-positive-975: var(--cnvs-base-palette-green-975);
12
+ --cnvs-brand-positive-950: var(--cnvs-base-palette-green-950);
13
+ --cnvs-brand-positive-900: var(--cnvs-base-palette-green-900);
14
+ --cnvs-brand-positive-800: var(--cnvs-base-palette-green-800);
15
+ --cnvs-brand-positive-700: var(--cnvs-base-palette-green-700);
16
+ --cnvs-brand-positive-600: var(--cnvs-base-palette-green-600); /* Base success color. Use fg.inverse on this. */
17
+ --cnvs-brand-positive-500: var(--cnvs-base-palette-green-500);
18
+ --cnvs-brand-positive-400: var(--cnvs-base-palette-green-400);
19
+ --cnvs-brand-positive-300: var(--cnvs-base-palette-green-300);
20
+ --cnvs-brand-positive-200: var(--cnvs-base-palette-green-200);
21
+ --cnvs-brand-positive-100: var(--cnvs-base-palette-green-100);
22
+ --cnvs-brand-positive-50: var(--cnvs-base-palette-green-50);
23
+ --cnvs-brand-positive-25: var(--cnvs-base-palette-green-25);
24
+ --cnvs-brand-caution-a200: var(--cnvs-base-palette-amber-a200);
25
+ --cnvs-brand-caution-a100: var(--cnvs-base-palette-amber-a100);
26
+ --cnvs-brand-caution-a50: var(--cnvs-base-palette-amber-a50);
27
+ --cnvs-brand-caution-a25: var(--cnvs-base-palette-amber-a25);
28
+ --cnvs-brand-caution-975: var(--cnvs-base-palette-amber-975);
29
+ --cnvs-brand-caution-950: var(--cnvs-base-palette-amber-950);
30
+ --cnvs-brand-caution-900: var(--cnvs-base-palette-amber-900);
31
+ --cnvs-brand-caution-800: var(--cnvs-base-palette-amber-800);
32
+ --cnvs-brand-caution-700: var(--cnvs-base-palette-amber-700);
33
+ --cnvs-brand-caution-600: var(--cnvs-base-palette-amber-600);
34
+ --cnvs-brand-caution-500: var(--cnvs-base-palette-amber-500);
35
+ --cnvs-brand-caution-400: var(--cnvs-base-palette-amber-400); /* Base caution color (amber.400). Use fg.contrast on this. */
36
+ --cnvs-brand-caution-300: var(--cnvs-base-palette-amber-300);
37
+ --cnvs-brand-caution-200: var(--cnvs-base-palette-amber-200);
38
+ --cnvs-brand-caution-100: var(--cnvs-base-palette-amber-100);
39
+ --cnvs-brand-caution-50: var(--cnvs-base-palette-amber-50);
40
+ --cnvs-brand-caution-25: var(--cnvs-base-palette-amber-25);
41
+ --cnvs-brand-critical-a200: var(--cnvs-base-palette-red-a200);
42
+ --cnvs-brand-critical-a100: var(--cnvs-base-palette-red-a100);
43
+ --cnvs-brand-critical-a50: var(--cnvs-base-palette-red-a50);
44
+ --cnvs-brand-critical-a25: var(--cnvs-base-palette-red-a25);
45
+ --cnvs-brand-critical-975: var(--cnvs-base-palette-red-975);
46
+ --cnvs-brand-critical-950: var(--cnvs-base-palette-red-950);
47
+ --cnvs-brand-critical-900: var(--cnvs-base-palette-red-900);
48
+ --cnvs-brand-critical-800: var(--cnvs-base-palette-red-800);
49
+ --cnvs-brand-critical-700: var(--cnvs-base-palette-red-700);
50
+ --cnvs-brand-critical-600: var(--cnvs-base-palette-red-600); /* Base critical color. Use fg.inverse on this. */
51
+ --cnvs-brand-critical-500: var(--cnvs-base-palette-red-500);
52
+ --cnvs-brand-critical-400: var(--cnvs-base-palette-red-400);
53
+ --cnvs-brand-critical-300: var(--cnvs-base-palette-red-300);
54
+ --cnvs-brand-critical-200: var(--cnvs-base-palette-red-200);
55
+ --cnvs-brand-critical-100: var(--cnvs-base-palette-red-100);
56
+ --cnvs-brand-critical-50: var(--cnvs-base-palette-red-50);
57
+ --cnvs-brand-critical-25: var(--cnvs-base-palette-red-25);
58
+ --cnvs-brand-neutral-a975: var(--cnvs-base-palette-slate-a975);
59
+ --cnvs-brand-neutral-a950: var(--cnvs-base-palette-slate-a950);
60
+ --cnvs-brand-neutral-a900: var(--cnvs-base-palette-slate-a900);
61
+ --cnvs-brand-neutral-a800: var(--cnvs-base-palette-slate-a800);
62
+ --cnvs-brand-neutral-a700: var(--cnvs-base-palette-slate-a700);
63
+ --cnvs-brand-neutral-a600: var(--cnvs-base-palette-slate-a600);
64
+ --cnvs-brand-neutral-a500: var(--cnvs-base-palette-slate-a500);
65
+ --cnvs-brand-neutral-a400: var(--cnvs-base-palette-slate-a400);
66
+ --cnvs-brand-neutral-a300: var(--cnvs-base-palette-slate-a300);
67
+ --cnvs-brand-neutral-a200: var(--cnvs-base-palette-slate-a200);
68
+ --cnvs-brand-neutral-a100: var(--cnvs-base-palette-slate-a100);
69
+ --cnvs-brand-neutral-a50: var(--cnvs-base-palette-slate-a50);
70
+ --cnvs-brand-neutral-a25: var(--cnvs-base-palette-slate-a25);
11
71
  --cnvs-brand-neutral-light: var(--cnvs-base-palette-slate-200);
12
72
  --cnvs-brand-neutral-lighter: var(--cnvs-base-palette-slate-50);
13
- --cnvs-brand-neutral-accent: var(--cnvs-base-palette-neutral-0);
14
- --cnvs-brand-neutral-darkest: var(--cnvs-base-palette-slate-800);
15
- --cnvs-brand-neutral-dark: var(--cnvs-base-palette-slate-700);
16
- --cnvs-brand-neutral-base: var(--cnvs-base-palette-slate-600);
17
- --cnvs-brand-neutral-lightest: var(--cnvs-base-palette-slate-25);
18
- --cnvs-brand-success-light: var(--cnvs-base-palette-green-200);
19
- --cnvs-brand-success-accent: var(--cnvs-base-palette-neutral-0);
20
- --cnvs-brand-success-darkest: var(--cnvs-base-palette-green-800);
21
- --cnvs-brand-success-dark: var(--cnvs-base-palette-green-700);
22
- --cnvs-brand-success-lighter: var(--cnvs-base-palette-green-50);
23
- --cnvs-brand-success-lightest: var(--cnvs-base-palette-green-25);
24
- --cnvs-brand-success-base: var(--cnvs-base-palette-green-600);
25
- --cnvs-brand-alert-light: var(--cnvs-base-palette-amber-200);
26
- --cnvs-brand-alert-accent: var(--cnvs-base-palette-neutral-950);
27
- --cnvs-brand-alert-darkest: var(--cnvs-base-palette-amber-600);
28
- --cnvs-brand-alert-dark: var(--cnvs-base-palette-amber-500);
29
- --cnvs-brand-alert-lightest: var(--cnvs-base-palette-amber-25);
30
- --cnvs-brand-alert-lighter: var(--cnvs-base-palette-amber-50);
31
- --cnvs-brand-alert-base: var(--cnvs-base-palette-amber-400);
32
- --cnvs-brand-error-light: var(--cnvs-base-palette-red-200);
33
- --cnvs-brand-error-lighter: var(--cnvs-base-palette-red-50);
34
- --cnvs-brand-error-accent: var(--cnvs-base-palette-neutral-0);
35
- --cnvs-brand-error-darkest: var(--cnvs-base-palette-red-800);
36
- --cnvs-brand-error-dark: var(--cnvs-base-palette-red-700);
37
- --cnvs-brand-error-lightest: var(--cnvs-base-palette-red-25);
38
- --cnvs-brand-error-base: var(--cnvs-base-palette-red-600);
39
- --cnvs-brand-primary-light: var(--cnvs-base-palette-blue-200);
40
- --cnvs-brand-primary-lighter: var(--cnvs-base-palette-blue-50);
41
- --cnvs-brand-primary-accent: var(--cnvs-base-palette-neutral-0);
42
- --cnvs-brand-primary-dark: var(--cnvs-base-palette-blue-700);
43
- --cnvs-brand-primary-darkest: var(--cnvs-base-palette-blue-800);
44
- --cnvs-brand-primary-lightest: var(--cnvs-base-palette-blue-25);
45
- --cnvs-brand-primary-base: var(--cnvs-base-palette-blue-600);
73
+ --cnvs-brand-neutral-975: var(--cnvs-base-palette-slate-975);
74
+ --cnvs-brand-neutral-950: var(--cnvs-base-palette-slate-950);
75
+ --cnvs-brand-neutral-900: var(--cnvs-base-palette-slate-900);
76
+ --cnvs-brand-neutral-800: var(--cnvs-base-palette-slate-800);
77
+ --cnvs-brand-neutral-700: var(--cnvs-base-palette-slate-700);
78
+ --cnvs-brand-neutral-600: var(--cnvs-base-palette-slate-600);
79
+ --cnvs-brand-neutral-500: var(--cnvs-base-palette-slate-500);
80
+ --cnvs-brand-neutral-400: var(--cnvs-base-palette-slate-400);
81
+ --cnvs-brand-neutral-300: var(--cnvs-base-palette-slate-300);
82
+ --cnvs-brand-neutral-200: var(--cnvs-base-palette-slate-200);
83
+ --cnvs-brand-neutral-100: var(--cnvs-base-palette-slate-100);
84
+ --cnvs-brand-neutral-50: var(--cnvs-base-palette-slate-50);
85
+ --cnvs-brand-neutral-25: var(--cnvs-base-palette-slate-25);
86
+ --cnvs-brand-primary-a200: var(--cnvs-base-palette-blue-a200);
87
+ --cnvs-brand-primary-a100: var(--cnvs-base-palette-blue-a100);
88
+ --cnvs-brand-primary-a50: var(--cnvs-base-palette-blue-a50);
89
+ --cnvs-brand-primary-a25: var(--cnvs-base-palette-blue-a25);
90
+ --cnvs-brand-primary-975: var(--cnvs-base-palette-blue-975);
91
+ --cnvs-brand-primary-950: var(--cnvs-base-palette-blue-950);
92
+ --cnvs-brand-primary-900: var(--cnvs-base-palette-blue-900);
93
+ --cnvs-brand-primary-800: var(--cnvs-base-palette-blue-800);
94
+ --cnvs-brand-primary-700: var(--cnvs-base-palette-blue-700);
95
+ --cnvs-brand-primary-600: var(--cnvs-base-palette-blue-600); /* Base primary color. Use fg.inverse on this. */
96
+ --cnvs-brand-primary-500: var(--cnvs-base-palette-blue-500);
97
+ --cnvs-brand-primary-400: var(--cnvs-base-palette-blue-400);
98
+ --cnvs-brand-primary-300: var(--cnvs-base-palette-blue-300);
99
+ --cnvs-brand-primary-200: var(--cnvs-base-palette-blue-200);
100
+ --cnvs-brand-primary-100: var(--cnvs-base-palette-blue-100);
101
+ --cnvs-brand-primary-50: var(--cnvs-base-palette-blue-50);
102
+ --cnvs-brand-primary-25: var(--cnvs-base-palette-blue-25);
103
+ --cnvs-brand-common-caution-outer: var(--cnvs-brand-caution-500);
104
+ --cnvs-brand-common-caution-inner: var(--cnvs-brand-caution-400);
105
+ --cnvs-brand-common-critical: var(--cnvs-brand-critical-500);
106
+ --cnvs-brand-common-focus: var(--cnvs-brand-primary-500);
107
+ --cnvs-brand-neutral-accent: var(--cnvs-sys-color-fg-inverse);
108
+ --cnvs-brand-neutral-darkest: var(--cnvs-brand-neutral-800);
109
+ --cnvs-brand-neutral-dark: var(--cnvs-brand-neutral-700);
110
+ --cnvs-brand-neutral-base: var(--cnvs-brand-neutral-600);
111
+ --cnvs-brand-neutral-lightest: var(--cnvs-brand-neutral-25);
112
+ --cnvs-brand-success-light: var(--cnvs-brand-positive-200);
113
+ --cnvs-brand-success-accent: var(--cnvs-sys-color-fg-inverse);
114
+ --cnvs-brand-success-darkest: var(--cnvs-brand-positive-800);
115
+ --cnvs-brand-success-dark: var(--cnvs-brand-positive-700);
116
+ --cnvs-brand-success-lighter: var(--cnvs-brand-positive-50);
117
+ --cnvs-brand-success-lightest: var(--cnvs-brand-positive-25);
118
+ --cnvs-brand-success-base: var(--cnvs-brand-positive-600);
119
+ --cnvs-brand-alert-light: var(--cnvs-brand-caution-200);
120
+ --cnvs-brand-alert-accent: var(--cnvs-sys-color-fg-contrast-default);
121
+ --cnvs-brand-alert-darkest: var(--cnvs-brand-caution-600);
122
+ --cnvs-brand-alert-dark: var(--cnvs-brand-caution-500);
123
+ --cnvs-brand-alert-lightest: var(--cnvs-brand-caution-25);
124
+ --cnvs-brand-alert-lighter: var(--cnvs-brand-caution-50);
125
+ --cnvs-brand-alert-base: var(--cnvs-brand-caution-400);
126
+ --cnvs-brand-error-light: var(--cnvs-brand-critical-200);
127
+ --cnvs-brand-error-lighter: var(--cnvs-brand-critical-50);
128
+ --cnvs-brand-error-accent: var(--cnvs-sys-color-fg-inverse);
129
+ --cnvs-brand-error-darkest: var(--cnvs-brand-critical-800);
130
+ --cnvs-brand-error-dark: var(--cnvs-brand-critical-700);
131
+ --cnvs-brand-error-lightest: var(--cnvs-brand-critical-25);
132
+ --cnvs-brand-error-base: var(--cnvs-brand-critical-600);
133
+ --cnvs-brand-primary-light: var(--cnvs-brand-primary-200);
134
+ --cnvs-brand-primary-lighter: var(--cnvs-brand-primary-50);
135
+ --cnvs-brand-primary-accent: var(--cnvs-sys-color-fg-inverse);
136
+ --cnvs-brand-primary-dark: var(--cnvs-brand-primary-700);
137
+ --cnvs-brand-primary-darkest: var(--cnvs-brand-primary-800);
138
+ --cnvs-brand-primary-lightest: var(--cnvs-brand-primary-25);
139
+ --cnvs-brand-primary-base: var(--cnvs-brand-primary-600);
46
140
  --cnvs-brand-gradient-primary: linear-gradient(90deg, var(--cnvs-brand-primary-base) 0%, var(--cnvs-brand-primary-dark) 100%);
141
+ --cnvs-brand-common-alert-outer: var(--cnvs-brand-common-caution-outer);
142
+ --cnvs-brand-common-alert-inner: var(--cnvs-brand-common-caution-inner);
143
+ --cnvs-brand-common-error-inner: var(--cnvs-brand-common-critical);
144
+ --cnvs-brand-common-focus-outline: var(--cnvs-brand-common-focus);
47
145
  }
48
146
 
49
147