ionbase-ui 0.16.0 → 0.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/README.md +71 -7
  2. package/dist/meta/Alert.json +269 -0
  3. package/dist/meta/Avatar.json +97 -0
  4. package/dist/meta/AvatarGroup.json +82 -0
  5. package/dist/meta/Badge.json +83 -0
  6. package/dist/meta/Button.json +556 -0
  7. package/dist/meta/Checkbox.json +113 -0
  8. package/dist/meta/Divider.json +30 -0
  9. package/dist/meta/FullCard.json +97 -0
  10. package/dist/meta/Header.json +91 -0
  11. package/dist/meta/Icon.json +35 -0
  12. package/dist/meta/Input.json +558 -0
  13. package/dist/meta/Link.json +239 -0
  14. package/dist/meta/Logo.json +46 -0
  15. package/dist/meta/LogoMark.json +41 -0
  16. package/dist/meta/Menu.json +50 -0
  17. package/dist/meta/MenuItem.json +75 -0
  18. package/dist/meta/Modal.json +241 -0
  19. package/dist/meta/NavItem.json +76 -0
  20. package/dist/meta/PhoneInput.json +472 -0
  21. package/dist/meta/Popover.json +124 -0
  22. package/dist/meta/Radio.json +104 -0
  23. package/dist/meta/RadioGroup.json +126 -0
  24. package/dist/meta/ScrollProgress.json +63 -0
  25. package/dist/meta/Select.json +195 -0
  26. package/dist/meta/TabItem.json +15 -0
  27. package/dist/meta/Table.json +135 -0
  28. package/dist/meta/TableBody.json +43 -0
  29. package/dist/meta/TableCell.json +105 -0
  30. package/dist/meta/TableHead.json +43 -0
  31. package/dist/meta/TableRow.json +56 -0
  32. package/dist/meta/Tabs.json +186 -0
  33. package/dist/meta/Toast.json +105 -0
  34. package/dist/meta/ToastProvider.json +75 -0
  35. package/dist/meta/Toggle.json +102 -0
  36. package/dist/meta/Tooltip.json +78 -0
  37. package/dist/meta/components.json +4816 -0
  38. package/dist/meta/contrast.json +3608 -0
  39. package/dist/meta/index.json +479 -0
  40. package/dist/styles/alert.css +10 -5
  41. package/dist/styles/tokens/base.css +25 -25
  42. package/dist/styles/tokens/theme-dark.css +11 -11
  43. package/dist/tokens/index.d.ts +8 -8
  44. package/dist/tokens/index.js +8 -8
  45. package/eslint-plugin/index.js +64 -0
  46. package/eslint-plugin/meta-data.js +66 -0
  47. package/eslint-plugin/rules/needs-accessible-name.js +88 -0
  48. package/eslint-plugin/rules/no-deprecated-props.js +74 -0
  49. package/eslint-plugin/rules/no-known-contrast-failure.js +75 -0
  50. package/eslint-plugin/rules/no-raw-style-values.js +107 -0
  51. package/eslint-plugin/rules/one-primary-action.js +128 -0
  52. package/package.json +33 -7
  53. package/stylelint-config.js +144 -0
@@ -0,0 +1,3608 @@
1
+ {
2
+ "generated": "by scripts/verify-contrast.mjs",
3
+ "thresholds": {
4
+ "text": 4.5,
5
+ "nonText": 3
6
+ },
7
+ "pairings": [
8
+ {
9
+ "component": "button",
10
+ "context": "ion-button",
11
+ "state": "disabled",
12
+ "fg": "--text-disabled",
13
+ "bg": "--surface-disabled",
14
+ "backdrop": null,
15
+ "kind": "text",
16
+ "mode": "Dark",
17
+ "fgHex": "#6b7280",
18
+ "bgHex": "#1d2735",
19
+ "ratio": 3.12,
20
+ "min": 4.5
21
+ },
22
+ {
23
+ "component": "checkbox",
24
+ "context": "ion-checkbox ion-checkbox__input",
25
+ "state": "disabled",
26
+ "fg": "--icon-disabled",
27
+ "bg": "--surface-disabled",
28
+ "backdrop": null,
29
+ "kind": "non-text",
30
+ "mode": "Dark",
31
+ "fgHex": "#6b7280",
32
+ "bgHex": "#1d2735",
33
+ "ratio": 3.12,
34
+ "min": 3
35
+ },
36
+ {
37
+ "component": "input",
38
+ "context": "ion-input--disabled ion-input__field",
39
+ "state": "disabled",
40
+ "fg": "--text-disabled",
41
+ "bg": "--surface-disabled",
42
+ "backdrop": "--surface-page",
43
+ "kind": "text",
44
+ "mode": "Dark",
45
+ "fgHex": "#6b7280",
46
+ "bgHex": "#1d2735",
47
+ "ratio": 3.12,
48
+ "min": 4.5
49
+ },
50
+ {
51
+ "component": "input",
52
+ "context": "ion-input ion-input__field",
53
+ "state": "disabled",
54
+ "fg": "--text-disabled",
55
+ "bg": "--surface-disabled",
56
+ "backdrop": "--surface-page",
57
+ "kind": "text",
58
+ "mode": "Dark",
59
+ "fgHex": "#6b7280",
60
+ "bgHex": "#1d2735",
61
+ "ratio": 3.12,
62
+ "min": 4.5
63
+ },
64
+ {
65
+ "component": "input",
66
+ "context": "ion-input--disabled ion-input__icon-start",
67
+ "state": "disabled",
68
+ "fg": "--icon-disabled",
69
+ "bg": "--surface-disabled",
70
+ "backdrop": "--surface-page",
71
+ "kind": "non-text",
72
+ "mode": "Dark",
73
+ "fgHex": "#6b7280",
74
+ "bgHex": "#1d2735",
75
+ "ratio": 3.12,
76
+ "min": 3
77
+ },
78
+ {
79
+ "component": "input",
80
+ "context": "ion-input--disabled ion-input__icon-end",
81
+ "state": "disabled",
82
+ "fg": "--icon-disabled",
83
+ "bg": "--surface-disabled",
84
+ "backdrop": "--surface-page",
85
+ "kind": "non-text",
86
+ "mode": "Dark",
87
+ "fgHex": "#6b7280",
88
+ "bgHex": "#1d2735",
89
+ "ratio": 3.12,
90
+ "min": 3
91
+ },
92
+ {
93
+ "component": "input",
94
+ "context": "ion-input ion-input__icon-start",
95
+ "state": "disabled",
96
+ "fg": "--icon-disabled",
97
+ "bg": "--surface-disabled",
98
+ "backdrop": "--surface-page",
99
+ "kind": "non-text",
100
+ "mode": "Dark",
101
+ "fgHex": "#6b7280",
102
+ "bgHex": "#1d2735",
103
+ "ratio": 3.12,
104
+ "min": 3
105
+ },
106
+ {
107
+ "component": "input",
108
+ "context": "ion-input ion-input__icon-end",
109
+ "state": "disabled",
110
+ "fg": "--icon-disabled",
111
+ "bg": "--surface-disabled",
112
+ "backdrop": "--surface-page",
113
+ "kind": "non-text",
114
+ "mode": "Dark",
115
+ "fgHex": "#6b7280",
116
+ "bgHex": "#1d2735",
117
+ "ratio": 3.12,
118
+ "min": 3
119
+ },
120
+ {
121
+ "component": "phone-input",
122
+ "context": "ion-phone-input ion-phone-input__country",
123
+ "state": "disabled",
124
+ "fg": "--icon-disabled",
125
+ "bg": "--surface-disabled",
126
+ "backdrop": null,
127
+ "kind": "non-text",
128
+ "mode": "Dark",
129
+ "fgHex": "#6b7280",
130
+ "bgHex": "#1d2735",
131
+ "ratio": 3.12,
132
+ "min": 3
133
+ },
134
+ {
135
+ "component": "select",
136
+ "context": "ion-select--disabled ion-select__field",
137
+ "state": "disabled",
138
+ "fg": "--text-disabled",
139
+ "bg": "--surface-disabled",
140
+ "backdrop": "--surface-default",
141
+ "kind": "text",
142
+ "mode": "Dark",
143
+ "fgHex": "#6b7280",
144
+ "bgHex": "#1d2735",
145
+ "ratio": 3.12,
146
+ "min": 4.5
147
+ },
148
+ {
149
+ "component": "select",
150
+ "context": "ion-select ion-select__field",
151
+ "state": "disabled",
152
+ "fg": "--text-disabled",
153
+ "bg": "--surface-disabled",
154
+ "backdrop": "--surface-default",
155
+ "kind": "text",
156
+ "mode": "Dark",
157
+ "fgHex": "#6b7280",
158
+ "bgHex": "#1d2735",
159
+ "ratio": 3.12,
160
+ "min": 4.5
161
+ },
162
+ {
163
+ "component": "select",
164
+ "context": "ion-select--disabled ion-select__chevron",
165
+ "state": "disabled",
166
+ "fg": "--icon-disabled",
167
+ "bg": "--surface-disabled",
168
+ "backdrop": "--surface-default",
169
+ "kind": "non-text",
170
+ "mode": "Dark",
171
+ "fgHex": "#6b7280",
172
+ "bgHex": "#1d2735",
173
+ "ratio": 3.12,
174
+ "min": 3
175
+ },
176
+ {
177
+ "component": "select",
178
+ "context": "ion-select ion-select__chevron",
179
+ "state": "disabled",
180
+ "fg": "--icon-disabled",
181
+ "bg": "--surface-disabled",
182
+ "backdrop": "--surface-default",
183
+ "kind": "non-text",
184
+ "mode": "Dark",
185
+ "fgHex": "#6b7280",
186
+ "bgHex": "#1d2735",
187
+ "ratio": 3.12,
188
+ "min": 3
189
+ },
190
+ {
191
+ "component": "badge",
192
+ "context": "ion-badge--error",
193
+ "state": "default",
194
+ "fg": "--icon-error",
195
+ "bg": "--surface-error-subtle",
196
+ "backdrop": null,
197
+ "kind": "non-text",
198
+ "mode": "Dark",
199
+ "fgHex": "#f56b6b",
200
+ "bgHex": "#811d1d",
201
+ "ratio": 3.38,
202
+ "min": 3
203
+ },
204
+ {
205
+ "component": "alert",
206
+ "context": "ion-alert--solid&ion-alert--information",
207
+ "state": "default",
208
+ "fg": "--text-on-color",
209
+ "bg": "--surface-information",
210
+ "backdrop": "--surface-information",
211
+ "kind": "text",
212
+ "mode": "Dark",
213
+ "fgHex": "#000000",
214
+ "bgHex": "#5a4cd6",
215
+ "ratio": 3.44,
216
+ "min": 4.5
217
+ },
218
+ {
219
+ "component": "alert",
220
+ "context": "ion-alert ion-alert__dismiss",
221
+ "state": "hover",
222
+ "fg": "--icon-information",
223
+ "bg": "--surface-hover",
224
+ "backdrop": "--surface-information-subtle",
225
+ "kind": "non-text",
226
+ "mode": "Dark",
227
+ "fgHex": "#7e6ff1",
228
+ "bgHex": "#311371",
229
+ "compositedOver": "--surface-information-subtle",
230
+ "ratio": 3.71,
231
+ "min": 3
232
+ },
233
+ {
234
+ "component": "toast",
235
+ "context": "ion-toast ion-toast__icon",
236
+ "state": "default",
237
+ "fg": "--icon-information",
238
+ "bg": "--surface-raised",
239
+ "backdrop": "--surface-raised",
240
+ "kind": "non-text",
241
+ "mode": "Dark",
242
+ "fgHex": "#7e6ff1",
243
+ "bgHex": "#1d2735",
244
+ "ratio": 3.9,
245
+ "min": 3
246
+ },
247
+ {
248
+ "component": "alert",
249
+ "context": "ion-alert ion-alert__icon",
250
+ "state": "default",
251
+ "fg": "--icon-information",
252
+ "bg": "--surface-information-subtle",
253
+ "backdrop": "--surface-information-subtle",
254
+ "kind": "non-text",
255
+ "mode": "Dark",
256
+ "fgHex": "#7e6ff1",
257
+ "bgHex": "#260769",
258
+ "ratio": 4.12,
259
+ "min": 3
260
+ },
261
+ {
262
+ "component": "alert",
263
+ "context": "ion-alert ion-alert__dismiss",
264
+ "state": "default",
265
+ "fg": "--icon-information",
266
+ "bg": "--surface-information-subtle",
267
+ "backdrop": "--surface-information-subtle",
268
+ "kind": "non-text",
269
+ "mode": "Dark",
270
+ "fgHex": "#7e6ff1",
271
+ "bgHex": "#260769",
272
+ "ratio": 4.12,
273
+ "min": 3
274
+ },
275
+ {
276
+ "component": "alert",
277
+ "context": "ion-alert ion-alert__dismiss",
278
+ "state": "focus",
279
+ "fg": "--icon-information",
280
+ "bg": "--surface-information-subtle",
281
+ "backdrop": "--surface-information-subtle",
282
+ "kind": "non-text",
283
+ "mode": "Dark",
284
+ "fgHex": "#7e6ff1",
285
+ "bgHex": "#260769",
286
+ "ratio": 4.12,
287
+ "min": 3
288
+ },
289
+ {
290
+ "component": "badge",
291
+ "context": "ion-badge--information",
292
+ "state": "default",
293
+ "fg": "--icon-information",
294
+ "bg": "--surface-information-subtle",
295
+ "backdrop": null,
296
+ "kind": "non-text",
297
+ "mode": "Dark",
298
+ "fgHex": "#7e6ff1",
299
+ "bgHex": "#260769",
300
+ "ratio": 4.12,
301
+ "min": 3
302
+ },
303
+ {
304
+ "component": "button",
305
+ "context": "ion-button--primary-soft",
306
+ "state": "hover",
307
+ "fg": "--text-primary",
308
+ "bg": "--surface-primary-subtle-hover",
309
+ "backdrop": null,
310
+ "kind": "text",
311
+ "mode": "Dark",
312
+ "fgHex": "#609cf0",
313
+ "bgHex": "#0e2d8b",
314
+ "ratio": 4.25,
315
+ "min": 4.5
316
+ },
317
+ {
318
+ "component": "button",
319
+ "context": "ion-button--primary-soft",
320
+ "state": "pressed",
321
+ "fg": "--text-primary",
322
+ "bg": "--surface-primary-tint",
323
+ "backdrop": null,
324
+ "kind": "text",
325
+ "mode": "Dark",
326
+ "fgHex": "#609cf0",
327
+ "bgHex": "#0e2d8b",
328
+ "ratio": 4.25,
329
+ "min": 4.5
330
+ },
331
+ {
332
+ "component": "button",
333
+ "context": "ion-button",
334
+ "state": "disabled",
335
+ "fg": "--text-disabled",
336
+ "bg": "--surface-disabled",
337
+ "backdrop": null,
338
+ "kind": "text",
339
+ "mode": "Light",
340
+ "fgHex": "#6b7280",
341
+ "bgHex": "#f0f2f4",
342
+ "ratio": 4.31,
343
+ "min": 4.5
344
+ },
345
+ {
346
+ "component": "checkbox",
347
+ "context": "ion-checkbox ion-checkbox__input",
348
+ "state": "disabled",
349
+ "fg": "--icon-disabled",
350
+ "bg": "--surface-disabled",
351
+ "backdrop": null,
352
+ "kind": "non-text",
353
+ "mode": "Light",
354
+ "fgHex": "#6b7280",
355
+ "bgHex": "#f0f2f4",
356
+ "ratio": 4.31,
357
+ "min": 3
358
+ },
359
+ {
360
+ "component": "input",
361
+ "context": "ion-input--disabled ion-input__field",
362
+ "state": "disabled",
363
+ "fg": "--text-disabled",
364
+ "bg": "--surface-disabled",
365
+ "backdrop": "--surface-page",
366
+ "kind": "text",
367
+ "mode": "Light",
368
+ "fgHex": "#6b7280",
369
+ "bgHex": "#f0f2f4",
370
+ "ratio": 4.31,
371
+ "min": 4.5
372
+ },
373
+ {
374
+ "component": "input",
375
+ "context": "ion-input ion-input__field",
376
+ "state": "disabled",
377
+ "fg": "--text-disabled",
378
+ "bg": "--surface-disabled",
379
+ "backdrop": "--surface-page",
380
+ "kind": "text",
381
+ "mode": "Light",
382
+ "fgHex": "#6b7280",
383
+ "bgHex": "#f0f2f4",
384
+ "ratio": 4.31,
385
+ "min": 4.5
386
+ },
387
+ {
388
+ "component": "input",
389
+ "context": "ion-input--disabled ion-input__icon-start",
390
+ "state": "disabled",
391
+ "fg": "--icon-disabled",
392
+ "bg": "--surface-disabled",
393
+ "backdrop": "--surface-page",
394
+ "kind": "non-text",
395
+ "mode": "Light",
396
+ "fgHex": "#6b7280",
397
+ "bgHex": "#f0f2f4",
398
+ "ratio": 4.31,
399
+ "min": 3
400
+ },
401
+ {
402
+ "component": "input",
403
+ "context": "ion-input--disabled ion-input__icon-end",
404
+ "state": "disabled",
405
+ "fg": "--icon-disabled",
406
+ "bg": "--surface-disabled",
407
+ "backdrop": "--surface-page",
408
+ "kind": "non-text",
409
+ "mode": "Light",
410
+ "fgHex": "#6b7280",
411
+ "bgHex": "#f0f2f4",
412
+ "ratio": 4.31,
413
+ "min": 3
414
+ },
415
+ {
416
+ "component": "input",
417
+ "context": "ion-input ion-input__icon-start",
418
+ "state": "disabled",
419
+ "fg": "--icon-disabled",
420
+ "bg": "--surface-disabled",
421
+ "backdrop": "--surface-page",
422
+ "kind": "non-text",
423
+ "mode": "Light",
424
+ "fgHex": "#6b7280",
425
+ "bgHex": "#f0f2f4",
426
+ "ratio": 4.31,
427
+ "min": 3
428
+ },
429
+ {
430
+ "component": "input",
431
+ "context": "ion-input ion-input__icon-end",
432
+ "state": "disabled",
433
+ "fg": "--icon-disabled",
434
+ "bg": "--surface-disabled",
435
+ "backdrop": "--surface-page",
436
+ "kind": "non-text",
437
+ "mode": "Light",
438
+ "fgHex": "#6b7280",
439
+ "bgHex": "#f0f2f4",
440
+ "ratio": 4.31,
441
+ "min": 3
442
+ },
443
+ {
444
+ "component": "phone-input",
445
+ "context": "ion-phone-input ion-phone-input__country",
446
+ "state": "disabled",
447
+ "fg": "--icon-disabled",
448
+ "bg": "--surface-disabled",
449
+ "backdrop": null,
450
+ "kind": "non-text",
451
+ "mode": "Light",
452
+ "fgHex": "#6b7280",
453
+ "bgHex": "#f0f2f4",
454
+ "ratio": 4.31,
455
+ "min": 3
456
+ },
457
+ {
458
+ "component": "select",
459
+ "context": "ion-select--disabled ion-select__field",
460
+ "state": "disabled",
461
+ "fg": "--text-disabled",
462
+ "bg": "--surface-disabled",
463
+ "backdrop": "--surface-default",
464
+ "kind": "text",
465
+ "mode": "Light",
466
+ "fgHex": "#6b7280",
467
+ "bgHex": "#f0f2f4",
468
+ "ratio": 4.31,
469
+ "min": 4.5
470
+ },
471
+ {
472
+ "component": "select",
473
+ "context": "ion-select ion-select__field",
474
+ "state": "disabled",
475
+ "fg": "--text-disabled",
476
+ "bg": "--surface-disabled",
477
+ "backdrop": "--surface-default",
478
+ "kind": "text",
479
+ "mode": "Light",
480
+ "fgHex": "#6b7280",
481
+ "bgHex": "#f0f2f4",
482
+ "ratio": 4.31,
483
+ "min": 4.5
484
+ },
485
+ {
486
+ "component": "select",
487
+ "context": "ion-select--disabled ion-select__chevron",
488
+ "state": "disabled",
489
+ "fg": "--icon-disabled",
490
+ "bg": "--surface-disabled",
491
+ "backdrop": "--surface-default",
492
+ "kind": "non-text",
493
+ "mode": "Light",
494
+ "fgHex": "#6b7280",
495
+ "bgHex": "#f0f2f4",
496
+ "ratio": 4.31,
497
+ "min": 3
498
+ },
499
+ {
500
+ "component": "select",
501
+ "context": "ion-select ion-select__chevron",
502
+ "state": "disabled",
503
+ "fg": "--icon-disabled",
504
+ "bg": "--surface-disabled",
505
+ "backdrop": "--surface-default",
506
+ "kind": "non-text",
507
+ "mode": "Light",
508
+ "fgHex": "#6b7280",
509
+ "bgHex": "#f0f2f4",
510
+ "ratio": 4.31,
511
+ "min": 3
512
+ },
513
+ {
514
+ "component": "menu",
515
+ "context": "ion-menu ion-menu__item",
516
+ "state": "disabled",
517
+ "fg": "--icon-disabled",
518
+ "bg": "--surface-default",
519
+ "backdrop": "--surface-default",
520
+ "kind": "non-text",
521
+ "mode": "Dark",
522
+ "fgHex": "#6b7280",
523
+ "bgHex": "#000000",
524
+ "ratio": 4.34,
525
+ "min": 3
526
+ },
527
+ {
528
+ "component": "badge",
529
+ "context": "ion-badge--error",
530
+ "state": "default",
531
+ "fg": "--icon-error",
532
+ "bg": "--surface-error-subtle",
533
+ "backdrop": null,
534
+ "kind": "non-text",
535
+ "mode": "Light",
536
+ "fgHex": "#dc2828",
537
+ "bgHex": "#fef1f1",
538
+ "ratio": 4.36,
539
+ "min": 3
540
+ },
541
+ {
542
+ "component": "alert",
543
+ "context": "ion-alert--solid&ion-alert--primary",
544
+ "state": "default",
545
+ "fg": "--text-on-color",
546
+ "bg": "--surface-primary",
547
+ "backdrop": "--surface-primary",
548
+ "kind": "text",
549
+ "mode": "Dark",
550
+ "fgHex": "#000000",
551
+ "bgHex": "#286ef0",
552
+ "ratio": 4.58,
553
+ "min": 4.5
554
+ },
555
+ {
556
+ "component": "button",
557
+ "context": "ion-button--primary-brand",
558
+ "state": "default",
559
+ "fg": "--text-on-color",
560
+ "bg": "--surface-primary",
561
+ "backdrop": null,
562
+ "kind": "text",
563
+ "mode": "Dark",
564
+ "fgHex": "#000000",
565
+ "bgHex": "#286ef0",
566
+ "ratio": 4.58,
567
+ "min": 4.5
568
+ },
569
+ {
570
+ "component": "button",
571
+ "context": "ion-button--primary-soft",
572
+ "state": "hover",
573
+ "fg": "--text-primary",
574
+ "bg": "--surface-primary-subtle-hover",
575
+ "backdrop": null,
576
+ "kind": "text",
577
+ "mode": "Light",
578
+ "fgHex": "#1c62e3",
579
+ "bgHex": "#e2f1fd",
580
+ "ratio": 4.67,
581
+ "min": 4.5
582
+ },
583
+ {
584
+ "component": "button",
585
+ "context": "ion-button--primary-soft",
586
+ "state": "pressed",
587
+ "fg": "--text-primary",
588
+ "bg": "--surface-primary-tint",
589
+ "backdrop": null,
590
+ "kind": "text",
591
+ "mode": "Light",
592
+ "fgHex": "#1c62e3",
593
+ "bgHex": "#e2f1fd",
594
+ "ratio": 4.67,
595
+ "min": 4.5
596
+ },
597
+ {
598
+ "component": "alert",
599
+ "context": "ion-alert--success",
600
+ "state": "default",
601
+ "fg": "--text-success",
602
+ "bg": "--surface-success-subtle",
603
+ "backdrop": "--surface-success-subtle",
604
+ "kind": "text",
605
+ "mode": "Dark",
606
+ "fgHex": "#39b378",
607
+ "bgHex": "#023c13",
608
+ "ratio": 4.76,
609
+ "min": 4.5
610
+ },
611
+ {
612
+ "component": "badge",
613
+ "context": "ion-badge--success",
614
+ "state": "default",
615
+ "fg": "--icon-success",
616
+ "bg": "--surface-success-subtle",
617
+ "backdrop": null,
618
+ "kind": "non-text",
619
+ "mode": "Dark",
620
+ "fgHex": "#39b378",
621
+ "bgHex": "#023c13",
622
+ "ratio": 4.76,
623
+ "min": 3
624
+ },
625
+ {
626
+ "component": "alert",
627
+ "context": "ion-alert--solid&ion-alert--error",
628
+ "state": "default",
629
+ "fg": "--text-on-color",
630
+ "bg": "--surface-error",
631
+ "backdrop": "--surface-error",
632
+ "kind": "text",
633
+ "mode": "Light",
634
+ "fgHex": "#ffffff",
635
+ "bgHex": "#dc2828",
636
+ "ratio": 4.8,
637
+ "min": 4.5
638
+ },
639
+ {
640
+ "component": "button",
641
+ "context": "ion-button--destructive",
642
+ "state": "default",
643
+ "fg": "--text-on-color",
644
+ "bg": "--surface-error",
645
+ "backdrop": null,
646
+ "kind": "text",
647
+ "mode": "Light",
648
+ "fgHex": "#ffffff",
649
+ "bgHex": "#dc2828",
650
+ "ratio": 4.8,
651
+ "min": 4.5
652
+ },
653
+ {
654
+ "component": "menu",
655
+ "context": "ion-menu ion-menu__item",
656
+ "state": "disabled",
657
+ "fg": "--icon-disabled",
658
+ "bg": "--surface-default",
659
+ "backdrop": "--surface-default",
660
+ "kind": "non-text",
661
+ "mode": "Light",
662
+ "fgHex": "#6b7280",
663
+ "bgHex": "#ffffff",
664
+ "ratio": 4.83,
665
+ "min": 3
666
+ },
667
+ {
668
+ "component": "badge",
669
+ "context": "ion-badge--primary",
670
+ "state": "default",
671
+ "fg": "--icon-primary",
672
+ "bg": "--surface-primary-subtle",
673
+ "backdrop": null,
674
+ "kind": "non-text",
675
+ "mode": "Light",
676
+ "fgHex": "#1c62e3",
677
+ "bgHex": "#ebf7ff",
678
+ "ratio": 4.94,
679
+ "min": 3
680
+ },
681
+ {
682
+ "component": "button",
683
+ "context": "ion-button--primary-soft",
684
+ "state": "default",
685
+ "fg": "--text-primary",
686
+ "bg": "--surface-primary-subtle",
687
+ "backdrop": null,
688
+ "kind": "text",
689
+ "mode": "Light",
690
+ "fgHex": "#1c62e3",
691
+ "bgHex": "#ebf7ff",
692
+ "ratio": 4.94,
693
+ "min": 4.5
694
+ },
695
+ {
696
+ "component": "menu",
697
+ "context": "ion-menu__item--selected ion-menu__item--selected",
698
+ "state": "selected",
699
+ "fg": "--icon-primary",
700
+ "bg": "--surface-primary-subtle",
701
+ "backdrop": "--surface-default",
702
+ "kind": "non-text",
703
+ "mode": "Light",
704
+ "fgHex": "#1c62e3",
705
+ "bgHex": "#ebf7ff",
706
+ "ratio": 4.94,
707
+ "min": 3
708
+ },
709
+ {
710
+ "component": "modal",
711
+ "context": "ion-modal ion-modal__media",
712
+ "state": "default",
713
+ "fg": "--icon-primary",
714
+ "bg": "--surface-primary-subtle",
715
+ "backdrop": "--surface-overlay",
716
+ "kind": "non-text",
717
+ "mode": "Light",
718
+ "fgHex": "#1c62e3",
719
+ "bgHex": "#ebf7ff",
720
+ "ratio": 4.94,
721
+ "min": 3
722
+ },
723
+ {
724
+ "component": "badge",
725
+ "context": "ion-badge--success",
726
+ "state": "default",
727
+ "fg": "--icon-success",
728
+ "bg": "--surface-success-subtle",
729
+ "backdrop": null,
730
+ "kind": "non-text",
731
+ "mode": "Light",
732
+ "fgHex": "#0d7d38",
733
+ "bgHex": "#f8fefc",
734
+ "ratio": 5.13,
735
+ "min": 3
736
+ },
737
+ {
738
+ "component": "alert",
739
+ "context": "ion-alert--solid&ion-alert--success",
740
+ "state": "default",
741
+ "fg": "--text-on-color",
742
+ "bg": "--surface-success",
743
+ "backdrop": "--surface-success",
744
+ "kind": "text",
745
+ "mode": "Light",
746
+ "fgHex": "#ffffff",
747
+ "bgHex": "#0d7d38",
748
+ "ratio": 5.24,
749
+ "min": 4.5
750
+ },
751
+ {
752
+ "component": "button",
753
+ "context": "ion-button--success",
754
+ "state": "default",
755
+ "fg": "--text-on-color",
756
+ "bg": "--surface-success",
757
+ "backdrop": null,
758
+ "kind": "text",
759
+ "mode": "Light",
760
+ "fgHex": "#ffffff",
761
+ "bgHex": "#0d7d38",
762
+ "ratio": 5.24,
763
+ "min": 4.5
764
+ },
765
+ {
766
+ "component": "alert",
767
+ "context": "ion-alert--primary",
768
+ "state": "default",
769
+ "fg": "--text-link",
770
+ "bg": "--surface-primary-subtle",
771
+ "backdrop": "--surface-primary-subtle",
772
+ "kind": "text",
773
+ "mode": "Dark",
774
+ "fgHex": "#609cf0",
775
+ "bgHex": "#071e69",
776
+ "ratio": 5.37,
777
+ "min": 4.5
778
+ },
779
+ {
780
+ "component": "badge",
781
+ "context": "ion-badge--primary",
782
+ "state": "default",
783
+ "fg": "--icon-primary",
784
+ "bg": "--surface-primary-subtle",
785
+ "backdrop": null,
786
+ "kind": "non-text",
787
+ "mode": "Dark",
788
+ "fgHex": "#609cf0",
789
+ "bgHex": "#071e69",
790
+ "ratio": 5.37,
791
+ "min": 3
792
+ },
793
+ {
794
+ "component": "button",
795
+ "context": "ion-button--primary-soft",
796
+ "state": "default",
797
+ "fg": "--text-primary",
798
+ "bg": "--surface-primary-subtle",
799
+ "backdrop": null,
800
+ "kind": "text",
801
+ "mode": "Dark",
802
+ "fgHex": "#609cf0",
803
+ "bgHex": "#071e69",
804
+ "ratio": 5.37,
805
+ "min": 4.5
806
+ },
807
+ {
808
+ "component": "menu",
809
+ "context": "ion-menu__item--selected ion-menu__item--selected",
810
+ "state": "selected",
811
+ "fg": "--icon-primary",
812
+ "bg": "--surface-primary-subtle",
813
+ "backdrop": "--surface-default",
814
+ "kind": "non-text",
815
+ "mode": "Dark",
816
+ "fgHex": "#609cf0",
817
+ "bgHex": "#071e69",
818
+ "ratio": 5.37,
819
+ "min": 3
820
+ },
821
+ {
822
+ "component": "modal",
823
+ "context": "ion-modal ion-modal__media",
824
+ "state": "default",
825
+ "fg": "--icon-primary",
826
+ "bg": "--surface-primary-subtle",
827
+ "backdrop": "--surface-overlay",
828
+ "kind": "non-text",
829
+ "mode": "Dark",
830
+ "fgHex": "#609cf0",
831
+ "bgHex": "#071e69",
832
+ "ratio": 5.37,
833
+ "min": 3
834
+ },
835
+ {
836
+ "component": "alert",
837
+ "context": "ion-alert--solid&ion-alert--primary",
838
+ "state": "default",
839
+ "fg": "--text-on-color",
840
+ "bg": "--surface-primary",
841
+ "backdrop": "--surface-primary",
842
+ "kind": "text",
843
+ "mode": "Light",
844
+ "fgHex": "#ffffff",
845
+ "bgHex": "#1c62e3",
846
+ "ratio": 5.38,
847
+ "min": 4.5
848
+ },
849
+ {
850
+ "component": "button",
851
+ "context": "ion-button--primary-brand",
852
+ "state": "default",
853
+ "fg": "--text-on-color",
854
+ "bg": "--surface-primary",
855
+ "backdrop": null,
856
+ "kind": "text",
857
+ "mode": "Light",
858
+ "fgHex": "#ffffff",
859
+ "bgHex": "#1c62e3",
860
+ "ratio": 5.38,
861
+ "min": 4.5
862
+ },
863
+ {
864
+ "component": "toast",
865
+ "context": "ion-toast ion-toast__action",
866
+ "state": "default",
867
+ "fg": "--text-link",
868
+ "bg": "--surface-raised",
869
+ "backdrop": "--surface-raised",
870
+ "kind": "text",
871
+ "mode": "Dark",
872
+ "fgHex": "#609cf0",
873
+ "bgHex": "#1d2735",
874
+ "ratio": 5.39,
875
+ "min": 4.5
876
+ },
877
+ {
878
+ "component": "toast",
879
+ "context": "ion-toast ion-toast__action",
880
+ "state": "focus",
881
+ "fg": "--text-link",
882
+ "bg": "--surface-raised",
883
+ "backdrop": "--surface-raised",
884
+ "kind": "text",
885
+ "mode": "Dark",
886
+ "fgHex": "#609cf0",
887
+ "bgHex": "#1d2735",
888
+ "ratio": 5.39,
889
+ "min": 4.5
890
+ },
891
+ {
892
+ "component": "alert",
893
+ "context": "ion-alert--warning",
894
+ "state": "default",
895
+ "fg": "--text-warning",
896
+ "bg": "--surface-warning-subtle",
897
+ "backdrop": "--surface-warning-subtle",
898
+ "kind": "text",
899
+ "mode": "Light",
900
+ "fgHex": "#af3e0e",
901
+ "bgHex": "#fff4e5",
902
+ "ratio": 5.49,
903
+ "min": 4.5
904
+ },
905
+ {
906
+ "component": "badge",
907
+ "context": "ion-badge--warning",
908
+ "state": "default",
909
+ "fg": "--icon-warning",
910
+ "bg": "--surface-warning-subtle",
911
+ "backdrop": null,
912
+ "kind": "non-text",
913
+ "mode": "Light",
914
+ "fgHex": "#af3e0e",
915
+ "bgHex": "#fff4e5",
916
+ "ratio": 5.49,
917
+ "min": 3
918
+ },
919
+ {
920
+ "component": "alert",
921
+ "context": "ion-alert--solid&ion-alert--error",
922
+ "state": "default",
923
+ "fg": "--text-on-color",
924
+ "bg": "--surface-error",
925
+ "backdrop": "--surface-error",
926
+ "kind": "text",
927
+ "mode": "Dark",
928
+ "fgHex": "#000000",
929
+ "bgHex": "#ef4343",
930
+ "ratio": 5.55,
931
+ "min": 4.5
932
+ },
933
+ {
934
+ "component": "button",
935
+ "context": "ion-button--destructive",
936
+ "state": "default",
937
+ "fg": "--text-on-color",
938
+ "bg": "--surface-error",
939
+ "backdrop": null,
940
+ "kind": "text",
941
+ "mode": "Dark",
942
+ "fgHex": "#000000",
943
+ "bgHex": "#ef4343",
944
+ "ratio": 5.55,
945
+ "min": 4.5
946
+ },
947
+ {
948
+ "component": "alert",
949
+ "context": "ion-alert--error",
950
+ "state": "default",
951
+ "fg": "--text-error",
952
+ "bg": "--surface-error-subtle",
953
+ "backdrop": "--surface-error-subtle",
954
+ "kind": "text",
955
+ "mode": "Dark",
956
+ "fgHex": "#ffadad",
957
+ "bgHex": "#811d1d",
958
+ "ratio": 5.56,
959
+ "min": 4.5
960
+ },
961
+ {
962
+ "component": "alert",
963
+ "context": "ion-alert--solid&ion-alert--success",
964
+ "state": "default",
965
+ "fg": "--text-on-color",
966
+ "bg": "--surface-success",
967
+ "backdrop": "--surface-success",
968
+ "kind": "text",
969
+ "mode": "Dark",
970
+ "fgHex": "#000000",
971
+ "bgHex": "#14994e",
972
+ "ratio": 5.7,
973
+ "min": 4.5
974
+ },
975
+ {
976
+ "component": "button",
977
+ "context": "ion-button--success",
978
+ "state": "default",
979
+ "fg": "--text-on-color",
980
+ "bg": "--surface-success",
981
+ "backdrop": null,
982
+ "kind": "text",
983
+ "mode": "Dark",
984
+ "fgHex": "#000000",
985
+ "bgHex": "#14994e",
986
+ "ratio": 5.7,
987
+ "min": 4.5
988
+ },
989
+ {
990
+ "component": "alert",
991
+ "context": "ion-alert--error",
992
+ "state": "default",
993
+ "fg": "--text-error",
994
+ "bg": "--surface-error-subtle",
995
+ "backdrop": "--surface-error-subtle",
996
+ "kind": "text",
997
+ "mode": "Light",
998
+ "fgHex": "#ba1c1c",
999
+ "bgHex": "#fef1f1",
1000
+ "ratio": 5.83,
1001
+ "min": 4.5
1002
+ },
1003
+ {
1004
+ "component": "alert",
1005
+ "context": "ion-alert--solid&ion-alert--warning",
1006
+ "state": "default",
1007
+ "fg": "--text-on-color",
1008
+ "bg": "--surface-warning",
1009
+ "backdrop": "--surface-warning",
1010
+ "kind": "text",
1011
+ "mode": "Dark",
1012
+ "fgHex": "#000000",
1013
+ "bgHex": "#ea5600",
1014
+ "ratio": 5.83,
1015
+ "min": 4.5
1016
+ },
1017
+ {
1018
+ "component": "avatar",
1019
+ "context": "ion-avatar",
1020
+ "state": "default",
1021
+ "fg": "--text-tertiary",
1022
+ "bg": "--surface-muted",
1023
+ "backdrop": "--surface-muted",
1024
+ "kind": "text",
1025
+ "mode": "Dark",
1026
+ "fgHex": "#9ca3b0",
1027
+ "bgHex": "#1d2735",
1028
+ "ratio": 5.94,
1029
+ "min": 4.5
1030
+ },
1031
+ {
1032
+ "component": "avatar",
1033
+ "context": "ion-avatar--mini",
1034
+ "state": "default",
1035
+ "fg": "--text-tertiary",
1036
+ "bg": "--surface-muted",
1037
+ "backdrop": "--surface-muted",
1038
+ "kind": "text",
1039
+ "mode": "Dark",
1040
+ "fgHex": "#9ca3b0",
1041
+ "bgHex": "#1d2735",
1042
+ "ratio": 5.94,
1043
+ "min": 4.5
1044
+ },
1045
+ {
1046
+ "component": "avatar",
1047
+ "context": "ion-avatar--sm",
1048
+ "state": "default",
1049
+ "fg": "--text-tertiary",
1050
+ "bg": "--surface-muted",
1051
+ "backdrop": "--surface-muted",
1052
+ "kind": "text",
1053
+ "mode": "Dark",
1054
+ "fgHex": "#9ca3b0",
1055
+ "bgHex": "#1d2735",
1056
+ "ratio": 5.94,
1057
+ "min": 4.5
1058
+ },
1059
+ {
1060
+ "component": "avatar",
1061
+ "context": "ion-avatar--lg",
1062
+ "state": "default",
1063
+ "fg": "--text-tertiary",
1064
+ "bg": "--surface-muted",
1065
+ "backdrop": "--surface-muted",
1066
+ "kind": "text",
1067
+ "mode": "Dark",
1068
+ "fgHex": "#9ca3b0",
1069
+ "bgHex": "#1d2735",
1070
+ "ratio": 5.94,
1071
+ "min": 4.5
1072
+ },
1073
+ {
1074
+ "component": "avatar",
1075
+ "context": "ion-avatar--circle",
1076
+ "state": "default",
1077
+ "fg": "--text-tertiary",
1078
+ "bg": "--surface-muted",
1079
+ "backdrop": "--surface-muted",
1080
+ "kind": "text",
1081
+ "mode": "Dark",
1082
+ "fgHex": "#9ca3b0",
1083
+ "bgHex": "#1d2735",
1084
+ "ratio": 5.94,
1085
+ "min": 4.5
1086
+ },
1087
+ {
1088
+ "component": "avatar",
1089
+ "context": "ion-avatar ion-avatar__image",
1090
+ "state": "default",
1091
+ "fg": "--text-tertiary",
1092
+ "bg": "--surface-muted",
1093
+ "backdrop": "--surface-muted",
1094
+ "kind": "text",
1095
+ "mode": "Dark",
1096
+ "fgHex": "#9ca3b0",
1097
+ "bgHex": "#1d2735",
1098
+ "ratio": 5.94,
1099
+ "min": 4.5
1100
+ },
1101
+ {
1102
+ "component": "avatar",
1103
+ "context": "ion-avatar ion-avatar__icon",
1104
+ "state": "default",
1105
+ "fg": "--icon-tertiary",
1106
+ "bg": "--surface-muted",
1107
+ "backdrop": "--surface-muted",
1108
+ "kind": "non-text",
1109
+ "mode": "Dark",
1110
+ "fgHex": "#9ca3b0",
1111
+ "bgHex": "#1d2735",
1112
+ "ratio": 5.94,
1113
+ "min": 3
1114
+ },
1115
+ {
1116
+ "component": "alert",
1117
+ "context": "ion-alert--solid&ion-alert--warning",
1118
+ "state": "default",
1119
+ "fg": "--text-on-color",
1120
+ "bg": "--surface-warning",
1121
+ "backdrop": "--surface-warning",
1122
+ "kind": "text",
1123
+ "mode": "Light",
1124
+ "fgHex": "#ffffff",
1125
+ "bgHex": "#af3e0e",
1126
+ "ratio": 5.97,
1127
+ "min": 4.5
1128
+ },
1129
+ {
1130
+ "component": "alert",
1131
+ "context": "ion-alert ion-alert__dismiss",
1132
+ "state": "hover",
1133
+ "fg": "--icon-information",
1134
+ "bg": "--surface-hover",
1135
+ "backdrop": "--surface-information-subtle",
1136
+ "kind": "non-text",
1137
+ "mode": "Light",
1138
+ "fgHex": "#4f3cc8",
1139
+ "bgHex": "#eae5ec",
1140
+ "compositedOver": "--surface-information-subtle",
1141
+ "ratio": 6.01,
1142
+ "min": 3
1143
+ },
1144
+ {
1145
+ "component": "alert",
1146
+ "context": "ion-alert--warning",
1147
+ "state": "default",
1148
+ "fg": "--text-warning",
1149
+ "bg": "--surface-warning-subtle",
1150
+ "backdrop": "--surface-warning-subtle",
1151
+ "kind": "text",
1152
+ "mode": "Dark",
1153
+ "fgHex": "#ef8539",
1154
+ "bgHex": "#401604",
1155
+ "ratio": 6.06,
1156
+ "min": 4.5
1157
+ },
1158
+ {
1159
+ "component": "badge",
1160
+ "context": "ion-badge--warning",
1161
+ "state": "default",
1162
+ "fg": "--icon-warning",
1163
+ "bg": "--surface-warning-subtle",
1164
+ "backdrop": null,
1165
+ "kind": "non-text",
1166
+ "mode": "Dark",
1167
+ "fgHex": "#ef8539",
1168
+ "bgHex": "#401604",
1169
+ "ratio": 6.06,
1170
+ "min": 3
1171
+ },
1172
+ {
1173
+ "component": "button",
1174
+ "context": "ion-button--destructive",
1175
+ "state": "hover",
1176
+ "fg": "--text-on-color",
1177
+ "bg": "--surface-error-hover",
1178
+ "backdrop": null,
1179
+ "kind": "text",
1180
+ "mode": "Light",
1181
+ "fgHex": "#ffffff",
1182
+ "bgHex": "#ba1c1c",
1183
+ "ratio": 6.42,
1184
+ "min": 4.5
1185
+ },
1186
+ {
1187
+ "component": "alert",
1188
+ "context": "ion-alert ion-alert__icon",
1189
+ "state": "default",
1190
+ "fg": "--icon-information",
1191
+ "bg": "--surface-information-subtle",
1192
+ "backdrop": "--surface-information-subtle",
1193
+ "kind": "non-text",
1194
+ "mode": "Light",
1195
+ "fgHex": "#4f3cc8",
1196
+ "bgHex": "#f6f1f8",
1197
+ "ratio": 6.7,
1198
+ "min": 3
1199
+ },
1200
+ {
1201
+ "component": "alert",
1202
+ "context": "ion-alert ion-alert__dismiss",
1203
+ "state": "default",
1204
+ "fg": "--icon-information",
1205
+ "bg": "--surface-information-subtle",
1206
+ "backdrop": "--surface-information-subtle",
1207
+ "kind": "non-text",
1208
+ "mode": "Light",
1209
+ "fgHex": "#4f3cc8",
1210
+ "bgHex": "#f6f1f8",
1211
+ "ratio": 6.7,
1212
+ "min": 3
1213
+ },
1214
+ {
1215
+ "component": "alert",
1216
+ "context": "ion-alert ion-alert__dismiss",
1217
+ "state": "focus",
1218
+ "fg": "--icon-information",
1219
+ "bg": "--surface-information-subtle",
1220
+ "backdrop": "--surface-information-subtle",
1221
+ "kind": "non-text",
1222
+ "mode": "Light",
1223
+ "fgHex": "#4f3cc8",
1224
+ "bgHex": "#f6f1f8",
1225
+ "ratio": 6.7,
1226
+ "min": 3
1227
+ },
1228
+ {
1229
+ "component": "badge",
1230
+ "context": "ion-badge--information",
1231
+ "state": "default",
1232
+ "fg": "--icon-information",
1233
+ "bg": "--surface-information-subtle",
1234
+ "backdrop": null,
1235
+ "kind": "non-text",
1236
+ "mode": "Light",
1237
+ "fgHex": "#4f3cc8",
1238
+ "bgHex": "#f6f1f8",
1239
+ "ratio": 6.7,
1240
+ "min": 3
1241
+ },
1242
+ {
1243
+ "component": "avatar",
1244
+ "context": "ion-avatar",
1245
+ "state": "default",
1246
+ "fg": "--text-tertiary",
1247
+ "bg": "--surface-muted",
1248
+ "backdrop": "--surface-muted",
1249
+ "kind": "text",
1250
+ "mode": "Light",
1251
+ "fgHex": "#4b5563",
1252
+ "bgHex": "#f0f2f4",
1253
+ "ratio": 6.73,
1254
+ "min": 4.5
1255
+ },
1256
+ {
1257
+ "component": "avatar",
1258
+ "context": "ion-avatar--mini",
1259
+ "state": "default",
1260
+ "fg": "--text-tertiary",
1261
+ "bg": "--surface-muted",
1262
+ "backdrop": "--surface-muted",
1263
+ "kind": "text",
1264
+ "mode": "Light",
1265
+ "fgHex": "#4b5563",
1266
+ "bgHex": "#f0f2f4",
1267
+ "ratio": 6.73,
1268
+ "min": 4.5
1269
+ },
1270
+ {
1271
+ "component": "avatar",
1272
+ "context": "ion-avatar--sm",
1273
+ "state": "default",
1274
+ "fg": "--text-tertiary",
1275
+ "bg": "--surface-muted",
1276
+ "backdrop": "--surface-muted",
1277
+ "kind": "text",
1278
+ "mode": "Light",
1279
+ "fgHex": "#4b5563",
1280
+ "bgHex": "#f0f2f4",
1281
+ "ratio": 6.73,
1282
+ "min": 4.5
1283
+ },
1284
+ {
1285
+ "component": "avatar",
1286
+ "context": "ion-avatar--lg",
1287
+ "state": "default",
1288
+ "fg": "--text-tertiary",
1289
+ "bg": "--surface-muted",
1290
+ "backdrop": "--surface-muted",
1291
+ "kind": "text",
1292
+ "mode": "Light",
1293
+ "fgHex": "#4b5563",
1294
+ "bgHex": "#f0f2f4",
1295
+ "ratio": 6.73,
1296
+ "min": 4.5
1297
+ },
1298
+ {
1299
+ "component": "avatar",
1300
+ "context": "ion-avatar--circle",
1301
+ "state": "default",
1302
+ "fg": "--text-tertiary",
1303
+ "bg": "--surface-muted",
1304
+ "backdrop": "--surface-muted",
1305
+ "kind": "text",
1306
+ "mode": "Light",
1307
+ "fgHex": "#4b5563",
1308
+ "bgHex": "#f0f2f4",
1309
+ "ratio": 6.73,
1310
+ "min": 4.5
1311
+ },
1312
+ {
1313
+ "component": "avatar",
1314
+ "context": "ion-avatar ion-avatar__image",
1315
+ "state": "default",
1316
+ "fg": "--text-tertiary",
1317
+ "bg": "--surface-muted",
1318
+ "backdrop": "--surface-muted",
1319
+ "kind": "text",
1320
+ "mode": "Light",
1321
+ "fgHex": "#4b5563",
1322
+ "bgHex": "#f0f2f4",
1323
+ "ratio": 6.73,
1324
+ "min": 4.5
1325
+ },
1326
+ {
1327
+ "component": "avatar",
1328
+ "context": "ion-avatar ion-avatar__icon",
1329
+ "state": "default",
1330
+ "fg": "--icon-tertiary",
1331
+ "bg": "--surface-muted",
1332
+ "backdrop": "--surface-muted",
1333
+ "kind": "non-text",
1334
+ "mode": "Light",
1335
+ "fgHex": "#4b5563",
1336
+ "bgHex": "#f0f2f4",
1337
+ "ratio": 6.73,
1338
+ "min": 3
1339
+ },
1340
+ {
1341
+ "component": "input",
1342
+ "context": "ion-input ion-input__field",
1343
+ "state": "default",
1344
+ "fg": "--text-tertiary",
1345
+ "bg": "--surface-page",
1346
+ "backdrop": "--surface-page",
1347
+ "kind": "text",
1348
+ "mode": "Dark",
1349
+ "fgHex": "#9ca3b0",
1350
+ "bgHex": "#131923",
1351
+ "ratio": 6.95,
1352
+ "min": 4.5
1353
+ },
1354
+ {
1355
+ "component": "input",
1356
+ "context": "ion-input ion-input__icon-start",
1357
+ "state": "default",
1358
+ "fg": "--icon-tertiary",
1359
+ "bg": "--surface-page",
1360
+ "backdrop": "--surface-page",
1361
+ "kind": "non-text",
1362
+ "mode": "Dark",
1363
+ "fgHex": "#9ca3b0",
1364
+ "bgHex": "#131923",
1365
+ "ratio": 6.95,
1366
+ "min": 3
1367
+ },
1368
+ {
1369
+ "component": "input",
1370
+ "context": "ion-input ion-input__field",
1371
+ "state": "default",
1372
+ "fg": "--text-tertiary",
1373
+ "bg": "--surface-page",
1374
+ "backdrop": "--surface-page",
1375
+ "kind": "text",
1376
+ "mode": "Light",
1377
+ "fgHex": "#4b5563",
1378
+ "bgHex": "#f6f8f9",
1379
+ "ratio": 7.09,
1380
+ "min": 4.5
1381
+ },
1382
+ {
1383
+ "component": "input",
1384
+ "context": "ion-input ion-input__icon-start",
1385
+ "state": "default",
1386
+ "fg": "--icon-tertiary",
1387
+ "bg": "--surface-page",
1388
+ "backdrop": "--surface-page",
1389
+ "kind": "non-text",
1390
+ "mode": "Light",
1391
+ "fgHex": "#4b5563",
1392
+ "bgHex": "#f6f8f9",
1393
+ "ratio": 7.09,
1394
+ "min": 3
1395
+ },
1396
+ {
1397
+ "component": "alert",
1398
+ "context": "ion-alert--success",
1399
+ "state": "default",
1400
+ "fg": "--text-success",
1401
+ "bg": "--surface-success-subtle",
1402
+ "backdrop": "--surface-success-subtle",
1403
+ "kind": "text",
1404
+ "mode": "Light",
1405
+ "fgHex": "#076426",
1406
+ "bgHex": "#f8fefc",
1407
+ "ratio": 7.19,
1408
+ "min": 4.5
1409
+ },
1410
+ {
1411
+ "component": "button",
1412
+ "context": "ion-button--destructive",
1413
+ "state": "hover",
1414
+ "fg": "--text-on-color",
1415
+ "bg": "--surface-error-hover",
1416
+ "backdrop": null,
1417
+ "kind": "text",
1418
+ "mode": "Dark",
1419
+ "fgHex": "#000000",
1420
+ "bgHex": "#f56b6b",
1421
+ "ratio": 7.2,
1422
+ "min": 4.5
1423
+ },
1424
+ {
1425
+ "component": "button",
1426
+ "context": "ion-button--success",
1427
+ "state": "hover",
1428
+ "fg": "--text-on-color",
1429
+ "bg": "--surface-success-hover",
1430
+ "backdrop": null,
1431
+ "kind": "text",
1432
+ "mode": "Light",
1433
+ "fgHex": "#ffffff",
1434
+ "bgHex": "#076426",
1435
+ "ratio": 7.34,
1436
+ "min": 4.5
1437
+ },
1438
+ {
1439
+ "component": "alert",
1440
+ "context": "ion-alert--solid&ion-alert--information",
1441
+ "state": "default",
1442
+ "fg": "--text-on-color",
1443
+ "bg": "--surface-information",
1444
+ "backdrop": "--surface-information",
1445
+ "kind": "text",
1446
+ "mode": "Light",
1447
+ "fgHex": "#ffffff",
1448
+ "bgHex": "#4f3cc8",
1449
+ "ratio": 7.47,
1450
+ "min": 4.5
1451
+ },
1452
+ {
1453
+ "component": "toast",
1454
+ "context": "ion-toast ion-toast__icon",
1455
+ "state": "default",
1456
+ "fg": "--icon-information",
1457
+ "bg": "--surface-raised",
1458
+ "backdrop": "--surface-raised",
1459
+ "kind": "non-text",
1460
+ "mode": "Light",
1461
+ "fgHex": "#4f3cc8",
1462
+ "bgHex": "#ffffff",
1463
+ "ratio": 7.47,
1464
+ "min": 3
1465
+ },
1466
+ {
1467
+ "component": "button",
1468
+ "context": "ion-button--primary-brand",
1469
+ "state": "hover",
1470
+ "fg": "--text-on-color",
1471
+ "bg": "--surface-primary-hover",
1472
+ "backdrop": null,
1473
+ "kind": "text",
1474
+ "mode": "Dark",
1475
+ "fgHex": "#000000",
1476
+ "bgHex": "#609cf0",
1477
+ "ratio": 7.51,
1478
+ "min": 4.5
1479
+ },
1480
+ {
1481
+ "component": "table",
1482
+ "context": "ion-table__cell-content--link ion-table__cell-content--link",
1483
+ "state": "default",
1484
+ "fg": "--text-link",
1485
+ "bg": "--surface-default",
1486
+ "backdrop": "--surface-default",
1487
+ "kind": "text",
1488
+ "mode": "Dark",
1489
+ "fgHex": "#609cf0",
1490
+ "bgHex": "#000000",
1491
+ "ratio": 7.51,
1492
+ "min": 4.5
1493
+ },
1494
+ {
1495
+ "component": "select",
1496
+ "context": "ion-select--placeholder ion-select__field",
1497
+ "state": "default",
1498
+ "fg": "--text-tertiary",
1499
+ "bg": "--surface-default",
1500
+ "backdrop": "--surface-default",
1501
+ "kind": "text",
1502
+ "mode": "Light",
1503
+ "fgHex": "#4b5563",
1504
+ "bgHex": "#ffffff",
1505
+ "ratio": 7.56,
1506
+ "min": 4.5
1507
+ },
1508
+ {
1509
+ "component": "select",
1510
+ "context": "ion-select ion-select__chevron",
1511
+ "state": "default",
1512
+ "fg": "--icon-tertiary",
1513
+ "bg": "--surface-default",
1514
+ "backdrop": "--surface-default",
1515
+ "kind": "non-text",
1516
+ "mode": "Light",
1517
+ "fgHex": "#4b5563",
1518
+ "bgHex": "#ffffff",
1519
+ "ratio": 7.56,
1520
+ "min": 3
1521
+ },
1522
+ {
1523
+ "component": "alert",
1524
+ "context": "ion-alert",
1525
+ "state": "default",
1526
+ "fg": "--text-information",
1527
+ "bg": "--surface-information-subtle",
1528
+ "backdrop": "--surface-information-subtle",
1529
+ "kind": "text",
1530
+ "mode": "Dark",
1531
+ "fgHex": "#adadf5",
1532
+ "bgHex": "#260769",
1533
+ "ratio": 7.65,
1534
+ "min": 4.5
1535
+ },
1536
+ {
1537
+ "component": "alert",
1538
+ "context": "ion-alert--information",
1539
+ "state": "default",
1540
+ "fg": "--text-information",
1541
+ "bg": "--surface-information-subtle",
1542
+ "backdrop": "--surface-information-subtle",
1543
+ "kind": "text",
1544
+ "mode": "Dark",
1545
+ "fgHex": "#adadf5",
1546
+ "bgHex": "#260769",
1547
+ "ratio": 7.65,
1548
+ "min": 4.5
1549
+ },
1550
+ {
1551
+ "component": "alert",
1552
+ "context": "ion-alert--banner",
1553
+ "state": "default",
1554
+ "fg": "--text-information",
1555
+ "bg": "--surface-information-subtle",
1556
+ "backdrop": "--surface-information-subtle",
1557
+ "kind": "text",
1558
+ "mode": "Dark",
1559
+ "fgHex": "#adadf5",
1560
+ "bgHex": "#260769",
1561
+ "ratio": 7.65,
1562
+ "min": 4.5
1563
+ },
1564
+ {
1565
+ "component": "alert",
1566
+ "context": "ion-alert ion-alert__content",
1567
+ "state": "default",
1568
+ "fg": "--text-information",
1569
+ "bg": "--surface-information-subtle",
1570
+ "backdrop": "--surface-information-subtle",
1571
+ "kind": "text",
1572
+ "mode": "Dark",
1573
+ "fgHex": "#adadf5",
1574
+ "bgHex": "#260769",
1575
+ "ratio": 7.65,
1576
+ "min": 4.5
1577
+ },
1578
+ {
1579
+ "component": "alert",
1580
+ "context": "ion-alert ion-alert__title",
1581
+ "state": "default",
1582
+ "fg": "--text-information",
1583
+ "bg": "--surface-information-subtle",
1584
+ "backdrop": "--surface-information-subtle",
1585
+ "kind": "text",
1586
+ "mode": "Dark",
1587
+ "fgHex": "#adadf5",
1588
+ "bgHex": "#260769",
1589
+ "ratio": 7.65,
1590
+ "min": 4.5
1591
+ },
1592
+ {
1593
+ "component": "alert",
1594
+ "context": "ion-alert ion-alert__message",
1595
+ "state": "default",
1596
+ "fg": "--text-information",
1597
+ "bg": "--surface-information-subtle",
1598
+ "backdrop": "--surface-information-subtle",
1599
+ "kind": "text",
1600
+ "mode": "Dark",
1601
+ "fgHex": "#adadf5",
1602
+ "bgHex": "#260769",
1603
+ "ratio": 7.65,
1604
+ "min": 4.5
1605
+ },
1606
+ {
1607
+ "component": "alert",
1608
+ "context": "ion-alert ion-alert__actions",
1609
+ "state": "default",
1610
+ "fg": "--text-information",
1611
+ "bg": "--surface-information-subtle",
1612
+ "backdrop": "--surface-information-subtle",
1613
+ "kind": "text",
1614
+ "mode": "Dark",
1615
+ "fgHex": "#adadf5",
1616
+ "bgHex": "#260769",
1617
+ "ratio": 7.65,
1618
+ "min": 4.5
1619
+ },
1620
+ {
1621
+ "component": "button",
1622
+ "context": "ion-button--success",
1623
+ "state": "hover",
1624
+ "fg": "--text-on-color",
1625
+ "bg": "--surface-success-hover",
1626
+ "backdrop": null,
1627
+ "kind": "text",
1628
+ "mode": "Dark",
1629
+ "fgHex": "#000000",
1630
+ "bgHex": "#39b378",
1631
+ "ratio": 7.89,
1632
+ "min": 4.5
1633
+ },
1634
+ {
1635
+ "component": "alert",
1636
+ "context": "ion-alert--primary",
1637
+ "state": "default",
1638
+ "fg": "--text-link",
1639
+ "bg": "--surface-primary-subtle",
1640
+ "backdrop": "--surface-primary-subtle",
1641
+ "kind": "text",
1642
+ "mode": "Light",
1643
+ "fgHex": "#1541b2",
1644
+ "bgHex": "#ebf7ff",
1645
+ "ratio": 7.93,
1646
+ "min": 4.5
1647
+ },
1648
+ {
1649
+ "component": "select",
1650
+ "context": "ion-select--placeholder ion-select__field",
1651
+ "state": "default",
1652
+ "fg": "--text-tertiary",
1653
+ "bg": "--surface-default",
1654
+ "backdrop": "--surface-default",
1655
+ "kind": "text",
1656
+ "mode": "Dark",
1657
+ "fgHex": "#9ca3b0",
1658
+ "bgHex": "#000000",
1659
+ "ratio": 8.28,
1660
+ "min": 4.5
1661
+ },
1662
+ {
1663
+ "component": "select",
1664
+ "context": "ion-select ion-select__chevron",
1665
+ "state": "default",
1666
+ "fg": "--icon-tertiary",
1667
+ "bg": "--surface-default",
1668
+ "backdrop": "--surface-default",
1669
+ "kind": "non-text",
1670
+ "mode": "Dark",
1671
+ "fgHex": "#9ca3b0",
1672
+ "bgHex": "#000000",
1673
+ "ratio": 8.28,
1674
+ "min": 3
1675
+ },
1676
+ {
1677
+ "component": "button",
1678
+ "context": "ion-button--destructive",
1679
+ "state": "pressed",
1680
+ "fg": "--text-on-color",
1681
+ "bg": "--surface-error-pressed",
1682
+ "backdrop": null,
1683
+ "kind": "text",
1684
+ "mode": "Light",
1685
+ "fgHex": "#ffffff",
1686
+ "bgHex": "#981b1b",
1687
+ "ratio": 8.37,
1688
+ "min": 4.5
1689
+ },
1690
+ {
1691
+ "component": "button",
1692
+ "context": "ion-button--primary-brand",
1693
+ "state": "hover",
1694
+ "fg": "--text-on-color",
1695
+ "bg": "--surface-primary-hover",
1696
+ "backdrop": null,
1697
+ "kind": "text",
1698
+ "mode": "Light",
1699
+ "fgHex": "#ffffff",
1700
+ "bgHex": "#1541b2",
1701
+ "ratio": 8.64,
1702
+ "min": 4.5
1703
+ },
1704
+ {
1705
+ "component": "table",
1706
+ "context": "ion-table__cell-content--link ion-table__cell-content--link",
1707
+ "state": "default",
1708
+ "fg": "--text-link",
1709
+ "bg": "--surface-default",
1710
+ "backdrop": "--surface-default",
1711
+ "kind": "text",
1712
+ "mode": "Light",
1713
+ "fgHex": "#1541b2",
1714
+ "bgHex": "#ffffff",
1715
+ "ratio": 8.64,
1716
+ "min": 4.5
1717
+ },
1718
+ {
1719
+ "component": "toast",
1720
+ "context": "ion-toast ion-toast__action",
1721
+ "state": "default",
1722
+ "fg": "--text-link",
1723
+ "bg": "--surface-raised",
1724
+ "backdrop": "--surface-raised",
1725
+ "kind": "text",
1726
+ "mode": "Light",
1727
+ "fgHex": "#1541b2",
1728
+ "bgHex": "#ffffff",
1729
+ "ratio": 8.64,
1730
+ "min": 4.5
1731
+ },
1732
+ {
1733
+ "component": "toast",
1734
+ "context": "ion-toast ion-toast__action",
1735
+ "state": "focus",
1736
+ "fg": "--text-link",
1737
+ "bg": "--surface-raised",
1738
+ "backdrop": "--surface-raised",
1739
+ "kind": "text",
1740
+ "mode": "Light",
1741
+ "fgHex": "#1541b2",
1742
+ "bgHex": "#ffffff",
1743
+ "ratio": 8.64,
1744
+ "min": 4.5
1745
+ },
1746
+ {
1747
+ "component": "alert",
1748
+ "context": "ion-alert--neutral",
1749
+ "state": "default",
1750
+ "fg": "--text-secondary",
1751
+ "bg": "--surface-muted",
1752
+ "backdrop": "--surface-muted",
1753
+ "kind": "text",
1754
+ "mode": "Light",
1755
+ "fgHex": "#384252",
1756
+ "bgHex": "#f0f2f4",
1757
+ "ratio": 9.04,
1758
+ "min": 4.5
1759
+ },
1760
+ {
1761
+ "component": "badge",
1762
+ "context": "ion-badge--neutral",
1763
+ "state": "default",
1764
+ "fg": "--icon-secondary",
1765
+ "bg": "--surface-muted",
1766
+ "backdrop": null,
1767
+ "kind": "non-text",
1768
+ "mode": "Light",
1769
+ "fgHex": "#384252",
1770
+ "bgHex": "#f0f2f4",
1771
+ "ratio": 9.04,
1772
+ "min": 3
1773
+ },
1774
+ {
1775
+ "component": "button",
1776
+ "context": "ion-button--secondary",
1777
+ "state": "pressed",
1778
+ "fg": "--text-secondary",
1779
+ "bg": "--surface-muted",
1780
+ "backdrop": null,
1781
+ "kind": "text",
1782
+ "mode": "Light",
1783
+ "fgHex": "#384252",
1784
+ "bgHex": "#f0f2f4",
1785
+ "ratio": 9.04,
1786
+ "min": 4.5
1787
+ },
1788
+ {
1789
+ "component": "button",
1790
+ "context": "ion-button--tertiary",
1791
+ "state": "pressed",
1792
+ "fg": "--text-secondary",
1793
+ "bg": "--surface-muted",
1794
+ "backdrop": null,
1795
+ "kind": "text",
1796
+ "mode": "Light",
1797
+ "fgHex": "#384252",
1798
+ "bgHex": "#f0f2f4",
1799
+ "ratio": 9.04,
1800
+ "min": 4.5
1801
+ },
1802
+ {
1803
+ "component": "button",
1804
+ "context": "ion-button--tertiary",
1805
+ "state": "disabled",
1806
+ "fg": "--text-secondary",
1807
+ "bg": "--surface-disabled",
1808
+ "backdrop": null,
1809
+ "kind": "text",
1810
+ "mode": "Light",
1811
+ "fgHex": "#384252",
1812
+ "bgHex": "#f0f2f4",
1813
+ "ratio": 9.04,
1814
+ "min": 4.5
1815
+ },
1816
+ {
1817
+ "component": "scroll-progress",
1818
+ "context": "ion-scroll-progress ion-scroll-progress__heading",
1819
+ "state": "hover",
1820
+ "fg": "--text-secondary",
1821
+ "bg": "--surface-muted",
1822
+ "backdrop": null,
1823
+ "kind": "text",
1824
+ "mode": "Light",
1825
+ "fgHex": "#384252",
1826
+ "bgHex": "#f0f2f4",
1827
+ "ratio": 9.04,
1828
+ "min": 4.5
1829
+ },
1830
+ {
1831
+ "component": "menu",
1832
+ "context": "ion-menu ion-menu__item",
1833
+ "state": "hover",
1834
+ "fg": "--text-secondary",
1835
+ "bg": "--surface-hover",
1836
+ "backdrop": "--surface-default",
1837
+ "kind": "text",
1838
+ "mode": "Light",
1839
+ "fgHex": "#384252",
1840
+ "bgHex": "#f2f2f2",
1841
+ "compositedOver": "--surface-default",
1842
+ "ratio": 9.09,
1843
+ "min": 4.5
1844
+ },
1845
+ {
1846
+ "component": "modal",
1847
+ "context": "ion-modal ion-modal__close",
1848
+ "state": "hover",
1849
+ "fg": "--icon-secondary",
1850
+ "bg": "--surface-hover",
1851
+ "backdrop": "--surface-overlay",
1852
+ "kind": "non-text",
1853
+ "mode": "Light",
1854
+ "fgHex": "#384252",
1855
+ "bgHex": "#f2f2f2",
1856
+ "compositedOver": "--surface-overlay",
1857
+ "ratio": 9.09,
1858
+ "min": 3
1859
+ },
1860
+ {
1861
+ "component": "popover",
1862
+ "context": "ion-popover ion-popover__close",
1863
+ "state": "hover",
1864
+ "fg": "--icon-secondary",
1865
+ "bg": "--surface-hover",
1866
+ "backdrop": "--surface-raised",
1867
+ "kind": "non-text",
1868
+ "mode": "Light",
1869
+ "fgHex": "#384252",
1870
+ "bgHex": "#f2f2f2",
1871
+ "compositedOver": "--surface-raised",
1872
+ "ratio": 9.09,
1873
+ "min": 3
1874
+ },
1875
+ {
1876
+ "component": "table",
1877
+ "context": "ion-table",
1878
+ "state": "hover",
1879
+ "fg": "--text-secondary",
1880
+ "bg": "--surface-hover",
1881
+ "backdrop": "--surface-default",
1882
+ "kind": "text",
1883
+ "mode": "Light",
1884
+ "fgHex": "#384252",
1885
+ "bgHex": "#f2f2f2",
1886
+ "compositedOver": "--surface-default",
1887
+ "ratio": 9.09,
1888
+ "min": 4.5
1889
+ },
1890
+ {
1891
+ "component": "toast",
1892
+ "context": "ion-toast ion-toast__dismiss",
1893
+ "state": "hover",
1894
+ "fg": "--icon-secondary",
1895
+ "bg": "--surface-hover",
1896
+ "backdrop": "--surface-raised",
1897
+ "kind": "non-text",
1898
+ "mode": "Light",
1899
+ "fgHex": "#384252",
1900
+ "bgHex": "#f2f2f2",
1901
+ "compositedOver": "--surface-raised",
1902
+ "ratio": 9.09,
1903
+ "min": 3
1904
+ },
1905
+ {
1906
+ "component": "table",
1907
+ "context": "ion-table",
1908
+ "state": "selected",
1909
+ "fg": "--text-secondary",
1910
+ "bg": "--surface-primary-subtle",
1911
+ "backdrop": "--surface-default",
1912
+ "kind": "text",
1913
+ "mode": "Light",
1914
+ "fgHex": "#384252",
1915
+ "bgHex": "#ebf7ff",
1916
+ "ratio": 9.32,
1917
+ "min": 4.5
1918
+ },
1919
+ {
1920
+ "component": "alert",
1921
+ "context": "ion-alert",
1922
+ "state": "default",
1923
+ "fg": "--text-information",
1924
+ "bg": "--surface-information-subtle",
1925
+ "backdrop": "--surface-information-subtle",
1926
+ "kind": "text",
1927
+ "mode": "Light",
1928
+ "fgHex": "#4715b2",
1929
+ "bgHex": "#f6f1f8",
1930
+ "ratio": 9.34,
1931
+ "min": 4.5
1932
+ },
1933
+ {
1934
+ "component": "alert",
1935
+ "context": "ion-alert--information",
1936
+ "state": "default",
1937
+ "fg": "--text-information",
1938
+ "bg": "--surface-information-subtle",
1939
+ "backdrop": "--surface-information-subtle",
1940
+ "kind": "text",
1941
+ "mode": "Light",
1942
+ "fgHex": "#4715b2",
1943
+ "bgHex": "#f6f1f8",
1944
+ "ratio": 9.34,
1945
+ "min": 4.5
1946
+ },
1947
+ {
1948
+ "component": "alert",
1949
+ "context": "ion-alert--banner",
1950
+ "state": "default",
1951
+ "fg": "--text-information",
1952
+ "bg": "--surface-information-subtle",
1953
+ "backdrop": "--surface-information-subtle",
1954
+ "kind": "text",
1955
+ "mode": "Light",
1956
+ "fgHex": "#4715b2",
1957
+ "bgHex": "#f6f1f8",
1958
+ "ratio": 9.34,
1959
+ "min": 4.5
1960
+ },
1961
+ {
1962
+ "component": "alert",
1963
+ "context": "ion-alert ion-alert__content",
1964
+ "state": "default",
1965
+ "fg": "--text-information",
1966
+ "bg": "--surface-information-subtle",
1967
+ "backdrop": "--surface-information-subtle",
1968
+ "kind": "text",
1969
+ "mode": "Light",
1970
+ "fgHex": "#4715b2",
1971
+ "bgHex": "#f6f1f8",
1972
+ "ratio": 9.34,
1973
+ "min": 4.5
1974
+ },
1975
+ {
1976
+ "component": "alert",
1977
+ "context": "ion-alert ion-alert__title",
1978
+ "state": "default",
1979
+ "fg": "--text-information",
1980
+ "bg": "--surface-information-subtle",
1981
+ "backdrop": "--surface-information-subtle",
1982
+ "kind": "text",
1983
+ "mode": "Light",
1984
+ "fgHex": "#4715b2",
1985
+ "bgHex": "#f6f1f8",
1986
+ "ratio": 9.34,
1987
+ "min": 4.5
1988
+ },
1989
+ {
1990
+ "component": "alert",
1991
+ "context": "ion-alert ion-alert__message",
1992
+ "state": "default",
1993
+ "fg": "--text-information",
1994
+ "bg": "--surface-information-subtle",
1995
+ "backdrop": "--surface-information-subtle",
1996
+ "kind": "text",
1997
+ "mode": "Light",
1998
+ "fgHex": "#4715b2",
1999
+ "bgHex": "#f6f1f8",
2000
+ "ratio": 9.34,
2001
+ "min": 4.5
2002
+ },
2003
+ {
2004
+ "component": "alert",
2005
+ "context": "ion-alert ion-alert__actions",
2006
+ "state": "default",
2007
+ "fg": "--text-information",
2008
+ "bg": "--surface-information-subtle",
2009
+ "backdrop": "--surface-information-subtle",
2010
+ "kind": "text",
2011
+ "mode": "Light",
2012
+ "fgHex": "#4715b2",
2013
+ "bgHex": "#f6f1f8",
2014
+ "ratio": 9.34,
2015
+ "min": 4.5
2016
+ },
2017
+ {
2018
+ "component": "button",
2019
+ "context": "ion-button--secondary",
2020
+ "state": "hover",
2021
+ "fg": "--text-secondary",
2022
+ "bg": "--surface-page",
2023
+ "backdrop": null,
2024
+ "kind": "text",
2025
+ "mode": "Light",
2026
+ "fgHex": "#384252",
2027
+ "bgHex": "#f6f8f9",
2028
+ "ratio": 9.53,
2029
+ "min": 4.5
2030
+ },
2031
+ {
2032
+ "component": "button",
2033
+ "context": "ion-button--tertiary",
2034
+ "state": "hover",
2035
+ "fg": "--text-secondary",
2036
+ "bg": "--surface-page",
2037
+ "backdrop": null,
2038
+ "kind": "text",
2039
+ "mode": "Light",
2040
+ "fgHex": "#384252",
2041
+ "bgHex": "#f6f8f9",
2042
+ "ratio": 9.53,
2043
+ "min": 4.5
2044
+ },
2045
+ {
2046
+ "component": "input",
2047
+ "context": "ion-input ion-input__icon-end",
2048
+ "state": "default",
2049
+ "fg": "--icon-interactive",
2050
+ "bg": "--surface-page",
2051
+ "backdrop": "--surface-page",
2052
+ "kind": "non-text",
2053
+ "mode": "Light",
2054
+ "fgHex": "#384252",
2055
+ "bgHex": "#f6f8f9",
2056
+ "ratio": 9.53,
2057
+ "min": 3
2058
+ },
2059
+ {
2060
+ "component": "phone-input",
2061
+ "context": "ion-phone-input ion-phone-input__country",
2062
+ "state": "default",
2063
+ "fg": "--text-secondary",
2064
+ "bg": "--surface-page",
2065
+ "backdrop": null,
2066
+ "kind": "text",
2067
+ "mode": "Light",
2068
+ "fgHex": "#384252",
2069
+ "bgHex": "#f6f8f9",
2070
+ "ratio": 9.53,
2071
+ "min": 4.5
2072
+ },
2073
+ {
2074
+ "component": "phone-input",
2075
+ "context": "ion-phone-input ion-phone-input__country",
2076
+ "state": "hover",
2077
+ "fg": "--text-secondary",
2078
+ "bg": "--surface-page",
2079
+ "backdrop": null,
2080
+ "kind": "text",
2081
+ "mode": "Light",
2082
+ "fgHex": "#384252",
2083
+ "bgHex": "#f6f8f9",
2084
+ "ratio": 9.53,
2085
+ "min": 4.5
2086
+ },
2087
+ {
2088
+ "component": "phone-input",
2089
+ "context": "ion-phone-input ion-phone-input__country",
2090
+ "state": "focus",
2091
+ "fg": "--text-secondary",
2092
+ "bg": "--surface-page",
2093
+ "backdrop": null,
2094
+ "kind": "text",
2095
+ "mode": "Light",
2096
+ "fgHex": "#384252",
2097
+ "bgHex": "#f6f8f9",
2098
+ "ratio": 9.53,
2099
+ "min": 4.5
2100
+ },
2101
+ {
2102
+ "component": "table",
2103
+ "context": "ion-table--striped",
2104
+ "state": "default",
2105
+ "fg": "--text-secondary",
2106
+ "bg": "--surface-page",
2107
+ "backdrop": "--surface-default",
2108
+ "kind": "text",
2109
+ "mode": "Light",
2110
+ "fgHex": "#384252",
2111
+ "bgHex": "#f6f8f9",
2112
+ "ratio": 9.53,
2113
+ "min": 4.5
2114
+ },
2115
+ {
2116
+ "component": "toast",
2117
+ "context": "ion-toast ion-toast__action",
2118
+ "state": "hover",
2119
+ "fg": "--text-link-hover",
2120
+ "bg": "--surface-raised",
2121
+ "backdrop": "--surface-raised",
2122
+ "kind": "text",
2123
+ "mode": "Dark",
2124
+ "fgHex": "#9fd5f9",
2125
+ "bgHex": "#1d2735",
2126
+ "ratio": 9.58,
2127
+ "min": 4.5
2128
+ },
2129
+ {
2130
+ "component": "popover",
2131
+ "context": "ion-popover ion-popover__close",
2132
+ "state": "hover",
2133
+ "fg": "--icon-secondary",
2134
+ "bg": "--surface-hover",
2135
+ "backdrop": "--surface-raised",
2136
+ "kind": "non-text",
2137
+ "mode": "Dark",
2138
+ "fgHex": "#dde0e4",
2139
+ "bgHex": "#28323f",
2140
+ "compositedOver": "--surface-raised",
2141
+ "ratio": 9.81,
2142
+ "min": 3
2143
+ },
2144
+ {
2145
+ "component": "toast",
2146
+ "context": "ion-toast ion-toast__dismiss",
2147
+ "state": "hover",
2148
+ "fg": "--icon-secondary",
2149
+ "bg": "--surface-hover",
2150
+ "backdrop": "--surface-raised",
2151
+ "kind": "non-text",
2152
+ "mode": "Dark",
2153
+ "fgHex": "#dde0e4",
2154
+ "bgHex": "#28323f",
2155
+ "compositedOver": "--surface-raised",
2156
+ "ratio": 9.81,
2157
+ "min": 3
2158
+ },
2159
+ {
2160
+ "component": "button",
2161
+ "context": "ion-button--success",
2162
+ "state": "pressed",
2163
+ "fg": "--text-on-color",
2164
+ "bg": "--surface-success-pressed",
2165
+ "backdrop": null,
2166
+ "kind": "text",
2167
+ "mode": "Light",
2168
+ "fgHex": "#ffffff",
2169
+ "bgHex": "#054d1a",
2170
+ "ratio": 10.08,
2171
+ "min": 4.5
2172
+ },
2173
+ {
2174
+ "component": "button",
2175
+ "context": "ion-button--primary-neutral",
2176
+ "state": "hover",
2177
+ "fg": "--text-on-color",
2178
+ "bg": "--surface-inverse-subtle",
2179
+ "backdrop": null,
2180
+ "kind": "text",
2181
+ "mode": "Light",
2182
+ "fgHex": "#ffffff",
2183
+ "bgHex": "#384252",
2184
+ "ratio": 10.15,
2185
+ "min": 4.5
2186
+ },
2187
+ {
2188
+ "component": "button",
2189
+ "context": "ion-button--secondary",
2190
+ "state": "default",
2191
+ "fg": "--text-secondary",
2192
+ "bg": "--surface-default",
2193
+ "backdrop": null,
2194
+ "kind": "text",
2195
+ "mode": "Light",
2196
+ "fgHex": "#384252",
2197
+ "bgHex": "#ffffff",
2198
+ "ratio": 10.15,
2199
+ "min": 4.5
2200
+ },
2201
+ {
2202
+ "component": "menu",
2203
+ "context": "ion-menu ion-menu__item",
2204
+ "state": "default",
2205
+ "fg": "--text-secondary",
2206
+ "bg": "--surface-default",
2207
+ "backdrop": "--surface-default",
2208
+ "kind": "text",
2209
+ "mode": "Light",
2210
+ "fgHex": "#384252",
2211
+ "bgHex": "#ffffff",
2212
+ "ratio": 10.15,
2213
+ "min": 4.5
2214
+ },
2215
+ {
2216
+ "component": "menu",
2217
+ "context": "ion-menu ion-menu__item",
2218
+ "state": "focus",
2219
+ "fg": "--text-secondary",
2220
+ "bg": "--surface-default",
2221
+ "backdrop": "--surface-default",
2222
+ "kind": "text",
2223
+ "mode": "Light",
2224
+ "fgHex": "#384252",
2225
+ "bgHex": "#ffffff",
2226
+ "ratio": 10.15,
2227
+ "min": 4.5
2228
+ },
2229
+ {
2230
+ "component": "modal",
2231
+ "context": "ion-modal ion-modal__description",
2232
+ "state": "default",
2233
+ "fg": "--text-secondary",
2234
+ "bg": "--surface-overlay",
2235
+ "backdrop": "--surface-overlay",
2236
+ "kind": "text",
2237
+ "mode": "Light",
2238
+ "fgHex": "#384252",
2239
+ "bgHex": "#ffffff",
2240
+ "ratio": 10.15,
2241
+ "min": 4.5
2242
+ },
2243
+ {
2244
+ "component": "modal",
2245
+ "context": "ion-modal ion-modal__close",
2246
+ "state": "default",
2247
+ "fg": "--icon-secondary",
2248
+ "bg": "--surface-overlay",
2249
+ "backdrop": "--surface-overlay",
2250
+ "kind": "non-text",
2251
+ "mode": "Light",
2252
+ "fgHex": "#384252",
2253
+ "bgHex": "#ffffff",
2254
+ "ratio": 10.15,
2255
+ "min": 3
2256
+ },
2257
+ {
2258
+ "component": "modal",
2259
+ "context": "ion-modal ion-modal__close",
2260
+ "state": "focus",
2261
+ "fg": "--icon-secondary",
2262
+ "bg": "--surface-overlay",
2263
+ "backdrop": "--surface-overlay",
2264
+ "kind": "non-text",
2265
+ "mode": "Light",
2266
+ "fgHex": "#384252",
2267
+ "bgHex": "#ffffff",
2268
+ "ratio": 10.15,
2269
+ "min": 3
2270
+ },
2271
+ {
2272
+ "component": "modal",
2273
+ "context": "ion-modal ion-modal__body",
2274
+ "state": "default",
2275
+ "fg": "--text-secondary",
2276
+ "bg": "--surface-overlay",
2277
+ "backdrop": "--surface-overlay",
2278
+ "kind": "text",
2279
+ "mode": "Light",
2280
+ "fgHex": "#384252",
2281
+ "bgHex": "#ffffff",
2282
+ "ratio": 10.15,
2283
+ "min": 4.5
2284
+ },
2285
+ {
2286
+ "component": "modal",
2287
+ "context": "ion-modal--center ion-modal__body",
2288
+ "state": "default",
2289
+ "fg": "--text-secondary",
2290
+ "bg": "--surface-overlay",
2291
+ "backdrop": "--surface-overlay",
2292
+ "kind": "text",
2293
+ "mode": "Light",
2294
+ "fgHex": "#384252",
2295
+ "bgHex": "#ffffff",
2296
+ "ratio": 10.15,
2297
+ "min": 4.5
2298
+ },
2299
+ {
2300
+ "component": "popover",
2301
+ "context": "ion-popover ion-popover__close",
2302
+ "state": "default",
2303
+ "fg": "--icon-secondary",
2304
+ "bg": "--surface-raised",
2305
+ "backdrop": "--surface-raised",
2306
+ "kind": "non-text",
2307
+ "mode": "Light",
2308
+ "fgHex": "#384252",
2309
+ "bgHex": "#ffffff",
2310
+ "ratio": 10.15,
2311
+ "min": 3
2312
+ },
2313
+ {
2314
+ "component": "popover",
2315
+ "context": "ion-popover ion-popover__close",
2316
+ "state": "focus",
2317
+ "fg": "--icon-secondary",
2318
+ "bg": "--surface-raised",
2319
+ "backdrop": "--surface-raised",
2320
+ "kind": "non-text",
2321
+ "mode": "Light",
2322
+ "fgHex": "#384252",
2323
+ "bgHex": "#ffffff",
2324
+ "ratio": 10.15,
2325
+ "min": 3
2326
+ },
2327
+ {
2328
+ "component": "popover",
2329
+ "context": "ion-popover ion-popover__body",
2330
+ "state": "default",
2331
+ "fg": "--text-secondary",
2332
+ "bg": "--surface-raised",
2333
+ "backdrop": "--surface-raised",
2334
+ "kind": "text",
2335
+ "mode": "Light",
2336
+ "fgHex": "#384252",
2337
+ "bgHex": "#ffffff",
2338
+ "ratio": 10.15,
2339
+ "min": 4.5
2340
+ },
2341
+ {
2342
+ "component": "select",
2343
+ "context": "ion-select ion-select__field",
2344
+ "state": "default",
2345
+ "fg": "--text-secondary",
2346
+ "bg": "--surface-default",
2347
+ "backdrop": "--surface-default",
2348
+ "kind": "text",
2349
+ "mode": "Light",
2350
+ "fgHex": "#384252",
2351
+ "bgHex": "#ffffff",
2352
+ "ratio": 10.15,
2353
+ "min": 4.5
2354
+ },
2355
+ {
2356
+ "component": "table",
2357
+ "context": "ion-table",
2358
+ "state": "default",
2359
+ "fg": "--text-secondary",
2360
+ "bg": "--surface-default",
2361
+ "backdrop": "--surface-default",
2362
+ "kind": "text",
2363
+ "mode": "Light",
2364
+ "fgHex": "#384252",
2365
+ "bgHex": "#ffffff",
2366
+ "ratio": 10.15,
2367
+ "min": 4.5
2368
+ },
2369
+ {
2370
+ "component": "table",
2371
+ "context": "ion-table--compact",
2372
+ "state": "default",
2373
+ "fg": "--text-secondary",
2374
+ "bg": "--surface-default",
2375
+ "backdrop": "--surface-default",
2376
+ "kind": "text",
2377
+ "mode": "Light",
2378
+ "fgHex": "#384252",
2379
+ "bgHex": "#ffffff",
2380
+ "ratio": 10.15,
2381
+ "min": 4.5
2382
+ },
2383
+ {
2384
+ "component": "table",
2385
+ "context": "ion-table--relaxed",
2386
+ "state": "default",
2387
+ "fg": "--text-secondary",
2388
+ "bg": "--surface-default",
2389
+ "backdrop": "--surface-default",
2390
+ "kind": "text",
2391
+ "mode": "Light",
2392
+ "fgHex": "#384252",
2393
+ "bgHex": "#ffffff",
2394
+ "ratio": 10.15,
2395
+ "min": 4.5
2396
+ },
2397
+ {
2398
+ "component": "table",
2399
+ "context": "ion-table ion-table__cell-content",
2400
+ "state": "default",
2401
+ "fg": "--text-secondary",
2402
+ "bg": "--surface-default",
2403
+ "backdrop": "--surface-default",
2404
+ "kind": "text",
2405
+ "mode": "Light",
2406
+ "fgHex": "#384252",
2407
+ "bgHex": "#ffffff",
2408
+ "ratio": 10.15,
2409
+ "min": 4.5
2410
+ },
2411
+ {
2412
+ "component": "table",
2413
+ "context": "ion-table ion-table__cell-icon",
2414
+ "state": "default",
2415
+ "fg": "--icon-interactive",
2416
+ "bg": "--surface-default",
2417
+ "backdrop": "--surface-default",
2418
+ "kind": "non-text",
2419
+ "mode": "Light",
2420
+ "fgHex": "#384252",
2421
+ "bgHex": "#ffffff",
2422
+ "ratio": 10.15,
2423
+ "min": 3
2424
+ },
2425
+ {
2426
+ "component": "table",
2427
+ "context": "ion-table__cell-icon--trailing ion-table__cell-icon--trailing",
2428
+ "state": "default",
2429
+ "fg": "--icon-secondary",
2430
+ "bg": "--surface-default",
2431
+ "backdrop": "--surface-default",
2432
+ "kind": "non-text",
2433
+ "mode": "Light",
2434
+ "fgHex": "#384252",
2435
+ "bgHex": "#ffffff",
2436
+ "ratio": 10.15,
2437
+ "min": 3
2438
+ },
2439
+ {
2440
+ "component": "toast",
2441
+ "context": "ion-toast ion-toast__message",
2442
+ "state": "default",
2443
+ "fg": "--text-secondary",
2444
+ "bg": "--surface-raised",
2445
+ "backdrop": "--surface-raised",
2446
+ "kind": "text",
2447
+ "mode": "Light",
2448
+ "fgHex": "#384252",
2449
+ "bgHex": "#ffffff",
2450
+ "ratio": 10.15,
2451
+ "min": 4.5
2452
+ },
2453
+ {
2454
+ "component": "toast",
2455
+ "context": "ion-toast ion-toast__dismiss",
2456
+ "state": "default",
2457
+ "fg": "--icon-secondary",
2458
+ "bg": "--surface-raised",
2459
+ "backdrop": "--surface-raised",
2460
+ "kind": "non-text",
2461
+ "mode": "Light",
2462
+ "fgHex": "#384252",
2463
+ "bgHex": "#ffffff",
2464
+ "ratio": 10.15,
2465
+ "min": 3
2466
+ },
2467
+ {
2468
+ "component": "toast",
2469
+ "context": "ion-toast ion-toast__dismiss",
2470
+ "state": "focus",
2471
+ "fg": "--icon-secondary",
2472
+ "bg": "--surface-raised",
2473
+ "backdrop": "--surface-raised",
2474
+ "kind": "non-text",
2475
+ "mode": "Light",
2476
+ "fgHex": "#384252",
2477
+ "bgHex": "#ffffff",
2478
+ "ratio": 10.15,
2479
+ "min": 3
2480
+ },
2481
+ {
2482
+ "component": "table",
2483
+ "context": "ion-table",
2484
+ "state": "selected",
2485
+ "fg": "--text-secondary",
2486
+ "bg": "--surface-primary-subtle",
2487
+ "backdrop": "--surface-default",
2488
+ "kind": "text",
2489
+ "mode": "Dark",
2490
+ "fgHex": "#dde0e4",
2491
+ "bgHex": "#071e69",
2492
+ "ratio": 11.34,
2493
+ "min": 4.5
2494
+ },
2495
+ {
2496
+ "component": "alert",
2497
+ "context": "ion-alert--neutral",
2498
+ "state": "default",
2499
+ "fg": "--text-secondary",
2500
+ "bg": "--surface-muted",
2501
+ "backdrop": "--surface-muted",
2502
+ "kind": "text",
2503
+ "mode": "Dark",
2504
+ "fgHex": "#dde0e4",
2505
+ "bgHex": "#1d2735",
2506
+ "ratio": 11.38,
2507
+ "min": 4.5
2508
+ },
2509
+ {
2510
+ "component": "badge",
2511
+ "context": "ion-badge--neutral",
2512
+ "state": "default",
2513
+ "fg": "--icon-secondary",
2514
+ "bg": "--surface-muted",
2515
+ "backdrop": null,
2516
+ "kind": "non-text",
2517
+ "mode": "Dark",
2518
+ "fgHex": "#dde0e4",
2519
+ "bgHex": "#1d2735",
2520
+ "ratio": 11.38,
2521
+ "min": 3
2522
+ },
2523
+ {
2524
+ "component": "button",
2525
+ "context": "ion-button--secondary",
2526
+ "state": "pressed",
2527
+ "fg": "--text-secondary",
2528
+ "bg": "--surface-muted",
2529
+ "backdrop": null,
2530
+ "kind": "text",
2531
+ "mode": "Dark",
2532
+ "fgHex": "#dde0e4",
2533
+ "bgHex": "#1d2735",
2534
+ "ratio": 11.38,
2535
+ "min": 4.5
2536
+ },
2537
+ {
2538
+ "component": "button",
2539
+ "context": "ion-button--tertiary",
2540
+ "state": "pressed",
2541
+ "fg": "--text-secondary",
2542
+ "bg": "--surface-muted",
2543
+ "backdrop": null,
2544
+ "kind": "text",
2545
+ "mode": "Dark",
2546
+ "fgHex": "#dde0e4",
2547
+ "bgHex": "#1d2735",
2548
+ "ratio": 11.38,
2549
+ "min": 4.5
2550
+ },
2551
+ {
2552
+ "component": "button",
2553
+ "context": "ion-button--tertiary",
2554
+ "state": "disabled",
2555
+ "fg": "--text-secondary",
2556
+ "bg": "--surface-disabled",
2557
+ "backdrop": null,
2558
+ "kind": "text",
2559
+ "mode": "Dark",
2560
+ "fgHex": "#dde0e4",
2561
+ "bgHex": "#1d2735",
2562
+ "ratio": 11.38,
2563
+ "min": 4.5
2564
+ },
2565
+ {
2566
+ "component": "popover",
2567
+ "context": "ion-popover ion-popover__close",
2568
+ "state": "default",
2569
+ "fg": "--icon-secondary",
2570
+ "bg": "--surface-raised",
2571
+ "backdrop": "--surface-raised",
2572
+ "kind": "non-text",
2573
+ "mode": "Dark",
2574
+ "fgHex": "#dde0e4",
2575
+ "bgHex": "#1d2735",
2576
+ "ratio": 11.38,
2577
+ "min": 3
2578
+ },
2579
+ {
2580
+ "component": "popover",
2581
+ "context": "ion-popover ion-popover__close",
2582
+ "state": "focus",
2583
+ "fg": "--icon-secondary",
2584
+ "bg": "--surface-raised",
2585
+ "backdrop": "--surface-raised",
2586
+ "kind": "non-text",
2587
+ "mode": "Dark",
2588
+ "fgHex": "#dde0e4",
2589
+ "bgHex": "#1d2735",
2590
+ "ratio": 11.38,
2591
+ "min": 3
2592
+ },
2593
+ {
2594
+ "component": "popover",
2595
+ "context": "ion-popover ion-popover__body",
2596
+ "state": "default",
2597
+ "fg": "--text-secondary",
2598
+ "bg": "--surface-raised",
2599
+ "backdrop": "--surface-raised",
2600
+ "kind": "text",
2601
+ "mode": "Dark",
2602
+ "fgHex": "#dde0e4",
2603
+ "bgHex": "#1d2735",
2604
+ "ratio": 11.38,
2605
+ "min": 4.5
2606
+ },
2607
+ {
2608
+ "component": "scroll-progress",
2609
+ "context": "ion-scroll-progress ion-scroll-progress__heading",
2610
+ "state": "hover",
2611
+ "fg": "--text-secondary",
2612
+ "bg": "--surface-muted",
2613
+ "backdrop": null,
2614
+ "kind": "text",
2615
+ "mode": "Dark",
2616
+ "fgHex": "#dde0e4",
2617
+ "bgHex": "#1d2735",
2618
+ "ratio": 11.38,
2619
+ "min": 4.5
2620
+ },
2621
+ {
2622
+ "component": "toast",
2623
+ "context": "ion-toast ion-toast__message",
2624
+ "state": "default",
2625
+ "fg": "--text-secondary",
2626
+ "bg": "--surface-raised",
2627
+ "backdrop": "--surface-raised",
2628
+ "kind": "text",
2629
+ "mode": "Dark",
2630
+ "fgHex": "#dde0e4",
2631
+ "bgHex": "#1d2735",
2632
+ "ratio": 11.38,
2633
+ "min": 4.5
2634
+ },
2635
+ {
2636
+ "component": "toast",
2637
+ "context": "ion-toast ion-toast__dismiss",
2638
+ "state": "default",
2639
+ "fg": "--icon-secondary",
2640
+ "bg": "--surface-raised",
2641
+ "backdrop": "--surface-raised",
2642
+ "kind": "non-text",
2643
+ "mode": "Dark",
2644
+ "fgHex": "#dde0e4",
2645
+ "bgHex": "#1d2735",
2646
+ "ratio": 11.38,
2647
+ "min": 3
2648
+ },
2649
+ {
2650
+ "component": "toast",
2651
+ "context": "ion-toast ion-toast__dismiss",
2652
+ "state": "focus",
2653
+ "fg": "--icon-secondary",
2654
+ "bg": "--surface-raised",
2655
+ "backdrop": "--surface-raised",
2656
+ "kind": "non-text",
2657
+ "mode": "Dark",
2658
+ "fgHex": "#dde0e4",
2659
+ "bgHex": "#1d2735",
2660
+ "ratio": 11.38,
2661
+ "min": 3
2662
+ },
2663
+ {
2664
+ "component": "button",
2665
+ "context": "ion-button--destructive",
2666
+ "state": "pressed",
2667
+ "fg": "--text-on-color",
2668
+ "bg": "--surface-error-pressed",
2669
+ "backdrop": null,
2670
+ "kind": "text",
2671
+ "mode": "Dark",
2672
+ "fgHex": "#000000",
2673
+ "bgHex": "#ffadad",
2674
+ "ratio": 11.83,
2675
+ "min": 4.5
2676
+ },
2677
+ {
2678
+ "component": "button",
2679
+ "context": "ion-button--primary-brand",
2680
+ "state": "pressed",
2681
+ "fg": "--text-on-color",
2682
+ "bg": "--surface-primary-pressed",
2683
+ "backdrop": null,
2684
+ "kind": "text",
2685
+ "mode": "Light",
2686
+ "fgHex": "#ffffff",
2687
+ "bgHex": "#0e2d8b",
2688
+ "ratio": 11.89,
2689
+ "min": 4.5
2690
+ },
2691
+ {
2692
+ "component": "toast",
2693
+ "context": "ion-toast ion-toast__action",
2694
+ "state": "hover",
2695
+ "fg": "--text-link-hover",
2696
+ "bg": "--surface-raised",
2697
+ "backdrop": "--surface-raised",
2698
+ "kind": "text",
2699
+ "mode": "Light",
2700
+ "fgHex": "#0e2d8b",
2701
+ "bgHex": "#ffffff",
2702
+ "ratio": 11.89,
2703
+ "min": 4.5
2704
+ },
2705
+ {
2706
+ "component": "button",
2707
+ "context": "ion-button--success",
2708
+ "state": "pressed",
2709
+ "fg": "--text-on-color",
2710
+ "bg": "--surface-success-pressed",
2711
+ "backdrop": null,
2712
+ "kind": "text",
2713
+ "mode": "Dark",
2714
+ "fgHex": "#000000",
2715
+ "bgHex": "#82d8b4",
2716
+ "ratio": 12.43,
2717
+ "min": 4.5
2718
+ },
2719
+ {
2720
+ "component": "button",
2721
+ "context": "ion-button--secondary",
2722
+ "state": "hover",
2723
+ "fg": "--text-secondary",
2724
+ "bg": "--surface-page",
2725
+ "backdrop": null,
2726
+ "kind": "text",
2727
+ "mode": "Dark",
2728
+ "fgHex": "#dde0e4",
2729
+ "bgHex": "#131923",
2730
+ "ratio": 13.31,
2731
+ "min": 4.5
2732
+ },
2733
+ {
2734
+ "component": "button",
2735
+ "context": "ion-button--tertiary",
2736
+ "state": "hover",
2737
+ "fg": "--text-secondary",
2738
+ "bg": "--surface-page",
2739
+ "backdrop": null,
2740
+ "kind": "text",
2741
+ "mode": "Dark",
2742
+ "fgHex": "#dde0e4",
2743
+ "bgHex": "#131923",
2744
+ "ratio": 13.31,
2745
+ "min": 4.5
2746
+ },
2747
+ {
2748
+ "component": "input",
2749
+ "context": "ion-input ion-input__icon-end",
2750
+ "state": "default",
2751
+ "fg": "--icon-interactive",
2752
+ "bg": "--surface-page",
2753
+ "backdrop": "--surface-page",
2754
+ "kind": "non-text",
2755
+ "mode": "Dark",
2756
+ "fgHex": "#dde0e4",
2757
+ "bgHex": "#131923",
2758
+ "ratio": 13.31,
2759
+ "min": 3
2760
+ },
2761
+ {
2762
+ "component": "phone-input",
2763
+ "context": "ion-phone-input ion-phone-input__country",
2764
+ "state": "default",
2765
+ "fg": "--text-secondary",
2766
+ "bg": "--surface-page",
2767
+ "backdrop": null,
2768
+ "kind": "text",
2769
+ "mode": "Dark",
2770
+ "fgHex": "#dde0e4",
2771
+ "bgHex": "#131923",
2772
+ "ratio": 13.31,
2773
+ "min": 4.5
2774
+ },
2775
+ {
2776
+ "component": "phone-input",
2777
+ "context": "ion-phone-input ion-phone-input__country",
2778
+ "state": "hover",
2779
+ "fg": "--text-secondary",
2780
+ "bg": "--surface-page",
2781
+ "backdrop": null,
2782
+ "kind": "text",
2783
+ "mode": "Dark",
2784
+ "fgHex": "#dde0e4",
2785
+ "bgHex": "#131923",
2786
+ "ratio": 13.31,
2787
+ "min": 4.5
2788
+ },
2789
+ {
2790
+ "component": "phone-input",
2791
+ "context": "ion-phone-input ion-phone-input__country",
2792
+ "state": "focus",
2793
+ "fg": "--text-secondary",
2794
+ "bg": "--surface-page",
2795
+ "backdrop": null,
2796
+ "kind": "text",
2797
+ "mode": "Dark",
2798
+ "fgHex": "#dde0e4",
2799
+ "bgHex": "#131923",
2800
+ "ratio": 13.31,
2801
+ "min": 4.5
2802
+ },
2803
+ {
2804
+ "component": "table",
2805
+ "context": "ion-table--striped",
2806
+ "state": "default",
2807
+ "fg": "--text-secondary",
2808
+ "bg": "--surface-page",
2809
+ "backdrop": "--surface-default",
2810
+ "kind": "text",
2811
+ "mode": "Dark",
2812
+ "fgHex": "#dde0e4",
2813
+ "bgHex": "#131923",
2814
+ "ratio": 13.31,
2815
+ "min": 4.5
2816
+ },
2817
+ {
2818
+ "component": "button",
2819
+ "context": "ion-button--primary-brand",
2820
+ "state": "pressed",
2821
+ "fg": "--text-on-color",
2822
+ "bg": "--surface-primary-pressed",
2823
+ "backdrop": null,
2824
+ "kind": "text",
2825
+ "mode": "Dark",
2826
+ "fgHex": "#000000",
2827
+ "bgHex": "#9fd5f9",
2828
+ "ratio": 13.36,
2829
+ "min": 4.5
2830
+ },
2831
+ {
2832
+ "component": "menu",
2833
+ "context": "ion-menu__item--selected ion-menu__item--selected",
2834
+ "state": "hover",
2835
+ "fg": "--icon-default",
2836
+ "bg": "--surface-hover",
2837
+ "backdrop": "--surface-default",
2838
+ "kind": "non-text",
2839
+ "mode": "Light",
2840
+ "fgHex": "#1d2735",
2841
+ "bgHex": "#f2f2f2",
2842
+ "compositedOver": "--surface-default",
2843
+ "ratio": 13.49,
2844
+ "min": 3
2845
+ },
2846
+ {
2847
+ "component": "popover",
2848
+ "context": "ion-popover ion-popover__title",
2849
+ "state": "default",
2850
+ "fg": "--text-default",
2851
+ "bg": "--surface-raised",
2852
+ "backdrop": "--surface-raised",
2853
+ "kind": "text",
2854
+ "mode": "Dark",
2855
+ "fgHex": "#f6f8f9",
2856
+ "bgHex": "#1d2735",
2857
+ "ratio": 14.14,
2858
+ "min": 4.5
2859
+ },
2860
+ {
2861
+ "component": "toast",
2862
+ "context": "ion-toast ion-toast__title",
2863
+ "state": "default",
2864
+ "fg": "--text-default",
2865
+ "bg": "--surface-raised",
2866
+ "backdrop": "--surface-raised",
2867
+ "kind": "text",
2868
+ "mode": "Dark",
2869
+ "fgHex": "#f6f8f9",
2870
+ "bgHex": "#1d2735",
2871
+ "ratio": 14.14,
2872
+ "min": 4.5
2873
+ },
2874
+ {
2875
+ "component": "tooltip",
2876
+ "context": "ion-tooltip ion-tooltip__bubble",
2877
+ "state": "default",
2878
+ "fg": "--text-inverse",
2879
+ "bg": "--surface-inverse",
2880
+ "backdrop": null,
2881
+ "kind": "text",
2882
+ "mode": "Light",
2883
+ "fgHex": "#f6f8f9",
2884
+ "bgHex": "#1d2735",
2885
+ "ratio": 14.14,
2886
+ "min": 4.5
2887
+ },
2888
+ {
2889
+ "component": "menu",
2890
+ "context": "ion-menu ion-menu__item",
2891
+ "state": "hover",
2892
+ "fg": "--text-secondary",
2893
+ "bg": "--surface-hover",
2894
+ "backdrop": "--surface-default",
2895
+ "kind": "text",
2896
+ "mode": "Dark",
2897
+ "fgHex": "#dde0e4",
2898
+ "bgHex": "#0d0d0d",
2899
+ "compositedOver": "--surface-default",
2900
+ "ratio": 14.7,
2901
+ "min": 4.5
2902
+ },
2903
+ {
2904
+ "component": "modal",
2905
+ "context": "ion-modal ion-modal__close",
2906
+ "state": "hover",
2907
+ "fg": "--icon-secondary",
2908
+ "bg": "--surface-hover",
2909
+ "backdrop": "--surface-overlay",
2910
+ "kind": "non-text",
2911
+ "mode": "Dark",
2912
+ "fgHex": "#dde0e4",
2913
+ "bgHex": "#0d0d0d",
2914
+ "compositedOver": "--surface-overlay",
2915
+ "ratio": 14.7,
2916
+ "min": 3
2917
+ },
2918
+ {
2919
+ "component": "table",
2920
+ "context": "ion-table",
2921
+ "state": "hover",
2922
+ "fg": "--text-secondary",
2923
+ "bg": "--surface-hover",
2924
+ "backdrop": "--surface-default",
2925
+ "kind": "text",
2926
+ "mode": "Dark",
2927
+ "fgHex": "#dde0e4",
2928
+ "bgHex": "#0d0d0d",
2929
+ "compositedOver": "--surface-default",
2930
+ "ratio": 14.7,
2931
+ "min": 4.5
2932
+ },
2933
+ {
2934
+ "component": "alert",
2935
+ "context": "ion-alert--solid&ion-alert--neutral",
2936
+ "state": "default",
2937
+ "fg": "--text-on-color",
2938
+ "bg": "--surface-inverse",
2939
+ "backdrop": "--surface-inverse",
2940
+ "kind": "text",
2941
+ "mode": "Light",
2942
+ "fgHex": "#ffffff",
2943
+ "bgHex": "#1d2735",
2944
+ "ratio": 15.07,
2945
+ "min": 4.5
2946
+ },
2947
+ {
2948
+ "component": "button",
2949
+ "context": "ion-button--primary-neutral",
2950
+ "state": "default",
2951
+ "fg": "--text-on-color",
2952
+ "bg": "--surface-inverse",
2953
+ "backdrop": null,
2954
+ "kind": "text",
2955
+ "mode": "Light",
2956
+ "fgHex": "#ffffff",
2957
+ "bgHex": "#1d2735",
2958
+ "ratio": 15.07,
2959
+ "min": 4.5
2960
+ },
2961
+ {
2962
+ "component": "button",
2963
+ "context": "ion-button--primary-neutral",
2964
+ "state": "pressed",
2965
+ "fg": "--text-on-color",
2966
+ "bg": "--surface-inverse",
2967
+ "backdrop": null,
2968
+ "kind": "text",
2969
+ "mode": "Light",
2970
+ "fgHex": "#ffffff",
2971
+ "bgHex": "#1d2735",
2972
+ "ratio": 15.07,
2973
+ "min": 4.5
2974
+ },
2975
+ {
2976
+ "component": "header",
2977
+ "context": "ion-header ion-header__brand",
2978
+ "state": "default",
2979
+ "fg": "--icon-default",
2980
+ "bg": "--surface-default",
2981
+ "backdrop": "--surface-default",
2982
+ "kind": "non-text",
2983
+ "mode": "Light",
2984
+ "fgHex": "#1d2735",
2985
+ "bgHex": "#ffffff",
2986
+ "ratio": 15.07,
2987
+ "min": 3
2988
+ },
2989
+ {
2990
+ "component": "header",
2991
+ "context": "ion-header ion-header__toggle",
2992
+ "state": "default",
2993
+ "fg": "--icon-default",
2994
+ "bg": "--surface-default",
2995
+ "backdrop": "--surface-default",
2996
+ "kind": "non-text",
2997
+ "mode": "Light",
2998
+ "fgHex": "#1d2735",
2999
+ "bgHex": "#ffffff",
3000
+ "ratio": 15.07,
3001
+ "min": 3
3002
+ },
3003
+ {
3004
+ "component": "header",
3005
+ "context": "ion-header ion-header__toggle",
3006
+ "state": "focus",
3007
+ "fg": "--icon-default",
3008
+ "bg": "--surface-default",
3009
+ "backdrop": "--surface-default",
3010
+ "kind": "non-text",
3011
+ "mode": "Light",
3012
+ "fgHex": "#1d2735",
3013
+ "bgHex": "#ffffff",
3014
+ "ratio": 15.07,
3015
+ "min": 3
3016
+ },
3017
+ {
3018
+ "component": "menu",
3019
+ "context": "ion-menu ion-menu__icon",
3020
+ "state": "default",
3021
+ "fg": "--icon-default",
3022
+ "bg": "--surface-default",
3023
+ "backdrop": "--surface-default",
3024
+ "kind": "non-text",
3025
+ "mode": "Light",
3026
+ "fgHex": "#1d2735",
3027
+ "bgHex": "#ffffff",
3028
+ "ratio": 15.07,
3029
+ "min": 3
3030
+ },
3031
+ {
3032
+ "component": "menu",
3033
+ "context": "ion-menu ion-menu__check",
3034
+ "state": "default",
3035
+ "fg": "--icon-default",
3036
+ "bg": "--surface-default",
3037
+ "backdrop": "--surface-default",
3038
+ "kind": "non-text",
3039
+ "mode": "Light",
3040
+ "fgHex": "#1d2735",
3041
+ "bgHex": "#ffffff",
3042
+ "ratio": 15.07,
3043
+ "min": 3
3044
+ },
3045
+ {
3046
+ "component": "button",
3047
+ "context": "ion-button--secondary",
3048
+ "state": "default",
3049
+ "fg": "--text-secondary",
3050
+ "bg": "--surface-default",
3051
+ "backdrop": null,
3052
+ "kind": "text",
3053
+ "mode": "Dark",
3054
+ "fgHex": "#dde0e4",
3055
+ "bgHex": "#000000",
3056
+ "ratio": 15.86,
3057
+ "min": 4.5
3058
+ },
3059
+ {
3060
+ "component": "menu",
3061
+ "context": "ion-menu ion-menu__item",
3062
+ "state": "default",
3063
+ "fg": "--text-secondary",
3064
+ "bg": "--surface-default",
3065
+ "backdrop": "--surface-default",
3066
+ "kind": "text",
3067
+ "mode": "Dark",
3068
+ "fgHex": "#dde0e4",
3069
+ "bgHex": "#000000",
3070
+ "ratio": 15.86,
3071
+ "min": 4.5
3072
+ },
3073
+ {
3074
+ "component": "menu",
3075
+ "context": "ion-menu ion-menu__item",
3076
+ "state": "focus",
3077
+ "fg": "--text-secondary",
3078
+ "bg": "--surface-default",
3079
+ "backdrop": "--surface-default",
3080
+ "kind": "text",
3081
+ "mode": "Dark",
3082
+ "fgHex": "#dde0e4",
3083
+ "bgHex": "#000000",
3084
+ "ratio": 15.86,
3085
+ "min": 4.5
3086
+ },
3087
+ {
3088
+ "component": "modal",
3089
+ "context": "ion-modal ion-modal__description",
3090
+ "state": "default",
3091
+ "fg": "--text-secondary",
3092
+ "bg": "--surface-overlay",
3093
+ "backdrop": "--surface-overlay",
3094
+ "kind": "text",
3095
+ "mode": "Dark",
3096
+ "fgHex": "#dde0e4",
3097
+ "bgHex": "#000000",
3098
+ "ratio": 15.86,
3099
+ "min": 4.5
3100
+ },
3101
+ {
3102
+ "component": "modal",
3103
+ "context": "ion-modal ion-modal__close",
3104
+ "state": "default",
3105
+ "fg": "--icon-secondary",
3106
+ "bg": "--surface-overlay",
3107
+ "backdrop": "--surface-overlay",
3108
+ "kind": "non-text",
3109
+ "mode": "Dark",
3110
+ "fgHex": "#dde0e4",
3111
+ "bgHex": "#000000",
3112
+ "ratio": 15.86,
3113
+ "min": 3
3114
+ },
3115
+ {
3116
+ "component": "modal",
3117
+ "context": "ion-modal ion-modal__close",
3118
+ "state": "focus",
3119
+ "fg": "--icon-secondary",
3120
+ "bg": "--surface-overlay",
3121
+ "backdrop": "--surface-overlay",
3122
+ "kind": "non-text",
3123
+ "mode": "Dark",
3124
+ "fgHex": "#dde0e4",
3125
+ "bgHex": "#000000",
3126
+ "ratio": 15.86,
3127
+ "min": 3
3128
+ },
3129
+ {
3130
+ "component": "modal",
3131
+ "context": "ion-modal ion-modal__body",
3132
+ "state": "default",
3133
+ "fg": "--text-secondary",
3134
+ "bg": "--surface-overlay",
3135
+ "backdrop": "--surface-overlay",
3136
+ "kind": "text",
3137
+ "mode": "Dark",
3138
+ "fgHex": "#dde0e4",
3139
+ "bgHex": "#000000",
3140
+ "ratio": 15.86,
3141
+ "min": 4.5
3142
+ },
3143
+ {
3144
+ "component": "modal",
3145
+ "context": "ion-modal--center ion-modal__body",
3146
+ "state": "default",
3147
+ "fg": "--text-secondary",
3148
+ "bg": "--surface-overlay",
3149
+ "backdrop": "--surface-overlay",
3150
+ "kind": "text",
3151
+ "mode": "Dark",
3152
+ "fgHex": "#dde0e4",
3153
+ "bgHex": "#000000",
3154
+ "ratio": 15.86,
3155
+ "min": 4.5
3156
+ },
3157
+ {
3158
+ "component": "select",
3159
+ "context": "ion-select ion-select__field",
3160
+ "state": "default",
3161
+ "fg": "--text-secondary",
3162
+ "bg": "--surface-default",
3163
+ "backdrop": "--surface-default",
3164
+ "kind": "text",
3165
+ "mode": "Dark",
3166
+ "fgHex": "#dde0e4",
3167
+ "bgHex": "#000000",
3168
+ "ratio": 15.86,
3169
+ "min": 4.5
3170
+ },
3171
+ {
3172
+ "component": "table",
3173
+ "context": "ion-table",
3174
+ "state": "default",
3175
+ "fg": "--text-secondary",
3176
+ "bg": "--surface-default",
3177
+ "backdrop": "--surface-default",
3178
+ "kind": "text",
3179
+ "mode": "Dark",
3180
+ "fgHex": "#dde0e4",
3181
+ "bgHex": "#000000",
3182
+ "ratio": 15.86,
3183
+ "min": 4.5
3184
+ },
3185
+ {
3186
+ "component": "table",
3187
+ "context": "ion-table--compact",
3188
+ "state": "default",
3189
+ "fg": "--text-secondary",
3190
+ "bg": "--surface-default",
3191
+ "backdrop": "--surface-default",
3192
+ "kind": "text",
3193
+ "mode": "Dark",
3194
+ "fgHex": "#dde0e4",
3195
+ "bgHex": "#000000",
3196
+ "ratio": 15.86,
3197
+ "min": 4.5
3198
+ },
3199
+ {
3200
+ "component": "table",
3201
+ "context": "ion-table--relaxed",
3202
+ "state": "default",
3203
+ "fg": "--text-secondary",
3204
+ "bg": "--surface-default",
3205
+ "backdrop": "--surface-default",
3206
+ "kind": "text",
3207
+ "mode": "Dark",
3208
+ "fgHex": "#dde0e4",
3209
+ "bgHex": "#000000",
3210
+ "ratio": 15.86,
3211
+ "min": 4.5
3212
+ },
3213
+ {
3214
+ "component": "table",
3215
+ "context": "ion-table ion-table__cell-content",
3216
+ "state": "default",
3217
+ "fg": "--text-secondary",
3218
+ "bg": "--surface-default",
3219
+ "backdrop": "--surface-default",
3220
+ "kind": "text",
3221
+ "mode": "Dark",
3222
+ "fgHex": "#dde0e4",
3223
+ "bgHex": "#000000",
3224
+ "ratio": 15.86,
3225
+ "min": 4.5
3226
+ },
3227
+ {
3228
+ "component": "table",
3229
+ "context": "ion-table ion-table__cell-icon",
3230
+ "state": "default",
3231
+ "fg": "--icon-interactive",
3232
+ "bg": "--surface-default",
3233
+ "backdrop": "--surface-default",
3234
+ "kind": "non-text",
3235
+ "mode": "Dark",
3236
+ "fgHex": "#dde0e4",
3237
+ "bgHex": "#000000",
3238
+ "ratio": 15.86,
3239
+ "min": 3
3240
+ },
3241
+ {
3242
+ "component": "table",
3243
+ "context": "ion-table__cell-icon--trailing ion-table__cell-icon--trailing",
3244
+ "state": "default",
3245
+ "fg": "--icon-secondary",
3246
+ "bg": "--surface-default",
3247
+ "backdrop": "--surface-default",
3248
+ "kind": "non-text",
3249
+ "mode": "Dark",
3250
+ "fgHex": "#dde0e4",
3251
+ "bgHex": "#000000",
3252
+ "ratio": 15.86,
3253
+ "min": 3
3254
+ },
3255
+ {
3256
+ "component": "tabs",
3257
+ "context": "ion-tabs__item--pill ion-tabs__item--pill",
3258
+ "state": "hover",
3259
+ "fg": "--text-default",
3260
+ "bg": "--surface-page",
3261
+ "backdrop": null,
3262
+ "kind": "text",
3263
+ "mode": "Light",
3264
+ "fgHex": "#131923",
3265
+ "bgHex": "#f6f8f9",
3266
+ "ratio": 16.55,
3267
+ "min": 4.5
3268
+ },
3269
+ {
3270
+ "component": "tabs",
3271
+ "context": "ion-tabs__item--pill ion-tabs__item--pill",
3272
+ "state": "hover",
3273
+ "fg": "--text-default",
3274
+ "bg": "--surface-page",
3275
+ "backdrop": null,
3276
+ "kind": "text",
3277
+ "mode": "Dark",
3278
+ "fgHex": "#f6f8f9",
3279
+ "bgHex": "#131923",
3280
+ "ratio": 16.55,
3281
+ "min": 4.5
3282
+ },
3283
+ {
3284
+ "component": "button",
3285
+ "context": "ion-button--primary-neutral",
3286
+ "state": "hover",
3287
+ "fg": "--text-on-color",
3288
+ "bg": "--surface-inverse-subtle",
3289
+ "backdrop": null,
3290
+ "kind": "text",
3291
+ "mode": "Dark",
3292
+ "fgHex": "#000000",
3293
+ "bgHex": "#e5e7eb",
3294
+ "ratio": 16.96,
3295
+ "min": 4.5
3296
+ },
3297
+ {
3298
+ "component": "menu",
3299
+ "context": "ion-menu__item--selected ion-menu__item--selected",
3300
+ "state": "hover",
3301
+ "fg": "--icon-default",
3302
+ "bg": "--surface-hover",
3303
+ "backdrop": "--surface-default",
3304
+ "kind": "non-text",
3305
+ "mode": "Dark",
3306
+ "fgHex": "#f0f2f4",
3307
+ "bgHex": "#0d0d0d",
3308
+ "compositedOver": "--surface-default",
3309
+ "ratio": 17.35,
3310
+ "min": 3
3311
+ },
3312
+ {
3313
+ "component": "modal",
3314
+ "context": "ion-modal ion-modal__title",
3315
+ "state": "default",
3316
+ "fg": "--text-default",
3317
+ "bg": "--surface-overlay",
3318
+ "backdrop": "--surface-overlay",
3319
+ "kind": "text",
3320
+ "mode": "Light",
3321
+ "fgHex": "#131923",
3322
+ "bgHex": "#ffffff",
3323
+ "ratio": 17.63,
3324
+ "min": 4.5
3325
+ },
3326
+ {
3327
+ "component": "popover",
3328
+ "context": "ion-popover ion-popover__title",
3329
+ "state": "default",
3330
+ "fg": "--text-default",
3331
+ "bg": "--surface-raised",
3332
+ "backdrop": "--surface-raised",
3333
+ "kind": "text",
3334
+ "mode": "Light",
3335
+ "fgHex": "#131923",
3336
+ "bgHex": "#ffffff",
3337
+ "ratio": 17.63,
3338
+ "min": 4.5
3339
+ },
3340
+ {
3341
+ "component": "tabs",
3342
+ "context": "ion-tabs__item--pill ion-tabs__item--pill",
3343
+ "state": "selected",
3344
+ "fg": "--text-default",
3345
+ "bg": "--surface-default",
3346
+ "backdrop": null,
3347
+ "kind": "text",
3348
+ "mode": "Light",
3349
+ "fgHex": "#131923",
3350
+ "bgHex": "#ffffff",
3351
+ "ratio": 17.63,
3352
+ "min": 4.5
3353
+ },
3354
+ {
3355
+ "component": "toast",
3356
+ "context": "ion-toast ion-toast__title",
3357
+ "state": "default",
3358
+ "fg": "--text-default",
3359
+ "bg": "--surface-raised",
3360
+ "backdrop": "--surface-raised",
3361
+ "kind": "text",
3362
+ "mode": "Light",
3363
+ "fgHex": "#131923",
3364
+ "bgHex": "#ffffff",
3365
+ "ratio": 17.63,
3366
+ "min": 4.5
3367
+ },
3368
+ {
3369
+ "component": "tooltip",
3370
+ "context": "ion-tooltip ion-tooltip__bubble",
3371
+ "state": "default",
3372
+ "fg": "--text-inverse",
3373
+ "bg": "--surface-inverse",
3374
+ "backdrop": null,
3375
+ "kind": "text",
3376
+ "mode": "Dark",
3377
+ "fgHex": "#131923",
3378
+ "bgHex": "#ffffff",
3379
+ "ratio": 17.63,
3380
+ "min": 4.5
3381
+ },
3382
+ {
3383
+ "component": "header",
3384
+ "context": "ion-header ion-header__brand",
3385
+ "state": "default",
3386
+ "fg": "--icon-default",
3387
+ "bg": "--surface-default",
3388
+ "backdrop": "--surface-default",
3389
+ "kind": "non-text",
3390
+ "mode": "Dark",
3391
+ "fgHex": "#f0f2f4",
3392
+ "bgHex": "#000000",
3393
+ "ratio": 18.71,
3394
+ "min": 3
3395
+ },
3396
+ {
3397
+ "component": "header",
3398
+ "context": "ion-header ion-header__toggle",
3399
+ "state": "default",
3400
+ "fg": "--icon-default",
3401
+ "bg": "--surface-default",
3402
+ "backdrop": "--surface-default",
3403
+ "kind": "non-text",
3404
+ "mode": "Dark",
3405
+ "fgHex": "#f0f2f4",
3406
+ "bgHex": "#000000",
3407
+ "ratio": 18.71,
3408
+ "min": 3
3409
+ },
3410
+ {
3411
+ "component": "header",
3412
+ "context": "ion-header ion-header__toggle",
3413
+ "state": "focus",
3414
+ "fg": "--icon-default",
3415
+ "bg": "--surface-default",
3416
+ "backdrop": "--surface-default",
3417
+ "kind": "non-text",
3418
+ "mode": "Dark",
3419
+ "fgHex": "#f0f2f4",
3420
+ "bgHex": "#000000",
3421
+ "ratio": 18.71,
3422
+ "min": 3
3423
+ },
3424
+ {
3425
+ "component": "menu",
3426
+ "context": "ion-menu ion-menu__icon",
3427
+ "state": "default",
3428
+ "fg": "--icon-default",
3429
+ "bg": "--surface-default",
3430
+ "backdrop": "--surface-default",
3431
+ "kind": "non-text",
3432
+ "mode": "Dark",
3433
+ "fgHex": "#f0f2f4",
3434
+ "bgHex": "#000000",
3435
+ "ratio": 18.71,
3436
+ "min": 3
3437
+ },
3438
+ {
3439
+ "component": "menu",
3440
+ "context": "ion-menu ion-menu__check",
3441
+ "state": "default",
3442
+ "fg": "--icon-default",
3443
+ "bg": "--surface-default",
3444
+ "backdrop": "--surface-default",
3445
+ "kind": "non-text",
3446
+ "mode": "Dark",
3447
+ "fgHex": "#f0f2f4",
3448
+ "bgHex": "#000000",
3449
+ "ratio": 18.71,
3450
+ "min": 3
3451
+ },
3452
+ {
3453
+ "component": "modal",
3454
+ "context": "ion-modal ion-modal__title",
3455
+ "state": "default",
3456
+ "fg": "--text-default",
3457
+ "bg": "--surface-overlay",
3458
+ "backdrop": "--surface-overlay",
3459
+ "kind": "text",
3460
+ "mode": "Dark",
3461
+ "fgHex": "#f6f8f9",
3462
+ "bgHex": "#000000",
3463
+ "ratio": 19.71,
3464
+ "min": 4.5
3465
+ },
3466
+ {
3467
+ "component": "tabs",
3468
+ "context": "ion-tabs__item--pill ion-tabs__item--pill",
3469
+ "state": "selected",
3470
+ "fg": "--text-default",
3471
+ "bg": "--surface-default",
3472
+ "backdrop": null,
3473
+ "kind": "text",
3474
+ "mode": "Dark",
3475
+ "fgHex": "#f6f8f9",
3476
+ "bgHex": "#000000",
3477
+ "ratio": 19.71,
3478
+ "min": 4.5
3479
+ },
3480
+ {
3481
+ "component": "alert",
3482
+ "context": "ion-alert--solid&ion-alert--neutral",
3483
+ "state": "default",
3484
+ "fg": "--text-on-color",
3485
+ "bg": "--surface-inverse",
3486
+ "backdrop": "--surface-inverse",
3487
+ "kind": "text",
3488
+ "mode": "Dark",
3489
+ "fgHex": "#000000",
3490
+ "bgHex": "#ffffff",
3491
+ "ratio": 21,
3492
+ "min": 4.5
3493
+ },
3494
+ {
3495
+ "component": "button",
3496
+ "context": "ion-button--primary-neutral",
3497
+ "state": "default",
3498
+ "fg": "--text-on-color",
3499
+ "bg": "--surface-inverse",
3500
+ "backdrop": null,
3501
+ "kind": "text",
3502
+ "mode": "Dark",
3503
+ "fgHex": "#000000",
3504
+ "bgHex": "#ffffff",
3505
+ "ratio": 21,
3506
+ "min": 4.5
3507
+ },
3508
+ {
3509
+ "component": "button",
3510
+ "context": "ion-button--primary-neutral",
3511
+ "state": "pressed",
3512
+ "fg": "--text-on-color",
3513
+ "bg": "--surface-inverse",
3514
+ "backdrop": null,
3515
+ "kind": "text",
3516
+ "mode": "Dark",
3517
+ "fgHex": "#000000",
3518
+ "bgHex": "#ffffff",
3519
+ "ratio": 21,
3520
+ "min": 4.5
3521
+ }
3522
+ ],
3523
+ "accepted": [
3524
+ {
3525
+ "fg": "--text-disabled",
3526
+ "bg": "--surface-disabled",
3527
+ "mode": "Light",
3528
+ "kind": "wcag-exempt",
3529
+ "ratio": 4.31,
3530
+ "reason": "WCAG 2.2 SC 1.4.3 exempts text that is part of an inactive user interface component: it has no contrast requirement. Disabled controls are required to look unavailable, and raising this would work against that.",
3531
+ "affects": [
3532
+ "Button",
3533
+ "Input",
3534
+ "Select"
3535
+ ]
3536
+ },
3537
+ {
3538
+ "fg": "--text-disabled",
3539
+ "bg": "--surface-disabled",
3540
+ "mode": "Dark",
3541
+ "kind": "wcag-exempt",
3542
+ "ratio": 3.12,
3543
+ "reason": "Same exemption as Light — SC 1.4.3 incidental text, inactive component.",
3544
+ "affects": [
3545
+ "Button",
3546
+ "Input",
3547
+ "Select"
3548
+ ]
3549
+ },
3550
+ {
3551
+ "fg": "--text-on-color",
3552
+ "bg": "--surface-information",
3553
+ "mode": "Dark",
3554
+ "kind": "defect",
3555
+ "ratio": 3.44,
3556
+ "reason": "Long-recorded. Fix is the same shape as the success green on 2026-08-18: move the PURPLE PRIMITIVES, not the role binding. Re-pointing surface/information at information/700 would make the base identical to its own hover.",
3557
+ "affects": [
3558
+ "Alert"
3559
+ ],
3560
+ "surfacedBy": "Alert with emphasis=solid intent=information",
3561
+ "note": "AGENTS.md described this role as 'not yet used'. That was wrong, and this gate is what proved it — Alert ships it today.",
3562
+ "appliesTo": {
3563
+ "component": "Alert",
3564
+ "props": {
3565
+ "emphasis": "solid",
3566
+ "intent": "information"
3567
+ }
3568
+ }
3569
+ },
3570
+ {
3571
+ "fg": "--text-primary",
3572
+ "bg": "--surface-primary-subtle-hover",
3573
+ "mode": "Dark",
3574
+ "kind": "defect",
3575
+ "ratio": 4.25,
3576
+ "reason": "Found by this gate on 2026-08-18, not previously known. Button primary-soft on hover in dark mode. Marginal — 4.25 against 4.5 — but it is an interactive state, so it is the state a user is most likely to be reading when they act.",
3577
+ "affects": [
3578
+ "Button"
3579
+ ],
3580
+ "surfacedBy": "Button variant=primary-soft, hover",
3581
+ "appliesTo": {
3582
+ "component": "Button",
3583
+ "props": {
3584
+ "variant": "primary-soft"
3585
+ }
3586
+ }
3587
+ },
3588
+ {
3589
+ "fg": "--text-primary",
3590
+ "bg": "--surface-primary-tint",
3591
+ "mode": "Dark",
3592
+ "kind": "defect",
3593
+ "ratio": 4.25,
3594
+ "reason": "Same pair of values as the hover case above — surface/primary-tint and surface/primary-subtle/hover both resolve to #0e2d8b in Dark. One fix addresses both.",
3595
+ "affects": [
3596
+ "Button"
3597
+ ],
3598
+ "surfacedBy": "Button variant=primary-soft, pressed",
3599
+ "appliesTo": {
3600
+ "component": "Button",
3601
+ "props": {
3602
+ "variant": "primary-soft"
3603
+ }
3604
+ }
3605
+ }
3606
+ ],
3607
+ "skipped": []
3608
+ }