@hanzo/design 0.1.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +23 -16
- package/README.md +60 -3
- package/assets/fonts/Geist-Variable.woff2 +0 -0
- package/assets/fonts/GeistMono-Variable.woff2 +0 -0
- package/assets/fonts/LICENSE-Geist.txt +92 -0
- package/dist/index.d.ts +36 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +60 -0
- package/dist/tokens.gen.d.ts +471 -0
- package/dist/tokens.gen.d.ts.map +1 -0
- package/dist/tokens.gen.js +472 -0
- package/guidelines/DESIGN.md +106 -0
- package/package.json +21 -3
- package/prompts/README.md +7 -0
- package/prompts/studio-designer.md +41 -0
- package/src/index.ts +64 -0
- package/src/tokens.gen.ts +486 -0
- package/styles.css +4 -1
- package/tokens/base.css +7 -3
- package/tokens/colors.css +30 -4
- package/tokens/elevation.css +12 -0
- package/tokens/fonts.css +30 -3
- package/tokens/typography.css +19 -0
- package/tokens/z.css +18 -9
- package/ui_kits/.gitkeep +0 -0
|
@@ -0,0 +1,471 @@
|
|
|
1
|
+
/** colors tokens (from tokens/colors.css). Values are raw CSS. */
|
|
2
|
+
export declare const colors: {
|
|
3
|
+
readonly 'neutral-50': "#FAFAFA";
|
|
4
|
+
readonly 'neutral-100': "#F5F5F5";
|
|
5
|
+
readonly 'neutral-200': "#E5E5E5";
|
|
6
|
+
readonly 'neutral-300': "#D4D4D4";
|
|
7
|
+
readonly 'neutral-400': "#A3A3A3";
|
|
8
|
+
readonly 'neutral-500': "#737373";
|
|
9
|
+
readonly 'neutral-600': "#525252";
|
|
10
|
+
readonly 'neutral-700': "#404040";
|
|
11
|
+
readonly 'neutral-800': "#262626";
|
|
12
|
+
readonly 'neutral-900': "#171717";
|
|
13
|
+
readonly 'neutral-950': "#0A0A0A";
|
|
14
|
+
readonly 'pure-black': "#000000";
|
|
15
|
+
readonly 'pure-white': "#FFFFFF";
|
|
16
|
+
readonly 'hanzo-black': "#0A0A0B";
|
|
17
|
+
readonly 'hanzo-white': "#FFFFFF";
|
|
18
|
+
readonly 'white-05': "rgb(255 255 255 / .05)";
|
|
19
|
+
readonly 'white-10': "rgb(255 255 255 / .10)";
|
|
20
|
+
readonly 'white-15': "rgb(255 255 255 / .15)";
|
|
21
|
+
readonly 'white-20': "rgb(255 255 255 / .20)";
|
|
22
|
+
readonly 'white-30': "rgb(255 255 255 / .30)";
|
|
23
|
+
readonly 'white-40': "rgb(255 255 255 / .40)";
|
|
24
|
+
readonly 'white-60': "rgb(255 255 255 / .60)";
|
|
25
|
+
readonly 'white-80': "rgb(255 255 255 / .80)";
|
|
26
|
+
readonly background: "#000000";
|
|
27
|
+
readonly foreground: "#ededed";
|
|
28
|
+
readonly card: "#0a0a0a";
|
|
29
|
+
readonly 'card-foreground': "#f5f5f5";
|
|
30
|
+
readonly popover: "#0a0a0a";
|
|
31
|
+
readonly 'popover-foreground': "#f5f5f5";
|
|
32
|
+
readonly primary: "#ffffff";
|
|
33
|
+
readonly 'primary-foreground': "#000000";
|
|
34
|
+
readonly secondary: "#1a1a1a";
|
|
35
|
+
readonly 'secondary-foreground': "#f5f5f5";
|
|
36
|
+
readonly muted: "#101010";
|
|
37
|
+
readonly 'muted-foreground': "#888888";
|
|
38
|
+
readonly accent: "#1a1a1a";
|
|
39
|
+
readonly 'accent-foreground': "#f5f5f5";
|
|
40
|
+
readonly destructive: "#666666";
|
|
41
|
+
readonly 'destructive-foreground': "#f5f5f5";
|
|
42
|
+
readonly border: "#1f1f1f";
|
|
43
|
+
readonly input: "#1f1f1f";
|
|
44
|
+
readonly ring: "var(--neutral-500)";
|
|
45
|
+
readonly brand: "#e4e4e7";
|
|
46
|
+
readonly 'brand-foreground': "#09090b";
|
|
47
|
+
readonly 'brand-muted': "#a3a3a3";
|
|
48
|
+
readonly black: "#000000";
|
|
49
|
+
readonly white: "#f5f5f5";
|
|
50
|
+
readonly 'surface-page': "var(--background)";
|
|
51
|
+
readonly 'surface-card': "rgb(23 23 23 / .5)";
|
|
52
|
+
readonly 'surface-card-emphasis': "rgb(23 23 23 / .8)";
|
|
53
|
+
readonly 'surface-card-quiet': "rgb(23 23 23 / .4)";
|
|
54
|
+
readonly 'surface-overlay': "rgb(10 10 10 / .95)";
|
|
55
|
+
readonly 'surface-header': "rgb(0 0 0 / .7)";
|
|
56
|
+
readonly 'border-hairline': "var(--neutral-800)";
|
|
57
|
+
readonly 'border-card': "var(--white-10)";
|
|
58
|
+
readonly 'border-strong': "var(--neutral-500)";
|
|
59
|
+
readonly 'surface-0': "var(--background)";
|
|
60
|
+
readonly 'surface-1': "var(--card)";
|
|
61
|
+
readonly 'surface-2': "var(--muted)";
|
|
62
|
+
readonly 'surface-3': "var(--secondary)";
|
|
63
|
+
readonly 'text-primary': "var(--pure-white)";
|
|
64
|
+
readonly 'text-secondary': "var(--white-80)";
|
|
65
|
+
readonly 'text-tertiary': "var(--white-60)";
|
|
66
|
+
readonly 'text-helper': "var(--muted-foreground)";
|
|
67
|
+
readonly 'text-disabled': "var(--white-30)";
|
|
68
|
+
readonly 'state-error': "#ef4444";
|
|
69
|
+
readonly 'state-error-text': "#fca5a5";
|
|
70
|
+
readonly 'state-error-bg': "rgb(239 68 68 / .1)";
|
|
71
|
+
readonly 'state-online': "#4ade80";
|
|
72
|
+
readonly 'state-success': "#22c55e";
|
|
73
|
+
readonly 'chrome-dot-red': "rgb(239 68 68 / .6)";
|
|
74
|
+
readonly 'chrome-dot-yellow': "rgb(234 179 8 / .6)";
|
|
75
|
+
readonly 'chrome-dot-green': "rgb(34 197 94 / .6)";
|
|
76
|
+
};
|
|
77
|
+
/** typography tokens (from tokens/typography.css). Values are raw CSS. */
|
|
78
|
+
export declare const typography: {
|
|
79
|
+
readonly 'text-xs': "0.6875rem";
|
|
80
|
+
readonly 'leading-xs': "1rem";
|
|
81
|
+
readonly 'text-sm': "0.8125rem";
|
|
82
|
+
readonly 'leading-sm': "1.15rem";
|
|
83
|
+
readonly 'text-base': "0.875rem";
|
|
84
|
+
readonly 'leading-base': "1.35rem";
|
|
85
|
+
readonly 'text-lg': "0.9375rem";
|
|
86
|
+
readonly 'leading-lg': "1.4rem";
|
|
87
|
+
readonly 'text-xl': "1.0625rem";
|
|
88
|
+
readonly 'leading-xl': "1.55rem";
|
|
89
|
+
readonly 'text-2xl': "1.3125rem";
|
|
90
|
+
readonly 'leading-2xl': "1.7rem";
|
|
91
|
+
readonly 'text-3xl': "1.625rem";
|
|
92
|
+
readonly 'leading-3xl': "1.95rem";
|
|
93
|
+
readonly 'text-4xl': "2rem";
|
|
94
|
+
readonly 'leading-4xl': "2.25rem";
|
|
95
|
+
readonly 'text-5xl': "2.5rem";
|
|
96
|
+
readonly 'leading-5xl': "1.05";
|
|
97
|
+
readonly 'text-6xl': "3.25rem";
|
|
98
|
+
readonly 'leading-6xl': "1";
|
|
99
|
+
readonly 'text-7xl': "4rem";
|
|
100
|
+
readonly 'leading-7xl': "1";
|
|
101
|
+
readonly 'text-8xl': "5.25rem";
|
|
102
|
+
readonly 'leading-8xl': "1";
|
|
103
|
+
readonly 'text-9xl': "7rem";
|
|
104
|
+
readonly 'leading-9xl': "1";
|
|
105
|
+
readonly 'font-size-xs': "var(--text-xs)";
|
|
106
|
+
readonly 'font-size-sm': "var(--text-sm)";
|
|
107
|
+
readonly 'font-size-base': "var(--text-base)";
|
|
108
|
+
readonly 'font-size-lg': "var(--text-lg)";
|
|
109
|
+
readonly 'font-size-xl': "var(--text-xl)";
|
|
110
|
+
readonly 'font-size-2xl': "var(--text-2xl)";
|
|
111
|
+
readonly 'font-size-3xl': "var(--text-3xl)";
|
|
112
|
+
readonly 'font-size-4xl': "var(--text-4xl)";
|
|
113
|
+
readonly 'font-size-5xl': "var(--text-5xl)";
|
|
114
|
+
readonly 'font-size-6xl': "var(--text-6xl)";
|
|
115
|
+
readonly 'font-size-7xl': "var(--text-7xl)";
|
|
116
|
+
readonly 'font-size-8xl': "var(--text-8xl)";
|
|
117
|
+
readonly 'font-size-9xl': "var(--text-9xl)";
|
|
118
|
+
readonly 'weight-normal': "400";
|
|
119
|
+
readonly 'weight-medium': "500";
|
|
120
|
+
readonly 'weight-semibold': "600";
|
|
121
|
+
readonly 'weight-bold': "700";
|
|
122
|
+
readonly 'tracking-tight': "-0.025em";
|
|
123
|
+
readonly 'tracking-normal': "0em";
|
|
124
|
+
readonly 'tracking-wide': "0.025em";
|
|
125
|
+
readonly 'tracking-widest': "0.1em";
|
|
126
|
+
readonly 'leading-none': "1";
|
|
127
|
+
readonly 'leading-tight': "1.25";
|
|
128
|
+
readonly 'leading-snug': "1.375";
|
|
129
|
+
readonly 'leading-normal': "1.5";
|
|
130
|
+
readonly 'leading-relaxed': "1.625";
|
|
131
|
+
readonly 'leading-golden': "1.618";
|
|
132
|
+
readonly 'type-hero': "600 var(--text-5xl)/1.05 var(--font-display)";
|
|
133
|
+
readonly 'type-h2': "700 var(--text-4xl)/var(--leading-4xl) var(--font-display)";
|
|
134
|
+
readonly 'type-h3': "600 var(--text-xl)/var(--leading-xl) var(--font-display)";
|
|
135
|
+
readonly 'type-lead': "400 var(--text-lg)/var(--leading-relaxed) var(--font-sans)";
|
|
136
|
+
readonly 'type-body': "400 var(--text-sm)/var(--leading-sm) var(--font-sans)";
|
|
137
|
+
readonly 'type-caption': "400 var(--text-xs)/var(--leading-xs) var(--font-sans)";
|
|
138
|
+
readonly 'type-code': "400 var(--text-sm)/var(--leading-relaxed) var(--font-mono)";
|
|
139
|
+
readonly 'type-eyebrow': "600 0.625rem/1 var(--font-sans)";
|
|
140
|
+
};
|
|
141
|
+
/** spacing tokens (from tokens/spacing.css). Values are raw CSS. */
|
|
142
|
+
export declare const spacing: {
|
|
143
|
+
readonly 'space-0': "0";
|
|
144
|
+
readonly 'space-1': "0.25rem";
|
|
145
|
+
readonly 'space-2': "0.5rem";
|
|
146
|
+
readonly 'space-3': "0.75rem";
|
|
147
|
+
readonly 'space-4': "1rem";
|
|
148
|
+
readonly 'space-5': "1.25rem";
|
|
149
|
+
readonly 'space-6': "1.5rem";
|
|
150
|
+
readonly 'space-8': "2rem";
|
|
151
|
+
readonly 'space-10': "2.5rem";
|
|
152
|
+
readonly 'space-12': "3rem";
|
|
153
|
+
readonly 'space-14': "3.5rem";
|
|
154
|
+
readonly 'space-16': "4rem";
|
|
155
|
+
readonly 'space-20': "5rem";
|
|
156
|
+
readonly 'space-24': "6rem";
|
|
157
|
+
readonly 'space-32': "8rem";
|
|
158
|
+
readonly 'golden-1': "0.25rem";
|
|
159
|
+
readonly 'golden-2': "0.405rem";
|
|
160
|
+
readonly 'golden-3': "0.654rem";
|
|
161
|
+
readonly 'golden-4': "1.059rem";
|
|
162
|
+
readonly 'golden-5': "1.713rem";
|
|
163
|
+
readonly 'golden-6': "2.772rem";
|
|
164
|
+
readonly 'golden-7': "4.487rem";
|
|
165
|
+
readonly 'golden-8': "7.26rem";
|
|
166
|
+
readonly 'golden-9': "11.749rem";
|
|
167
|
+
readonly 'golden-split': "38.2% 61.8%";
|
|
168
|
+
readonly 'container-max': "80rem";
|
|
169
|
+
readonly 'container-prose': "48rem";
|
|
170
|
+
readonly 'container-wide': "72rem";
|
|
171
|
+
readonly gutter: "1rem";
|
|
172
|
+
readonly 'gutter-sm': "1.5rem";
|
|
173
|
+
readonly 'gutter-lg': "2rem";
|
|
174
|
+
readonly 'section-y': "4rem";
|
|
175
|
+
readonly 'section-y-lg': "6rem";
|
|
176
|
+
readonly 'hero-y': "5rem";
|
|
177
|
+
readonly 'hero-y-lg': "8rem";
|
|
178
|
+
readonly 'header-height': "4rem";
|
|
179
|
+
};
|
|
180
|
+
/** radius tokens (from tokens/radius.css). Values are raw CSS. */
|
|
181
|
+
export declare const radius: {
|
|
182
|
+
readonly radius: "0.5rem";
|
|
183
|
+
readonly 'radius-sm': "0.375rem";
|
|
184
|
+
readonly 'radius-md': "0.5rem";
|
|
185
|
+
readonly 'radius-lg': "0.75rem";
|
|
186
|
+
readonly 'radius-xl': "1rem";
|
|
187
|
+
readonly 'radius-2xl': "1.5rem";
|
|
188
|
+
readonly 'radius-composer': "28px";
|
|
189
|
+
readonly 'radius-full': "9999px";
|
|
190
|
+
};
|
|
191
|
+
/** elevation tokens (from tokens/elevation.css). Values are raw CSS. */
|
|
192
|
+
export declare const elevation: {
|
|
193
|
+
readonly 'shadow-none': "none";
|
|
194
|
+
readonly 'shadow-floating': "0 25px 50px -12px rgb(0 0 0 / .25)";
|
|
195
|
+
readonly 'shadow-inset-hairline': "inset 0 0 0 1px var(--white-10)";
|
|
196
|
+
readonly 'ring-focus': "0 0 0 2px var(--ring)";
|
|
197
|
+
readonly 'shadow-sm': "0 1px 2px 0 rgb(0 0 0 / .40)";
|
|
198
|
+
readonly shadow: "0 1px 3px 0 rgb(0 0 0 / .45), 0 1px 2px -1px rgb(0 0 0 / .45)";
|
|
199
|
+
readonly 'shadow-md': "0 4px 6px -1px rgb(0 0 0 / .50), 0 2px 4px -2px rgb(0 0 0 / .50)";
|
|
200
|
+
readonly 'shadow-lg': "0 10px 15px -3px rgb(0 0 0 / .55), 0 4px 6px -4px rgb(0 0 0 / .55)";
|
|
201
|
+
readonly 'shadow-xl': "0 20px 25px -5px rgb(0 0 0 / .60), 0 8px 10px -6px rgb(0 0 0 / .60)";
|
|
202
|
+
readonly 'shadow-2xl': "var(--shadow-floating)";
|
|
203
|
+
readonly 'glow-hero': "radial-gradient(circle,rgb(255 255 255 / .12) 0%,transparent 68%)";
|
|
204
|
+
readonly 'glow-hero-blur': "120px";
|
|
205
|
+
readonly 'sheen-card': "radial-gradient(120% 120% at 80% 0%,rgb(255 255 255 / .08) 0%,transparent 55%)";
|
|
206
|
+
readonly 'gradient-chrome': "linear-gradient(to right,#ffffff,var(--white-80),var(--white-60))";
|
|
207
|
+
readonly 'gradient-chrome-2': "linear-gradient(to right,#ffffff,var(--neutral-500))";
|
|
208
|
+
readonly 'gradient-protect': "linear-gradient(to bottom,var(--white-10),transparent)";
|
|
209
|
+
};
|
|
210
|
+
/** motion tokens (from tokens/motion.css). Values are raw CSS. */
|
|
211
|
+
export declare const motion: {
|
|
212
|
+
readonly 'duration-fast': "150ms";
|
|
213
|
+
readonly 'duration-base': "300ms";
|
|
214
|
+
readonly 'duration-slow': "400ms";
|
|
215
|
+
readonly 'duration-slower': "500ms";
|
|
216
|
+
readonly 'duration-glow': "9s";
|
|
217
|
+
readonly 'ease-out': "cubic-bezier(0,0,0.2,1)";
|
|
218
|
+
readonly 'ease-in-out': "cubic-bezier(0.4,0,0.2,1)";
|
|
219
|
+
readonly stagger: "60ms";
|
|
220
|
+
readonly 'entry-rise': "16px";
|
|
221
|
+
readonly 'entry-rise-lg': "24px";
|
|
222
|
+
};
|
|
223
|
+
/** zIndex tokens (from tokens/z.css). Values are raw CSS. */
|
|
224
|
+
export declare const zIndex: {
|
|
225
|
+
readonly 'z-base': "0";
|
|
226
|
+
readonly 'z-raised': "10";
|
|
227
|
+
readonly 'z-sticky': "200";
|
|
228
|
+
readonly 'z-header': "300";
|
|
229
|
+
readonly 'z-dropdown': "400";
|
|
230
|
+
readonly 'z-overlay': "500";
|
|
231
|
+
readonly 'z-modal': "600";
|
|
232
|
+
readonly 'z-popover': "700";
|
|
233
|
+
readonly 'z-toast': "800";
|
|
234
|
+
readonly 'z-tooltip': "var(--z-popover)";
|
|
235
|
+
readonly 'z-notification': "var(--z-toast)";
|
|
236
|
+
};
|
|
237
|
+
/** fonts tokens (from tokens/fonts.css). Values are raw CSS. */
|
|
238
|
+
export declare const fonts: {
|
|
239
|
+
readonly 'font-sans': "\"Geist\",\"Geist Sans\",ui-sans-serif,system-ui,sans-serif";
|
|
240
|
+
readonly 'font-display': "var(--font-sans)";
|
|
241
|
+
readonly 'font-mono': "\"Geist Mono\",ui-monospace,SFMono-Regular,monospace";
|
|
242
|
+
readonly 'font-serif': "Georgia,serif";
|
|
243
|
+
readonly 'font-feature-settings': "\"ss01\",\"ss02\",\"cv01\",\"cv02\",\"cv03\"";
|
|
244
|
+
};
|
|
245
|
+
/** base tokens (from tokens/base.css). Values are raw CSS. */
|
|
246
|
+
export declare const base: {};
|
|
247
|
+
/** Every token, keyed by its literal CSS custom-property name ('--background', …). */
|
|
248
|
+
export declare const cssVars: {
|
|
249
|
+
readonly '--neutral-50': "#FAFAFA";
|
|
250
|
+
readonly '--neutral-100': "#F5F5F5";
|
|
251
|
+
readonly '--neutral-200': "#E5E5E5";
|
|
252
|
+
readonly '--neutral-300': "#D4D4D4";
|
|
253
|
+
readonly '--neutral-400': "#A3A3A3";
|
|
254
|
+
readonly '--neutral-500': "#737373";
|
|
255
|
+
readonly '--neutral-600': "#525252";
|
|
256
|
+
readonly '--neutral-700': "#404040";
|
|
257
|
+
readonly '--neutral-800': "#262626";
|
|
258
|
+
readonly '--neutral-900': "#171717";
|
|
259
|
+
readonly '--neutral-950': "#0A0A0A";
|
|
260
|
+
readonly '--pure-black': "#000000";
|
|
261
|
+
readonly '--pure-white': "#FFFFFF";
|
|
262
|
+
readonly '--hanzo-black': "#0A0A0B";
|
|
263
|
+
readonly '--hanzo-white': "#FFFFFF";
|
|
264
|
+
readonly '--white-05': "rgb(255 255 255 / .05)";
|
|
265
|
+
readonly '--white-10': "rgb(255 255 255 / .10)";
|
|
266
|
+
readonly '--white-15': "rgb(255 255 255 / .15)";
|
|
267
|
+
readonly '--white-20': "rgb(255 255 255 / .20)";
|
|
268
|
+
readonly '--white-30': "rgb(255 255 255 / .30)";
|
|
269
|
+
readonly '--white-40': "rgb(255 255 255 / .40)";
|
|
270
|
+
readonly '--white-60': "rgb(255 255 255 / .60)";
|
|
271
|
+
readonly '--white-80': "rgb(255 255 255 / .80)";
|
|
272
|
+
readonly '--background': "#000000";
|
|
273
|
+
readonly '--foreground': "#ededed";
|
|
274
|
+
readonly '--card': "#0a0a0a";
|
|
275
|
+
readonly '--card-foreground': "#f5f5f5";
|
|
276
|
+
readonly '--popover': "#0a0a0a";
|
|
277
|
+
readonly '--popover-foreground': "#f5f5f5";
|
|
278
|
+
readonly '--primary': "#ffffff";
|
|
279
|
+
readonly '--primary-foreground': "#000000";
|
|
280
|
+
readonly '--secondary': "#1a1a1a";
|
|
281
|
+
readonly '--secondary-foreground': "#f5f5f5";
|
|
282
|
+
readonly '--muted': "#101010";
|
|
283
|
+
readonly '--muted-foreground': "#888888";
|
|
284
|
+
readonly '--accent': "#1a1a1a";
|
|
285
|
+
readonly '--accent-foreground': "#f5f5f5";
|
|
286
|
+
readonly '--destructive': "#666666";
|
|
287
|
+
readonly '--destructive-foreground': "#f5f5f5";
|
|
288
|
+
readonly '--border': "#1f1f1f";
|
|
289
|
+
readonly '--input': "#1f1f1f";
|
|
290
|
+
readonly '--ring': "var(--neutral-500)";
|
|
291
|
+
readonly '--brand': "#e4e4e7";
|
|
292
|
+
readonly '--brand-foreground': "#09090b";
|
|
293
|
+
readonly '--brand-muted': "#a3a3a3";
|
|
294
|
+
readonly '--black': "#000000";
|
|
295
|
+
readonly '--white': "#f5f5f5";
|
|
296
|
+
readonly '--surface-page': "var(--background)";
|
|
297
|
+
readonly '--surface-card': "rgb(23 23 23 / .5)";
|
|
298
|
+
readonly '--surface-card-emphasis': "rgb(23 23 23 / .8)";
|
|
299
|
+
readonly '--surface-card-quiet': "rgb(23 23 23 / .4)";
|
|
300
|
+
readonly '--surface-overlay': "rgb(10 10 10 / .95)";
|
|
301
|
+
readonly '--surface-header': "rgb(0 0 0 / .7)";
|
|
302
|
+
readonly '--border-hairline': "var(--neutral-800)";
|
|
303
|
+
readonly '--border-card': "var(--white-10)";
|
|
304
|
+
readonly '--border-strong': "var(--neutral-500)";
|
|
305
|
+
readonly '--surface-0': "var(--background)";
|
|
306
|
+
readonly '--surface-1': "var(--card)";
|
|
307
|
+
readonly '--surface-2': "var(--muted)";
|
|
308
|
+
readonly '--surface-3': "var(--secondary)";
|
|
309
|
+
readonly '--text-primary': "var(--pure-white)";
|
|
310
|
+
readonly '--text-secondary': "var(--white-80)";
|
|
311
|
+
readonly '--text-tertiary': "var(--white-60)";
|
|
312
|
+
readonly '--text-helper': "var(--muted-foreground)";
|
|
313
|
+
readonly '--text-disabled': "var(--white-30)";
|
|
314
|
+
readonly '--state-error': "#ef4444";
|
|
315
|
+
readonly '--state-error-text': "#fca5a5";
|
|
316
|
+
readonly '--state-error-bg': "rgb(239 68 68 / .1)";
|
|
317
|
+
readonly '--state-online': "#4ade80";
|
|
318
|
+
readonly '--state-success': "#22c55e";
|
|
319
|
+
readonly '--chrome-dot-red': "rgb(239 68 68 / .6)";
|
|
320
|
+
readonly '--chrome-dot-yellow': "rgb(234 179 8 / .6)";
|
|
321
|
+
readonly '--chrome-dot-green': "rgb(34 197 94 / .6)";
|
|
322
|
+
readonly '--text-xs': "0.6875rem";
|
|
323
|
+
readonly '--leading-xs': "1rem";
|
|
324
|
+
readonly '--text-sm': "0.8125rem";
|
|
325
|
+
readonly '--leading-sm': "1.15rem";
|
|
326
|
+
readonly '--text-base': "0.875rem";
|
|
327
|
+
readonly '--leading-base': "1.35rem";
|
|
328
|
+
readonly '--text-lg': "0.9375rem";
|
|
329
|
+
readonly '--leading-lg': "1.4rem";
|
|
330
|
+
readonly '--text-xl': "1.0625rem";
|
|
331
|
+
readonly '--leading-xl': "1.55rem";
|
|
332
|
+
readonly '--text-2xl': "1.3125rem";
|
|
333
|
+
readonly '--leading-2xl': "1.7rem";
|
|
334
|
+
readonly '--text-3xl': "1.625rem";
|
|
335
|
+
readonly '--leading-3xl': "1.95rem";
|
|
336
|
+
readonly '--text-4xl': "2rem";
|
|
337
|
+
readonly '--leading-4xl': "2.25rem";
|
|
338
|
+
readonly '--text-5xl': "2.5rem";
|
|
339
|
+
readonly '--leading-5xl': "1.05";
|
|
340
|
+
readonly '--text-6xl': "3.25rem";
|
|
341
|
+
readonly '--leading-6xl': "1";
|
|
342
|
+
readonly '--text-7xl': "4rem";
|
|
343
|
+
readonly '--leading-7xl': "1";
|
|
344
|
+
readonly '--text-8xl': "5.25rem";
|
|
345
|
+
readonly '--leading-8xl': "1";
|
|
346
|
+
readonly '--text-9xl': "7rem";
|
|
347
|
+
readonly '--leading-9xl': "1";
|
|
348
|
+
readonly '--font-size-xs': "var(--text-xs)";
|
|
349
|
+
readonly '--font-size-sm': "var(--text-sm)";
|
|
350
|
+
readonly '--font-size-base': "var(--text-base)";
|
|
351
|
+
readonly '--font-size-lg': "var(--text-lg)";
|
|
352
|
+
readonly '--font-size-xl': "var(--text-xl)";
|
|
353
|
+
readonly '--font-size-2xl': "var(--text-2xl)";
|
|
354
|
+
readonly '--font-size-3xl': "var(--text-3xl)";
|
|
355
|
+
readonly '--font-size-4xl': "var(--text-4xl)";
|
|
356
|
+
readonly '--font-size-5xl': "var(--text-5xl)";
|
|
357
|
+
readonly '--font-size-6xl': "var(--text-6xl)";
|
|
358
|
+
readonly '--font-size-7xl': "var(--text-7xl)";
|
|
359
|
+
readonly '--font-size-8xl': "var(--text-8xl)";
|
|
360
|
+
readonly '--font-size-9xl': "var(--text-9xl)";
|
|
361
|
+
readonly '--weight-normal': "400";
|
|
362
|
+
readonly '--weight-medium': "500";
|
|
363
|
+
readonly '--weight-semibold': "600";
|
|
364
|
+
readonly '--weight-bold': "700";
|
|
365
|
+
readonly '--tracking-tight': "-0.025em";
|
|
366
|
+
readonly '--tracking-normal': "0em";
|
|
367
|
+
readonly '--tracking-wide': "0.025em";
|
|
368
|
+
readonly '--tracking-widest': "0.1em";
|
|
369
|
+
readonly '--leading-none': "1";
|
|
370
|
+
readonly '--leading-tight': "1.25";
|
|
371
|
+
readonly '--leading-snug': "1.375";
|
|
372
|
+
readonly '--leading-normal': "1.5";
|
|
373
|
+
readonly '--leading-relaxed': "1.625";
|
|
374
|
+
readonly '--leading-golden': "1.618";
|
|
375
|
+
readonly '--type-hero': "600 var(--text-5xl)/1.05 var(--font-display)";
|
|
376
|
+
readonly '--type-h2': "700 var(--text-4xl)/var(--leading-4xl) var(--font-display)";
|
|
377
|
+
readonly '--type-h3': "600 var(--text-xl)/var(--leading-xl) var(--font-display)";
|
|
378
|
+
readonly '--type-lead': "400 var(--text-lg)/var(--leading-relaxed) var(--font-sans)";
|
|
379
|
+
readonly '--type-body': "400 var(--text-sm)/var(--leading-sm) var(--font-sans)";
|
|
380
|
+
readonly '--type-caption': "400 var(--text-xs)/var(--leading-xs) var(--font-sans)";
|
|
381
|
+
readonly '--type-code': "400 var(--text-sm)/var(--leading-relaxed) var(--font-mono)";
|
|
382
|
+
readonly '--type-eyebrow': "600 0.625rem/1 var(--font-sans)";
|
|
383
|
+
readonly '--space-0': "0";
|
|
384
|
+
readonly '--space-1': "0.25rem";
|
|
385
|
+
readonly '--space-2': "0.5rem";
|
|
386
|
+
readonly '--space-3': "0.75rem";
|
|
387
|
+
readonly '--space-4': "1rem";
|
|
388
|
+
readonly '--space-5': "1.25rem";
|
|
389
|
+
readonly '--space-6': "1.5rem";
|
|
390
|
+
readonly '--space-8': "2rem";
|
|
391
|
+
readonly '--space-10': "2.5rem";
|
|
392
|
+
readonly '--space-12': "3rem";
|
|
393
|
+
readonly '--space-14': "3.5rem";
|
|
394
|
+
readonly '--space-16': "4rem";
|
|
395
|
+
readonly '--space-20': "5rem";
|
|
396
|
+
readonly '--space-24': "6rem";
|
|
397
|
+
readonly '--space-32': "8rem";
|
|
398
|
+
readonly '--golden-1': "0.25rem";
|
|
399
|
+
readonly '--golden-2': "0.405rem";
|
|
400
|
+
readonly '--golden-3': "0.654rem";
|
|
401
|
+
readonly '--golden-4': "1.059rem";
|
|
402
|
+
readonly '--golden-5': "1.713rem";
|
|
403
|
+
readonly '--golden-6': "2.772rem";
|
|
404
|
+
readonly '--golden-7': "4.487rem";
|
|
405
|
+
readonly '--golden-8': "7.26rem";
|
|
406
|
+
readonly '--golden-9': "11.749rem";
|
|
407
|
+
readonly '--golden-split': "38.2% 61.8%";
|
|
408
|
+
readonly '--container-max': "80rem";
|
|
409
|
+
readonly '--container-prose': "48rem";
|
|
410
|
+
readonly '--container-wide': "72rem";
|
|
411
|
+
readonly '--gutter': "1rem";
|
|
412
|
+
readonly '--gutter-sm': "1.5rem";
|
|
413
|
+
readonly '--gutter-lg': "2rem";
|
|
414
|
+
readonly '--section-y': "4rem";
|
|
415
|
+
readonly '--section-y-lg': "6rem";
|
|
416
|
+
readonly '--hero-y': "5rem";
|
|
417
|
+
readonly '--hero-y-lg': "8rem";
|
|
418
|
+
readonly '--header-height': "4rem";
|
|
419
|
+
readonly '--radius': "0.5rem";
|
|
420
|
+
readonly '--radius-sm': "0.375rem";
|
|
421
|
+
readonly '--radius-md': "0.5rem";
|
|
422
|
+
readonly '--radius-lg': "0.75rem";
|
|
423
|
+
readonly '--radius-xl': "1rem";
|
|
424
|
+
readonly '--radius-2xl': "1.5rem";
|
|
425
|
+
readonly '--radius-composer': "28px";
|
|
426
|
+
readonly '--radius-full': "9999px";
|
|
427
|
+
readonly '--shadow-none': "none";
|
|
428
|
+
readonly '--shadow-floating': "0 25px 50px -12px rgb(0 0 0 / .25)";
|
|
429
|
+
readonly '--shadow-inset-hairline': "inset 0 0 0 1px var(--white-10)";
|
|
430
|
+
readonly '--ring-focus': "0 0 0 2px var(--ring)";
|
|
431
|
+
readonly '--shadow-sm': "0 1px 2px 0 rgb(0 0 0 / .40)";
|
|
432
|
+
readonly '--shadow': "0 1px 3px 0 rgb(0 0 0 / .45), 0 1px 2px -1px rgb(0 0 0 / .45)";
|
|
433
|
+
readonly '--shadow-md': "0 4px 6px -1px rgb(0 0 0 / .50), 0 2px 4px -2px rgb(0 0 0 / .50)";
|
|
434
|
+
readonly '--shadow-lg': "0 10px 15px -3px rgb(0 0 0 / .55), 0 4px 6px -4px rgb(0 0 0 / .55)";
|
|
435
|
+
readonly '--shadow-xl': "0 20px 25px -5px rgb(0 0 0 / .60), 0 8px 10px -6px rgb(0 0 0 / .60)";
|
|
436
|
+
readonly '--shadow-2xl': "var(--shadow-floating)";
|
|
437
|
+
readonly '--glow-hero': "radial-gradient(circle,rgb(255 255 255 / .12) 0%,transparent 68%)";
|
|
438
|
+
readonly '--glow-hero-blur': "120px";
|
|
439
|
+
readonly '--sheen-card': "radial-gradient(120% 120% at 80% 0%,rgb(255 255 255 / .08) 0%,transparent 55%)";
|
|
440
|
+
readonly '--gradient-chrome': "linear-gradient(to right,#ffffff,var(--white-80),var(--white-60))";
|
|
441
|
+
readonly '--gradient-chrome-2': "linear-gradient(to right,#ffffff,var(--neutral-500))";
|
|
442
|
+
readonly '--gradient-protect': "linear-gradient(to bottom,var(--white-10),transparent)";
|
|
443
|
+
readonly '--duration-fast': "150ms";
|
|
444
|
+
readonly '--duration-base': "300ms";
|
|
445
|
+
readonly '--duration-slow': "400ms";
|
|
446
|
+
readonly '--duration-slower': "500ms";
|
|
447
|
+
readonly '--duration-glow': "9s";
|
|
448
|
+
readonly '--ease-out': "cubic-bezier(0,0,0.2,1)";
|
|
449
|
+
readonly '--ease-in-out': "cubic-bezier(0.4,0,0.2,1)";
|
|
450
|
+
readonly '--stagger': "60ms";
|
|
451
|
+
readonly '--entry-rise': "16px";
|
|
452
|
+
readonly '--entry-rise-lg': "24px";
|
|
453
|
+
readonly '--z-base': "0";
|
|
454
|
+
readonly '--z-raised': "10";
|
|
455
|
+
readonly '--z-sticky': "200";
|
|
456
|
+
readonly '--z-header': "300";
|
|
457
|
+
readonly '--z-dropdown': "400";
|
|
458
|
+
readonly '--z-overlay': "500";
|
|
459
|
+
readonly '--z-modal': "600";
|
|
460
|
+
readonly '--z-popover': "700";
|
|
461
|
+
readonly '--z-toast': "800";
|
|
462
|
+
readonly '--z-tooltip': "var(--z-popover)";
|
|
463
|
+
readonly '--z-notification': "var(--z-toast)";
|
|
464
|
+
readonly '--font-sans': "\"Geist\",\"Geist Sans\",ui-sans-serif,system-ui,sans-serif";
|
|
465
|
+
readonly '--font-display': "var(--font-sans)";
|
|
466
|
+
readonly '--font-mono': "\"Geist Mono\",ui-monospace,SFMono-Regular,monospace";
|
|
467
|
+
readonly '--font-serif': "Georgia,serif";
|
|
468
|
+
readonly '--font-feature-settings': "\"ss01\",\"ss02\",\"cv01\",\"cv02\",\"cv03\"";
|
|
469
|
+
};
|
|
470
|
+
export type CssVarName = keyof typeof cssVars;
|
|
471
|
+
//# sourceMappingURL=tokens.gen.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tokens.gen.d.ts","sourceRoot":"","sources":["../src/tokens.gen.ts"],"names":[],"mappings":"AAIA,kEAAkE;AAClE,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0ET,CAAA;AAEV,0EAA0E;AAC1E,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8Db,CAAA;AAEV,oEAAoE;AACpE,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqCV,CAAA;AAEV,kEAAkE;AAClE,eAAO,MAAM,MAAM;;;;;;;;;CAST,CAAA;AAEV,wEAAwE;AACxE,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;CAiBZ,CAAA;AAEV,kEAAkE;AAClE,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAA;AAEV,6DAA6D;AAC7D,eAAO,MAAM,MAAM;;;;;;;;;;;;CAYT,CAAA;AAEV,gEAAgE;AAChE,eAAO,MAAM,KAAK;;;;;;CAMR,CAAA;AAEV,8DAA8D;AAC9D,eAAO,MAAM,IAAI,IAEP,CAAA;AAEV,sFAAsF;AACtF,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6NV,CAAA;AAEV,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,OAAO,CAAA"}
|