@m3-baseui/react-tailwind 1.0.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 (82) hide show
  1. package/dist/badge.d.ts +45 -0
  2. package/dist/badge.js +50 -0
  3. package/dist/badge.js.map +1 -0
  4. package/dist/button.d.ts +69 -0
  5. package/dist/button.js +74 -0
  6. package/dist/button.js.map +1 -0
  7. package/dist/card.d.ts +80 -0
  8. package/dist/card.js +77 -0
  9. package/dist/card.js.map +1 -0
  10. package/dist/checkbox.d.ts +63 -0
  11. package/dist/checkbox.js +60 -0
  12. package/dist/checkbox.js.map +1 -0
  13. package/dist/chip.d.ts +165 -0
  14. package/dist/chip.js +76 -0
  15. package/dist/chip.js.map +1 -0
  16. package/dist/dialog.d.ts +86 -0
  17. package/dist/dialog.js +68 -0
  18. package/dist/dialog.js.map +1 -0
  19. package/dist/divider.d.ts +83 -0
  20. package/dist/divider.js +34 -0
  21. package/dist/divider.js.map +1 -0
  22. package/dist/fab.d.ts +104 -0
  23. package/dist/fab.js +43 -0
  24. package/dist/fab.js.map +1 -0
  25. package/dist/icon-button.d.ts +174 -0
  26. package/dist/icon-button.js +121 -0
  27. package/dist/icon-button.js.map +1 -0
  28. package/dist/index.d.ts +29 -0
  29. package/dist/index.js +1157 -0
  30. package/dist/index.js.map +1 -0
  31. package/dist/item.d.ts +94 -0
  32. package/dist/item.js +62 -0
  33. package/dist/item.js.map +1 -0
  34. package/dist/list.d.ts +163 -0
  35. package/dist/list.js +94 -0
  36. package/dist/list.js.map +1 -0
  37. package/dist/menu.d.ts +119 -0
  38. package/dist/menu.js +114 -0
  39. package/dist/menu.js.map +1 -0
  40. package/dist/navigation-bar.d.ts +91 -0
  41. package/dist/navigation-bar.js +48 -0
  42. package/dist/navigation-bar.js.map +1 -0
  43. package/dist/navigation-drawer.d.ts +86 -0
  44. package/dist/navigation-drawer.js +78 -0
  45. package/dist/navigation-drawer.js.map +1 -0
  46. package/dist/progress.d.ts +118 -0
  47. package/dist/progress.js +41 -0
  48. package/dist/progress.js.map +1 -0
  49. package/dist/radio.d.ts +56 -0
  50. package/dist/radio.js +47 -0
  51. package/dist/radio.js.map +1 -0
  52. package/dist/segmented-button.d.ts +83 -0
  53. package/dist/segmented-button.js +71 -0
  54. package/dist/segmented-button.js.map +1 -0
  55. package/dist/select.d.ts +125 -0
  56. package/dist/select.js +99 -0
  57. package/dist/select.js.map +1 -0
  58. package/dist/slider.d.ts +94 -0
  59. package/dist/slider.js +71 -0
  60. package/dist/slider.js.map +1 -0
  61. package/dist/snackbar.d.ts +108 -0
  62. package/dist/snackbar.js +57 -0
  63. package/dist/snackbar.js.map +1 -0
  64. package/dist/switch.d.ts +72 -0
  65. package/dist/switch.js +66 -0
  66. package/dist/switch.js.map +1 -0
  67. package/dist/tabs.d.ts +118 -0
  68. package/dist/tabs.js +97 -0
  69. package/dist/tabs.js.map +1 -0
  70. package/dist/textfield.d.ts +127 -0
  71. package/dist/textfield.js +83 -0
  72. package/dist/textfield.js.map +1 -0
  73. package/dist/tooltip.d.ts +61 -0
  74. package/dist/tooltip.js +52 -0
  75. package/dist/tooltip.js.map +1 -0
  76. package/dist/tv.d.ts +19 -0
  77. package/dist/tv.js +35 -0
  78. package/dist/tv.js.map +1 -0
  79. package/package.json +171 -0
  80. package/styles/preset.css +30 -0
  81. package/styles/theme.css +213 -0
  82. package/styles/tokens.css +361 -0
package/styles/tokens.css ADDED
@@ -0,0 +1,361 @@
1
+ /* AUTO-GENERATED by @m3-baseui/tokens. Do not edit by hand. */
2
+
3
+ :root {
4
+ --md-sys-color-primary: 103 80 164;
5
+ --md-sys-color-on-primary: 255 255 255;
6
+ --md-sys-color-primary-container: 234 221 255;
7
+ --md-sys-color-on-primary-container: 33 0 93;
8
+ --md-sys-color-secondary: 98 91 113;
9
+ --md-sys-color-on-secondary: 255 255 255;
10
+ --md-sys-color-secondary-container: 232 222 248;
11
+ --md-sys-color-on-secondary-container: 29 25 43;
12
+ --md-sys-color-tertiary: 125 82 96;
13
+ --md-sys-color-on-tertiary: 255 255 255;
14
+ --md-sys-color-tertiary-container: 255 216 228;
15
+ --md-sys-color-on-tertiary-container: 49 17 29;
16
+ --md-sys-color-error: 179 38 30;
17
+ --md-sys-color-on-error: 255 255 255;
18
+ --md-sys-color-error-container: 249 222 220;
19
+ --md-sys-color-on-error-container: 65 14 11;
20
+ --md-sys-color-background: 254 247 255;
21
+ --md-sys-color-on-background: 29 27 32;
22
+ --md-sys-color-surface: 254 247 255;
23
+ --md-sys-color-on-surface: 29 27 32;
24
+ --md-sys-color-surface-variant: 231 224 236;
25
+ --md-sys-color-on-surface-variant: 73 69 79;
26
+ --md-sys-color-surface-dim: 222 216 225;
27
+ --md-sys-color-surface-bright: 254 247 255;
28
+ --md-sys-color-surface-container-lowest: 255 255 255;
29
+ --md-sys-color-surface-container-low: 247 242 250;
30
+ --md-sys-color-surface-container: 243 237 247;
31
+ --md-sys-color-surface-container-high: 236 230 240;
32
+ --md-sys-color-surface-container-highest: 230 224 233;
33
+ --md-sys-color-outline: 121 116 126;
34
+ --md-sys-color-outline-variant: 202 196 208;
35
+ --md-sys-color-shadow: 0 0 0;
36
+ --md-sys-color-scrim: 0 0 0;
37
+ --md-sys-color-surface-tint: 103 80 164;
38
+ --md-sys-color-inverse-surface: 50 47 53;
39
+ --md-sys-color-inverse-on-surface: 245 239 247;
40
+ --md-sys-color-inverse-primary: 208 188 255;
41
+ --md-sys-color-primary-fixed: 234 221 255;
42
+ --md-sys-color-primary-fixed-dim: 208 188 255;
43
+ --md-sys-color-on-primary-fixed: 33 0 93;
44
+ --md-sys-color-on-primary-fixed-variant: 79 55 139;
45
+ --md-sys-color-secondary-fixed: 232 222 248;
46
+ --md-sys-color-secondary-fixed-dim: 204 194 220;
47
+ --md-sys-color-on-secondary-fixed: 29 25 43;
48
+ --md-sys-color-on-secondary-fixed-variant: 74 68 88;
49
+ --md-sys-color-tertiary-fixed: 255 216 228;
50
+ --md-sys-color-tertiary-fixed-dim: 239 184 200;
51
+ --md-sys-color-on-tertiary-fixed: 49 17 29;
52
+ --md-sys-color-on-tertiary-fixed-variant: 99 59 72;
53
+
54
+ --md-sys-shape-none: 0px;
55
+ --md-sys-shape-extra-small: 4px;
56
+ --md-sys-shape-small: 8px;
57
+ --md-sys-shape-medium: 12px;
58
+ --md-sys-shape-large: 16px;
59
+ --md-sys-shape-extra-large: 28px;
60
+ --md-sys-shape-full: 9999px;
61
+ --md-sys-elevation-level0: none;
62
+ --md-sys-elevation-level1: 0px 1px 2px 0px rgb(0 0 0 / 0.30), 0px 1px 3px 1px rgb(0 0 0 / 0.15);
63
+ --md-sys-elevation-level2: 0px 1px 2px 0px rgb(0 0 0 / 0.30), 0px 2px 6px 2px rgb(0 0 0 / 0.15);
64
+ --md-sys-elevation-level3: 0px 1px 3px 0px rgb(0 0 0 / 0.30), 0px 4px 8px 3px rgb(0 0 0 / 0.15);
65
+ --md-sys-elevation-level4: 0px 2px 3px 0px rgb(0 0 0 / 0.30), 0px 6px 10px 4px rgb(0 0 0 / 0.15);
66
+ --md-sys-elevation-level5: 0px 4px 4px 0px rgb(0 0 0 / 0.30), 0px 8px 12px 6px rgb(0 0 0 / 0.15);
67
+ --md-sys-state-hover: 0.08;
68
+ --md-sys-state-focus: 0.10;
69
+ --md-sys-state-pressed: 0.10;
70
+ --md-sys-state-dragged: 0.16;
71
+ --md-sys-typescale-display-large-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
72
+ --md-sys-typescale-display-large-weight: 400;
73
+ --md-sys-typescale-display-large-size: 57px;
74
+ --md-sys-typescale-display-large-line-height: 64px;
75
+ --md-sys-typescale-display-large-tracking: -0.25px;
76
+ --md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
77
+ --md-sys-typescale-display-medium-weight: 400;
78
+ --md-sys-typescale-display-medium-size: 45px;
79
+ --md-sys-typescale-display-medium-line-height: 52px;
80
+ --md-sys-typescale-display-medium-tracking: 0px;
81
+ --md-sys-typescale-display-small-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
82
+ --md-sys-typescale-display-small-weight: 400;
83
+ --md-sys-typescale-display-small-size: 36px;
84
+ --md-sys-typescale-display-small-line-height: 44px;
85
+ --md-sys-typescale-display-small-tracking: 0px;
86
+ --md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
87
+ --md-sys-typescale-headline-large-weight: 400;
88
+ --md-sys-typescale-headline-large-size: 32px;
89
+ --md-sys-typescale-headline-large-line-height: 40px;
90
+ --md-sys-typescale-headline-large-tracking: 0px;
91
+ --md-sys-typescale-headline-medium-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
92
+ --md-sys-typescale-headline-medium-weight: 400;
93
+ --md-sys-typescale-headline-medium-size: 28px;
94
+ --md-sys-typescale-headline-medium-line-height: 36px;
95
+ --md-sys-typescale-headline-medium-tracking: 0px;
96
+ --md-sys-typescale-headline-small-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
97
+ --md-sys-typescale-headline-small-weight: 400;
98
+ --md-sys-typescale-headline-small-size: 24px;
99
+ --md-sys-typescale-headline-small-line-height: 32px;
100
+ --md-sys-typescale-headline-small-tracking: 0px;
101
+ --md-sys-typescale-title-large-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
102
+ --md-sys-typescale-title-large-weight: 400;
103
+ --md-sys-typescale-title-large-size: 22px;
104
+ --md-sys-typescale-title-large-line-height: 28px;
105
+ --md-sys-typescale-title-large-tracking: 0px;
106
+ --md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
107
+ --md-sys-typescale-title-medium-weight: 500;
108
+ --md-sys-typescale-title-medium-size: 16px;
109
+ --md-sys-typescale-title-medium-line-height: 24px;
110
+ --md-sys-typescale-title-medium-tracking: 0.15px;
111
+ --md-sys-typescale-title-small-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
112
+ --md-sys-typescale-title-small-weight: 500;
113
+ --md-sys-typescale-title-small-size: 14px;
114
+ --md-sys-typescale-title-small-line-height: 20px;
115
+ --md-sys-typescale-title-small-tracking: 0.1px;
116
+ --md-sys-typescale-body-large-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
117
+ --md-sys-typescale-body-large-weight: 400;
118
+ --md-sys-typescale-body-large-size: 16px;
119
+ --md-sys-typescale-body-large-line-height: 24px;
120
+ --md-sys-typescale-body-large-tracking: 0.5px;
121
+ --md-sys-typescale-body-medium-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
122
+ --md-sys-typescale-body-medium-weight: 400;
123
+ --md-sys-typescale-body-medium-size: 14px;
124
+ --md-sys-typescale-body-medium-line-height: 20px;
125
+ --md-sys-typescale-body-medium-tracking: 0.25px;
126
+ --md-sys-typescale-body-small-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
127
+ --md-sys-typescale-body-small-weight: 400;
128
+ --md-sys-typescale-body-small-size: 12px;
129
+ --md-sys-typescale-body-small-line-height: 16px;
130
+ --md-sys-typescale-body-small-tracking: 0.4px;
131
+ --md-sys-typescale-label-large-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
132
+ --md-sys-typescale-label-large-weight: 500;
133
+ --md-sys-typescale-label-large-size: 14px;
134
+ --md-sys-typescale-label-large-line-height: 20px;
135
+ --md-sys-typescale-label-large-tracking: 0.1px;
136
+ --md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
137
+ --md-sys-typescale-label-medium-weight: 500;
138
+ --md-sys-typescale-label-medium-size: 12px;
139
+ --md-sys-typescale-label-medium-line-height: 16px;
140
+ --md-sys-typescale-label-medium-tracking: 0.5px;
141
+ --md-sys-typescale-label-small-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
142
+ --md-sys-typescale-label-small-weight: 500;
143
+ --md-sys-typescale-label-small-size: 11px;
144
+ --md-sys-typescale-label-small-line-height: 16px;
145
+ --md-sys-typescale-label-small-tracking: 0.5px;
146
+ --md-sys-typescale-display-large-emphasized-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
147
+ --md-sys-typescale-display-large-emphasized-weight: 500;
148
+ --md-sys-typescale-display-large-emphasized-size: 57px;
149
+ --md-sys-typescale-display-large-emphasized-line-height: 64px;
150
+ --md-sys-typescale-display-large-emphasized-tracking: -0.25px;
151
+ --md-sys-typescale-display-medium-emphasized-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
152
+ --md-sys-typescale-display-medium-emphasized-weight: 500;
153
+ --md-sys-typescale-display-medium-emphasized-size: 45px;
154
+ --md-sys-typescale-display-medium-emphasized-line-height: 52px;
155
+ --md-sys-typescale-display-medium-emphasized-tracking: 0px;
156
+ --md-sys-typescale-display-small-emphasized-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
157
+ --md-sys-typescale-display-small-emphasized-weight: 500;
158
+ --md-sys-typescale-display-small-emphasized-size: 36px;
159
+ --md-sys-typescale-display-small-emphasized-line-height: 44px;
160
+ --md-sys-typescale-display-small-emphasized-tracking: 0px;
161
+ --md-sys-typescale-headline-large-emphasized-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
162
+ --md-sys-typescale-headline-large-emphasized-weight: 500;
163
+ --md-sys-typescale-headline-large-emphasized-size: 32px;
164
+ --md-sys-typescale-headline-large-emphasized-line-height: 40px;
165
+ --md-sys-typescale-headline-large-emphasized-tracking: 0px;
166
+ --md-sys-typescale-headline-medium-emphasized-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
167
+ --md-sys-typescale-headline-medium-emphasized-weight: 500;
168
+ --md-sys-typescale-headline-medium-emphasized-size: 28px;
169
+ --md-sys-typescale-headline-medium-emphasized-line-height: 36px;
170
+ --md-sys-typescale-headline-medium-emphasized-tracking: 0px;
171
+ --md-sys-typescale-headline-small-emphasized-font: var(--md-ref-typeface-brand, 'Roboto', system-ui, sans-serif);
172
+ --md-sys-typescale-headline-small-emphasized-weight: 500;
173
+ --md-sys-typescale-headline-small-emphasized-size: 24px;
174
+ --md-sys-typescale-headline-small-emphasized-line-height: 32px;
175
+ --md-sys-typescale-headline-small-emphasized-tracking: 0px;
176
+ --md-sys-typescale-title-large-emphasized-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
177
+ --md-sys-typescale-title-large-emphasized-weight: 500;
178
+ --md-sys-typescale-title-large-emphasized-size: 22px;
179
+ --md-sys-typescale-title-large-emphasized-line-height: 28px;
180
+ --md-sys-typescale-title-large-emphasized-tracking: 0px;
181
+ --md-sys-typescale-title-medium-emphasized-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
182
+ --md-sys-typescale-title-medium-emphasized-weight: 700;
183
+ --md-sys-typescale-title-medium-emphasized-size: 16px;
184
+ --md-sys-typescale-title-medium-emphasized-line-height: 24px;
185
+ --md-sys-typescale-title-medium-emphasized-tracking: 0.15px;
186
+ --md-sys-typescale-title-small-emphasized-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
187
+ --md-sys-typescale-title-small-emphasized-weight: 700;
188
+ --md-sys-typescale-title-small-emphasized-size: 14px;
189
+ --md-sys-typescale-title-small-emphasized-line-height: 20px;
190
+ --md-sys-typescale-title-small-emphasized-tracking: 0.1px;
191
+ --md-sys-typescale-body-large-emphasized-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
192
+ --md-sys-typescale-body-large-emphasized-weight: 500;
193
+ --md-sys-typescale-body-large-emphasized-size: 16px;
194
+ --md-sys-typescale-body-large-emphasized-line-height: 24px;
195
+ --md-sys-typescale-body-large-emphasized-tracking: 0.5px;
196
+ --md-sys-typescale-body-medium-emphasized-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
197
+ --md-sys-typescale-body-medium-emphasized-weight: 500;
198
+ --md-sys-typescale-body-medium-emphasized-size: 14px;
199
+ --md-sys-typescale-body-medium-emphasized-line-height: 20px;
200
+ --md-sys-typescale-body-medium-emphasized-tracking: 0.25px;
201
+ --md-sys-typescale-body-small-emphasized-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
202
+ --md-sys-typescale-body-small-emphasized-weight: 500;
203
+ --md-sys-typescale-body-small-emphasized-size: 12px;
204
+ --md-sys-typescale-body-small-emphasized-line-height: 16px;
205
+ --md-sys-typescale-body-small-emphasized-tracking: 0.4px;
206
+ --md-sys-typescale-label-large-emphasized-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
207
+ --md-sys-typescale-label-large-emphasized-weight: 700;
208
+ --md-sys-typescale-label-large-emphasized-size: 14px;
209
+ --md-sys-typescale-label-large-emphasized-line-height: 20px;
210
+ --md-sys-typescale-label-large-emphasized-tracking: 0.1px;
211
+ --md-sys-typescale-label-medium-emphasized-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
212
+ --md-sys-typescale-label-medium-emphasized-weight: 700;
213
+ --md-sys-typescale-label-medium-emphasized-size: 12px;
214
+ --md-sys-typescale-label-medium-emphasized-line-height: 16px;
215
+ --md-sys-typescale-label-medium-emphasized-tracking: 0.5px;
216
+ --md-sys-typescale-label-small-emphasized-font: var(--md-ref-typeface-plain, 'Roboto', system-ui, sans-serif);
217
+ --md-sys-typescale-label-small-emphasized-weight: 700;
218
+ --md-sys-typescale-label-small-emphasized-size: 11px;
219
+ --md-sys-typescale-label-small-emphasized-line-height: 16px;
220
+ --md-sys-typescale-label-small-emphasized-tracking: 0.5px;
221
+ --md-sys-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
222
+ --md-sys-motion-easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
223
+ --md-sys-motion-easing-standard-decelerate: cubic-bezier(0, 0, 0, 1);
224
+ --md-sys-motion-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
225
+ --md-sys-motion-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);
226
+ --md-sys-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
227
+ --md-sys-motion-easing-spring-spatial-fast: cubic-bezier(0.42, 1.67, 0.21, 0.9);
228
+ --md-sys-motion-easing-spring-spatial-default: cubic-bezier(0.38, 1.21, 0.22, 1.0);
229
+ --md-sys-motion-easing-spring-spatial-slow: cubic-bezier(0.39, 1.29, 0.35, 0.98);
230
+ --md-sys-motion-easing-spring-effects-fast: cubic-bezier(0.31, 0, 0, 1);
231
+ --md-sys-motion-easing-spring-effects-default: cubic-bezier(0.34, 0, 0.2, 1);
232
+ --md-sys-motion-easing-spring-effects-slow: cubic-bezier(0.42, 0, 0.58, 1);
233
+ --md-sys-motion-duration-short1: 50ms;
234
+ --md-sys-motion-duration-short2: 100ms;
235
+ --md-sys-motion-duration-short3: 150ms;
236
+ --md-sys-motion-duration-short4: 200ms;
237
+ --md-sys-motion-duration-medium1: 250ms;
238
+ --md-sys-motion-duration-medium2: 300ms;
239
+ --md-sys-motion-duration-medium3: 350ms;
240
+ --md-sys-motion-duration-medium4: 400ms;
241
+ --md-sys-motion-duration-long1: 450ms;
242
+ --md-sys-motion-duration-long2: 500ms;
243
+ --md-sys-motion-duration-long3: 550ms;
244
+ --md-sys-motion-duration-long4: 600ms;
245
+ --md-sys-motion-duration-extra-long1: 700ms;
246
+ --md-sys-motion-duration-extra-long2: 800ms;
247
+ --md-sys-motion-duration-extra-long3: 900ms;
248
+ --md-sys-motion-duration-extra-long4: 1000ms;
249
+ --md-sys-motion-duration-spring-spatial-fast: 350ms;
250
+ --md-sys-motion-duration-spring-spatial-default: 500ms;
251
+ --md-sys-motion-duration-spring-spatial-slow: 750ms;
252
+ --md-sys-motion-duration-spring-effects-fast: 150ms;
253
+ --md-sys-motion-duration-spring-effects-default: 200ms;
254
+ --md-sys-motion-duration-spring-effects-slow: 300ms;
255
+ }
256
+
257
+ [data-theme='dark'] {
258
+ --md-sys-color-primary: 208 188 255;
259
+ --md-sys-color-on-primary: 56 30 114;
260
+ --md-sys-color-primary-container: 79 55 139;
261
+ --md-sys-color-on-primary-container: 234 221 255;
262
+ --md-sys-color-secondary: 204 194 220;
263
+ --md-sys-color-on-secondary: 51 45 65;
264
+ --md-sys-color-secondary-container: 74 68 88;
265
+ --md-sys-color-on-secondary-container: 232 222 248;
266
+ --md-sys-color-tertiary: 239 184 200;
267
+ --md-sys-color-on-tertiary: 73 37 50;
268
+ --md-sys-color-tertiary-container: 99 59 72;
269
+ --md-sys-color-on-tertiary-container: 255 216 228;
270
+ --md-sys-color-error: 242 184 181;
271
+ --md-sys-color-on-error: 96 20 16;
272
+ --md-sys-color-error-container: 140 29 24;
273
+ --md-sys-color-on-error-container: 249 222 220;
274
+ --md-sys-color-background: 20 18 24;
275
+ --md-sys-color-on-background: 230 224 233;
276
+ --md-sys-color-surface: 20 18 24;
277
+ --md-sys-color-on-surface: 230 224 233;
278
+ --md-sys-color-surface-variant: 73 69 79;
279
+ --md-sys-color-on-surface-variant: 202 196 208;
280
+ --md-sys-color-surface-dim: 20 18 24;
281
+ --md-sys-color-surface-bright: 59 56 62;
282
+ --md-sys-color-surface-container-lowest: 15 13 19;
283
+ --md-sys-color-surface-container-low: 29 27 32;
284
+ --md-sys-color-surface-container: 33 31 38;
285
+ --md-sys-color-surface-container-high: 43 41 48;
286
+ --md-sys-color-surface-container-highest: 54 52 59;
287
+ --md-sys-color-outline: 147 143 153;
288
+ --md-sys-color-outline-variant: 73 69 79;
289
+ --md-sys-color-shadow: 0 0 0;
290
+ --md-sys-color-scrim: 0 0 0;
291
+ --md-sys-color-surface-tint: 208 188 255;
292
+ --md-sys-color-inverse-surface: 230 224 233;
293
+ --md-sys-color-inverse-on-surface: 50 47 53;
294
+ --md-sys-color-inverse-primary: 103 80 164;
295
+ --md-sys-color-primary-fixed: 234 221 255;
296
+ --md-sys-color-primary-fixed-dim: 208 188 255;
297
+ --md-sys-color-on-primary-fixed: 33 0 93;
298
+ --md-sys-color-on-primary-fixed-variant: 79 55 139;
299
+ --md-sys-color-secondary-fixed: 232 222 248;
300
+ --md-sys-color-secondary-fixed-dim: 204 194 220;
301
+ --md-sys-color-on-secondary-fixed: 29 25 43;
302
+ --md-sys-color-on-secondary-fixed-variant: 74 68 88;
303
+ --md-sys-color-tertiary-fixed: 255 216 228;
304
+ --md-sys-color-tertiary-fixed-dim: 239 184 200;
305
+ --md-sys-color-on-tertiary-fixed: 49 17 29;
306
+ --md-sys-color-on-tertiary-fixed-variant: 99 59 72;
307
+ }
308
+
309
+ @media (prefers-color-scheme: dark) {
310
+ :root:not([data-theme='light']) {
311
+ --md-sys-color-primary: 208 188 255;
312
+ --md-sys-color-on-primary: 56 30 114;
313
+ --md-sys-color-primary-container: 79 55 139;
314
+ --md-sys-color-on-primary-container: 234 221 255;
315
+ --md-sys-color-secondary: 204 194 220;
316
+ --md-sys-color-on-secondary: 51 45 65;
317
+ --md-sys-color-secondary-container: 74 68 88;
318
+ --md-sys-color-on-secondary-container: 232 222 248;
319
+ --md-sys-color-tertiary: 239 184 200;
320
+ --md-sys-color-on-tertiary: 73 37 50;
321
+ --md-sys-color-tertiary-container: 99 59 72;
322
+ --md-sys-color-on-tertiary-container: 255 216 228;
323
+ --md-sys-color-error: 242 184 181;
324
+ --md-sys-color-on-error: 96 20 16;
325
+ --md-sys-color-error-container: 140 29 24;
326
+ --md-sys-color-on-error-container: 249 222 220;
327
+ --md-sys-color-background: 20 18 24;
328
+ --md-sys-color-on-background: 230 224 233;
329
+ --md-sys-color-surface: 20 18 24;
330
+ --md-sys-color-on-surface: 230 224 233;
331
+ --md-sys-color-surface-variant: 73 69 79;
332
+ --md-sys-color-on-surface-variant: 202 196 208;
333
+ --md-sys-color-surface-dim: 20 18 24;
334
+ --md-sys-color-surface-bright: 59 56 62;
335
+ --md-sys-color-surface-container-lowest: 15 13 19;
336
+ --md-sys-color-surface-container-low: 29 27 32;
337
+ --md-sys-color-surface-container: 33 31 38;
338
+ --md-sys-color-surface-container-high: 43 41 48;
339
+ --md-sys-color-surface-container-highest: 54 52 59;
340
+ --md-sys-color-outline: 147 143 153;
341
+ --md-sys-color-outline-variant: 73 69 79;
342
+ --md-sys-color-shadow: 0 0 0;
343
+ --md-sys-color-scrim: 0 0 0;
344
+ --md-sys-color-surface-tint: 208 188 255;
345
+ --md-sys-color-inverse-surface: 230 224 233;
346
+ --md-sys-color-inverse-on-surface: 50 47 53;
347
+ --md-sys-color-inverse-primary: 103 80 164;
348
+ --md-sys-color-primary-fixed: 234 221 255;
349
+ --md-sys-color-primary-fixed-dim: 208 188 255;
350
+ --md-sys-color-on-primary-fixed: 33 0 93;
351
+ --md-sys-color-on-primary-fixed-variant: 79 55 139;
352
+ --md-sys-color-secondary-fixed: 232 222 248;
353
+ --md-sys-color-secondary-fixed-dim: 204 194 220;
354
+ --md-sys-color-on-secondary-fixed: 29 25 43;
355
+ --md-sys-color-on-secondary-fixed-variant: 74 68 88;
356
+ --md-sys-color-tertiary-fixed: 255 216 228;
357
+ --md-sys-color-tertiary-fixed-dim: 239 184 200;
358
+ --md-sys-color-on-tertiary-fixed: 49 17 29;
359
+ --md-sys-color-on-tertiary-fixed-variant: 99 59 72;
360
+ }
361
+ }