@vibes.diy/prompts 2.2.10 → 2.2.11
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/index.d.ts +1 -0
- package/index.js +1 -0
- package/index.js.map +1 -1
- package/json-docs.d.ts +1 -1
- package/llms/image-gen.d.ts +2 -0
- package/llms/image-gen.js +9 -0
- package/llms/image-gen.js.map +1 -0
- package/llms/image-gen.md +102 -0
- package/llms/index.d.ts +1 -1
- package/llms/index.js +3 -3
- package/package.json +3 -3
- package/prompts.d.ts +6 -0
- package/prompts.js +36 -3
- package/prompts.js.map +1 -1
- package/settings.d.ts +1 -0
- package/system-prompt-initial.md +2 -2
- package/system-prompt.md +2 -2
- package/themes/aether.md +41 -0
- package/themes/archive.md +43 -0
- package/themes/atelier.md +42 -0
- package/themes/atlas.md +42 -0
- package/themes/broadsheet.md +20 -0
- package/themes/brutalist.md +208 -0
- package/themes/capsule.md +47 -0
- package/themes/carbon.md +42 -0
- package/themes/chrome.md +132 -0
- package/themes/chrono.md +33 -0
- package/themes/codex.md +45 -0
- package/themes/computer-angel-heaven.md +57 -0
- package/themes/console.md +46 -0
- package/themes/default.md +96 -0
- package/themes/desktop.md +49 -0
- package/themes/dial.md +46 -0
- package/themes/dossier.md +35 -0
- package/themes/edge.md +39 -0
- package/themes/exemplars/aether/App.jsx +224 -0
- package/themes/exemplars/archive/App.jsx +222 -0
- package/themes/exemplars/atelier/App.jsx +224 -0
- package/themes/exemplars/atlas/App.jsx +216 -0
- package/themes/exemplars/broadsheet/App.jsx +216 -0
- package/themes/exemplars/brutalist/App.jsx +290 -0
- package/themes/exemplars/capsule/App.jsx +216 -0
- package/themes/exemplars/carbon/App.jsx +216 -0
- package/themes/exemplars/chrome/App.jsx +253 -0
- package/themes/exemplars/chrono/App.jsx +222 -0
- package/themes/exemplars/codex/App.jsx +224 -0
- package/themes/exemplars/computer-angel-heaven/App.jsx +224 -0
- package/themes/exemplars/console/App.jsx +216 -0
- package/themes/exemplars/default/App.jsx +219 -0
- package/themes/exemplars/desktop/App.jsx +224 -0
- package/themes/exemplars/dial/App.jsx +216 -0
- package/themes/exemplars/dossier/App.jsx +224 -0
- package/themes/exemplars/edge/App.jsx +216 -0
- package/themes/exemplars/guild/App.jsx +224 -0
- package/themes/exemplars/hearth/App.jsx +224 -0
- package/themes/exemplars/industrial/App.jsx +224 -0
- package/themes/exemplars/matrix/App.jsx +224 -0
- package/themes/exemplars/mesh/App.jsx +222 -0
- package/themes/exemplars/neomario/App.jsx +222 -0
- package/themes/exemplars/neon/App.jsx +224 -0
- package/themes/exemplars/nexus/App.jsx +216 -0
- package/themes/exemplars/opus/App.jsx +224 -0
- package/themes/exemplars/orbit/App.jsx +224 -0
- package/themes/exemplars/palate/App.jsx +224 -0
- package/themes/exemplars/pitch/App.jsx +222 -0
- package/themes/exemplars/poster/App.jsx +222 -0
- package/themes/exemplars/proof/App.jsx +224 -0
- package/themes/exemplars/recon/App.jsx +216 -0
- package/themes/exemplars/rift/App.jsx +224 -0
- package/themes/exemplars/rune/App.jsx +224 -0
- package/themes/exemplars/scrapbook/App.jsx +222 -0
- package/themes/exemplars/sensor/App.jsx +224 -0
- package/themes/exemplars/signal/App.jsx +222 -0
- package/themes/exemplars/slab/App.jsx +224 -0
- package/themes/exemplars/specimen/App.jsx +222 -0
- package/themes/exemplars/terminal/App.jsx +224 -0
- package/themes/exemplars/vault/App.jsx +222 -0
- package/themes/exemplars/winter-sports/App.jsx +224 -0
- package/themes/exemplars/zine/App.jsx +214 -0
- package/themes/guild.md +44 -0
- package/themes/hearth.md +45 -0
- package/themes/index.d.ts +11 -0
- package/themes/index.js +272 -0
- package/themes/index.js.map +1 -0
- package/themes/industrial.md +37 -0
- package/themes/matrix.md +41 -0
- package/themes/mesh.md +42 -0
- package/themes/neomario.md +47 -0
- package/themes/neon.md +48 -0
- package/themes/nexus.md +40 -0
- package/themes/opus.md +61 -0
- package/themes/orbit.md +46 -0
- package/themes/palate.md +35 -0
- package/themes/pitch.md +39 -0
- package/themes/poster.md +39 -0
- package/themes/proof.md +41 -0
- package/themes/recon.md +39 -0
- package/themes/rift.md +45 -0
- package/themes/rune.md +44 -0
- package/themes/scrapbook.md +43 -0
- package/themes/sensor.md +42 -0
- package/themes/signal.md +37 -0
- package/themes/slab.md +35 -0
- package/themes/specimen.md +21 -0
- package/themes/terminal.md +39 -0
- package/themes/vault.md +41 -0
- package/themes/winter-sports.md +39 -0
- package/themes/zine.md +40 -0
- package/llms/img-vibes.d.ts +0 -2
- package/llms/img-vibes.js +0 -9
- package/llms/img-vibes.js.map +0 -1
- package/llms/img-vibes.md +0 -167
package/themes/index.js
ADDED
|
@@ -0,0 +1,272 @@
|
|
|
1
|
+
export const vibesThemes = [
|
|
2
|
+
{ slug: "aether", name: "Aether Brass", accentColor: "#cfa562", bgColor: "#dcbfa6", bodyFont: "'Special Elite', monospace" },
|
|
3
|
+
{
|
|
4
|
+
slug: "archive",
|
|
5
|
+
name: "Archive",
|
|
6
|
+
accentColor: "oklch(0.35 0.04 50)",
|
|
7
|
+
bgColor: "oklch(0.95 0.01 70)",
|
|
8
|
+
bodyFont: "'Inter', sans-serif",
|
|
9
|
+
},
|
|
10
|
+
{
|
|
11
|
+
slug: "atelier",
|
|
12
|
+
name: "Atelier Studio",
|
|
13
|
+
accentColor: "oklch(0.65 0.18 55)",
|
|
14
|
+
bgColor: "oklch(0.95 0.03 70)",
|
|
15
|
+
bodyFont: "'Playfair Display', serif",
|
|
16
|
+
},
|
|
17
|
+
{
|
|
18
|
+
slug: "atlas",
|
|
19
|
+
name: "Atlas Reference",
|
|
20
|
+
accentColor: "oklch(0.62 0.24 25)",
|
|
21
|
+
bgColor: "oklch(1.00 0 0)",
|
|
22
|
+
bodyFont: "var(--font-sans)",
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
slug: "broadsheet",
|
|
26
|
+
name: "Broadsheet",
|
|
27
|
+
accentColor: "#666",
|
|
28
|
+
bgColor: "#fff",
|
|
29
|
+
bodyFont: "'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
30
|
+
},
|
|
31
|
+
{ slug: "brutalist", name: "Neobrutalist", accentColor: "#DA291C", bgColor: "#f5f0e0", bodyFont: "'Space Grotesk', sans-serif" },
|
|
32
|
+
{
|
|
33
|
+
slug: "capsule",
|
|
34
|
+
name: "Capsule Split",
|
|
35
|
+
accentColor: "oklch(0.00 0 0)",
|
|
36
|
+
bgColor: "oklch(0.89 0.20 110)",
|
|
37
|
+
bodyFont: "var(--font-main)",
|
|
38
|
+
},
|
|
39
|
+
{
|
|
40
|
+
slug: "carbon",
|
|
41
|
+
name: "Carbon Panel",
|
|
42
|
+
accentColor: "oklch(0.79 0.18 75)",
|
|
43
|
+
bgColor: "oklch(0.18 0.005 285)",
|
|
44
|
+
bodyFont: "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",
|
|
45
|
+
},
|
|
46
|
+
{ slug: "chrome", name: "Chrome Terminal", accentColor: "#ff003c", bgColor: "#000000", bodyFont: "'Rajdhani', sans-serif" },
|
|
47
|
+
{ slug: "chrono", name: "Chrono", accentColor: "#6c8ee6", bgColor: "#dde1e7", bodyFont: "'Inter', sans-serif" },
|
|
48
|
+
{
|
|
49
|
+
slug: "codex",
|
|
50
|
+
name: "Elder Codex",
|
|
51
|
+
accentColor: "oklch(0.17 0.000 0)",
|
|
52
|
+
bgColor: "oklch(0.06 0.000 0)",
|
|
53
|
+
bodyFont: "'Cinzel', serif",
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
slug: "computer-angel-heaven",
|
|
57
|
+
name: "Computer Angel Heaven",
|
|
58
|
+
accentColor: "oklch(0.78 0.12 85)",
|
|
59
|
+
bgColor: "oklch(0.96 0.008 80)",
|
|
60
|
+
bodyFont: "'Inter', 'SF Pro Display', system-ui, sans-serif",
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
slug: "console",
|
|
64
|
+
name: "Console Rack",
|
|
65
|
+
accentColor: "oklch(0.58 0.20 35)",
|
|
66
|
+
bgColor: "oklch(0.93 0.003 265)",
|
|
67
|
+
bodyFont: "var(--font-ui)",
|
|
68
|
+
},
|
|
69
|
+
{
|
|
70
|
+
slug: "default",
|
|
71
|
+
name: "Default",
|
|
72
|
+
accentColor: "oklch(0.62 0.18 65)",
|
|
73
|
+
bgColor: "oklch(0.97 0.01 80)",
|
|
74
|
+
bodyFont: "'Inter', sans-serif",
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
slug: "desktop",
|
|
78
|
+
name: "Desktop Retro",
|
|
79
|
+
accentColor: "oklch(0.11 0.01 250)",
|
|
80
|
+
bgColor: "#fff",
|
|
81
|
+
bodyFont: "'JetBrains Mono', monospace",
|
|
82
|
+
},
|
|
83
|
+
{
|
|
84
|
+
slug: "dial",
|
|
85
|
+
name: "Dial Apparatus",
|
|
86
|
+
accentColor: "oklch(0.62 0.24 28)",
|
|
87
|
+
bgColor: "oklch(0.24 0.01 260)",
|
|
88
|
+
bodyFont: "var(--font-ui)",
|
|
89
|
+
},
|
|
90
|
+
{
|
|
91
|
+
slug: "dossier",
|
|
92
|
+
name: "Dossier Card",
|
|
93
|
+
accentColor: "#666",
|
|
94
|
+
bgColor: "oklch(0.16 0.000 0)",
|
|
95
|
+
bodyFont: "'Roboto Mono', monospace",
|
|
96
|
+
},
|
|
97
|
+
{ slug: "edge", name: "EDGE INTERFACE", accentColor: "#ff0077", bgColor: "#fff", bodyFont: "var(--font-body)" },
|
|
98
|
+
{
|
|
99
|
+
slug: "guild",
|
|
100
|
+
name: "Guild Ledger",
|
|
101
|
+
accentColor: "oklch(0.60 0.13 80)",
|
|
102
|
+
bgColor: "oklch(0.10 0.03 260)",
|
|
103
|
+
bodyFont: "'Cinzel', serif",
|
|
104
|
+
},
|
|
105
|
+
{ slug: "hearth", name: "Hearth Sim", accentColor: "oklch(0.38 0.17 295)", bgColor: "#fff", bodyFont: "'Nunito', sans-serif" },
|
|
106
|
+
{
|
|
107
|
+
slug: "industrial",
|
|
108
|
+
name: "Industrial",
|
|
109
|
+
accentColor: "oklch(0.90 0.20 110)",
|
|
110
|
+
bgColor: "oklch(0.88 0.01 90)",
|
|
111
|
+
bodyFont: "'Inter', sans-serif",
|
|
112
|
+
},
|
|
113
|
+
{
|
|
114
|
+
slug: "matrix",
|
|
115
|
+
name: "Matrix Status",
|
|
116
|
+
accentColor: "oklch(0.79 0.21 152)",
|
|
117
|
+
bgColor: "oklch(0.16 0.000 0)",
|
|
118
|
+
bodyFont: "'VT323', monospace",
|
|
119
|
+
},
|
|
120
|
+
{
|
|
121
|
+
slug: "mesh",
|
|
122
|
+
name: "Mesh Void",
|
|
123
|
+
accentColor: "oklch(0.87 0.28 145)",
|
|
124
|
+
bgColor: "#fff",
|
|
125
|
+
bodyFont: "'Inter', -apple-system, sans-serif",
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
slug: "neomario",
|
|
129
|
+
name: "NeoMario",
|
|
130
|
+
accentColor: "oklch(0.55 0.24 28)",
|
|
131
|
+
bgColor: "oklch(0.96 0.01 90)",
|
|
132
|
+
bodyFont: "'Space Grotesk', sans-serif",
|
|
133
|
+
},
|
|
134
|
+
{ slug: "neon", name: "Neon Arcade", accentColor: "#f93c94", bgColor: "#fff", bodyFont: "'Rajdhani', sans-serif" },
|
|
135
|
+
{
|
|
136
|
+
slug: "nexus",
|
|
137
|
+
name: "Nexus Grid",
|
|
138
|
+
accentColor: "#D4FF00",
|
|
139
|
+
bgColor: "#000000",
|
|
140
|
+
bodyFont: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif",
|
|
141
|
+
},
|
|
142
|
+
{
|
|
143
|
+
slug: "opus",
|
|
144
|
+
name: "Opus Cabinet",
|
|
145
|
+
accentColor: "oklch(0.12 0.000 0)",
|
|
146
|
+
bgColor: "oklch(0.06 0.000 0)",
|
|
147
|
+
bodyFont: "'Cinzel', serif",
|
|
148
|
+
},
|
|
149
|
+
{
|
|
150
|
+
slug: "orbit",
|
|
151
|
+
name: "Orbit Dashboard",
|
|
152
|
+
accentColor: "oklch(0.79 0.21 152)",
|
|
153
|
+
bgColor: "#fff",
|
|
154
|
+
bodyFont: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",
|
|
155
|
+
},
|
|
156
|
+
{
|
|
157
|
+
slug: "palate",
|
|
158
|
+
name: "Palate Notes",
|
|
159
|
+
accentColor: "oklch(0.93 0.006 265)",
|
|
160
|
+
bgColor: "oklch(0.17 0.000 0)",
|
|
161
|
+
bodyFont: "'Cormorant Garamond', serif",
|
|
162
|
+
},
|
|
163
|
+
{
|
|
164
|
+
slug: "pitch",
|
|
165
|
+
name: "Pitch",
|
|
166
|
+
accentColor: "oklch(0.86 0.18 90)",
|
|
167
|
+
bgColor: "oklch(0.22 0.05 163)",
|
|
168
|
+
bodyFont: "'Space Grotesk', sans-serif",
|
|
169
|
+
},
|
|
170
|
+
{
|
|
171
|
+
slug: "poster",
|
|
172
|
+
name: "Poster",
|
|
173
|
+
accentColor: "oklch(0.65 0.18 290)",
|
|
174
|
+
bgColor: "oklch(0.11 0.01 270)",
|
|
175
|
+
bodyFont: "'Inter', sans-serif",
|
|
176
|
+
},
|
|
177
|
+
{
|
|
178
|
+
slug: "proof",
|
|
179
|
+
name: "Proof Sheet",
|
|
180
|
+
accentColor: "oklch(1.00 0.000 0 / 0.1)",
|
|
181
|
+
bgColor: "oklch(0.14 0.000 0)",
|
|
182
|
+
bodyFont: "'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif",
|
|
183
|
+
},
|
|
184
|
+
{
|
|
185
|
+
slug: "recon",
|
|
186
|
+
name: "Recon Grid",
|
|
187
|
+
accentColor: "oklch(0.64 0.24 25)",
|
|
188
|
+
bgColor: "oklch(0.00 0.000 0)",
|
|
189
|
+
bodyFont: "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace",
|
|
190
|
+
},
|
|
191
|
+
{
|
|
192
|
+
slug: "rift",
|
|
193
|
+
name: "Rift Portal",
|
|
194
|
+
accentColor: "oklch(0.88 0.27 128)",
|
|
195
|
+
bgColor: "oklch(0.07 0.02 280)",
|
|
196
|
+
bodyFont: "'Orbitron', sans-serif",
|
|
197
|
+
},
|
|
198
|
+
{
|
|
199
|
+
slug: "rune",
|
|
200
|
+
name: "Rune Interface",
|
|
201
|
+
accentColor: "#020406",
|
|
202
|
+
bgColor: "#fff",
|
|
203
|
+
bodyFont: "'Cormorant Garamond', Georgia, serif",
|
|
204
|
+
},
|
|
205
|
+
{ slug: "scrapbook", name: "Scrapbook", accentColor: "oklch(0.93 0.03 130)", bgColor: "#fff", bodyFont: "'Inter', sans-serif" },
|
|
206
|
+
{
|
|
207
|
+
slug: "sensor",
|
|
208
|
+
name: "Sensor Dashboard",
|
|
209
|
+
accentColor: "oklch(0.53 0.22 25)",
|
|
210
|
+
bgColor: "oklch(0.10 0.003 264)",
|
|
211
|
+
bodyFont: "'IBM Plex Mono', ui-monospace, monospace",
|
|
212
|
+
},
|
|
213
|
+
{ slug: "signal", name: "Signal", accentColor: "#ffffff", bgColor: "#030303", bodyFont: "'Inter', sans-serif" },
|
|
214
|
+
{ slug: "slab", name: "Slab Concrete", accentColor: "oklch(0.88 0.000 0)", bgColor: "#fff", bodyFont: "'Inter', sans-serif" },
|
|
215
|
+
{ slug: "specimen", name: "Specimen", accentColor: "#666", bgColor: "#fff", bodyFont: "'Inter', sans-serif" },
|
|
216
|
+
{
|
|
217
|
+
slug: "terminal",
|
|
218
|
+
name: "Terminal CRT",
|
|
219
|
+
accentColor: "oklch(0.00 0.000 0 / 0.85)",
|
|
220
|
+
bgColor: "oklch(0.16 0.000 0)",
|
|
221
|
+
bodyFont: "'VT323', monospace",
|
|
222
|
+
},
|
|
223
|
+
{
|
|
224
|
+
slug: "vault",
|
|
225
|
+
name: "Vault",
|
|
226
|
+
accentColor: "oklch(0.72 0.15 75)",
|
|
227
|
+
bgColor: "oklch(0.08 0.03 280)",
|
|
228
|
+
bodyFont: "'Inter', sans-serif",
|
|
229
|
+
},
|
|
230
|
+
{
|
|
231
|
+
slug: "winter-sports",
|
|
232
|
+
name: "Winter Sports",
|
|
233
|
+
accentColor: "oklch(0.55 0.19 250)",
|
|
234
|
+
bgColor: "oklch(0.99 0.003 240)",
|
|
235
|
+
bodyFont: "'Inter', sans-serif",
|
|
236
|
+
},
|
|
237
|
+
{ slug: "zine", name: "Zine Cut", accentColor: "oklch(0.05 0 0)", bgColor: "oklch(0.96 0.005 100)", bodyFont: "var(--f-type)" },
|
|
238
|
+
];
|
|
239
|
+
const themeCatalogNames = new Set(vibesThemes.map((t) => t.slug));
|
|
240
|
+
export function getThemeCatalogNames() {
|
|
241
|
+
return themeCatalogNames;
|
|
242
|
+
}
|
|
243
|
+
export function getThemeBySlug(slug) {
|
|
244
|
+
return vibesThemes.find((t) => t.slug === slug);
|
|
245
|
+
}
|
|
246
|
+
export function parseDesignMd(content, slug) {
|
|
247
|
+
const fmMatch = content.match(/^---\n([\s\S]*?)\n---/);
|
|
248
|
+
const frontmatter = fmMatch ? fmMatch[1] : "";
|
|
249
|
+
const nameMatch = frontmatter.match(/^name:\s*(.+)$/m);
|
|
250
|
+
const name = nameMatch ? nameMatch[1].trim() : slug || "Custom Theme";
|
|
251
|
+
const colorBlock = frontmatter.match(/^colors:\n((?:\s+.+\n)*)/m);
|
|
252
|
+
const colors = {};
|
|
253
|
+
if (colorBlock) {
|
|
254
|
+
for (const line of colorBlock[1].split("\n")) {
|
|
255
|
+
const m = line.match(/^\s+([\w-]+):\s*"?([^"\n]+)"?$/);
|
|
256
|
+
if (m)
|
|
257
|
+
colors[m[1]] = m[2].trim();
|
|
258
|
+
}
|
|
259
|
+
}
|
|
260
|
+
const accentColor = colors["primary"] || colors["accent"] || colors["tertiary"] || Object.values(colors)[2] || "#666";
|
|
261
|
+
const bgColor = colors["background"] || colors["surface"] || colors["neutral"] || Object.values(colors)[0] || "#fff";
|
|
262
|
+
const fontMatch = frontmatter.match(/fontFamily:\s*(.+)$/m);
|
|
263
|
+
const bodyFont = fontMatch ? fontMatch[1].trim() : undefined;
|
|
264
|
+
return {
|
|
265
|
+
slug: slug || name.toLowerCase().replace(/\s+/g, "-"),
|
|
266
|
+
name,
|
|
267
|
+
accentColor,
|
|
268
|
+
bgColor,
|
|
269
|
+
bodyFont,
|
|
270
|
+
};
|
|
271
|
+
}
|
|
272
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../jsr/themes/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: Industrial
|
|
3
|
+
colors:
|
|
4
|
+
bg: "oklch(0.88 0.01 90)"
|
|
5
|
+
text: "oklch(0.05 0.01 0)"
|
|
6
|
+
border: "oklch(0.05 0.01 0)"
|
|
7
|
+
accent: "oklch(0.90 0.20 110)"
|
|
8
|
+
accent-text: "oklch(0.05 0.01 0)"
|
|
9
|
+
muted: "oklch(0.40 0.01 0)"
|
|
10
|
+
typography:
|
|
11
|
+
body-md:
|
|
12
|
+
fontFamily: Inter
|
|
13
|
+
fontSize: 1rem
|
|
14
|
+
fontWeight: "400"
|
|
15
|
+
---
|
|
16
|
+
|
|
17
|
+
## Brand & Style
|
|
18
|
+
|
|
19
|
+
Industrial design system. A clean, structured theme with Space Mono and Inter typography. Use this design system\'s color tokens, spacing, and typographic choices consistently across all generated components. This theme **respects the visitor's system color scheme** — light by default, with a dark variant that auto-applies on `@media (prefers-color-scheme: dark)`. Apply both color sets via CSS variables in a `<style>` block; never hard-code one mode only.
|
|
20
|
+
|
|
21
|
+
## Colors
|
|
22
|
+
|
|
23
|
+
- **bg** (oklch(0.88 0.01 90)): Use for backgrounds.
|
|
24
|
+
- **text** (oklch(0.05 0.01 0)): Use for text content.
|
|
25
|
+
- **border** (oklch(0.05 0.01 0)): Use for borders and dividers.
|
|
26
|
+
- **accent** (oklch(0.90 0.20 110)): Use for primary actions and accents.
|
|
27
|
+
- **accent-text** (oklch(0.05 0.01 0)): Use for text content.
|
|
28
|
+
- **muted** (oklch(0.40 0.01 0)): Use for secondary/muted content.
|
|
29
|
+
|
|
30
|
+
## Typography
|
|
31
|
+
|
|
32
|
+
Load fonts from Google Fonts: Space Mono, Inter. Use display=optional.
|
|
33
|
+
Primary body font: 'Inter', sans-serif.
|
|
34
|
+
|
|
35
|
+
## Components
|
|
36
|
+
|
|
37
|
+
Apply the color tokens and typography consistently to all interactive elements (buttons, inputs, cards, modals). Ensure sufficient contrast between text and background colors for accessibility.
|
package/themes/matrix.md
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: Matrix Status
|
|
3
|
+
colors:
|
|
4
|
+
bg: "oklch(0.16 0.000 0)"
|
|
5
|
+
card: "oklch(0.00 0.000 0 / 0.5)"
|
|
6
|
+
green: "oklch(0.79 0.21 152)"
|
|
7
|
+
green-border: "oklch(0.72 0.22 150 / 0.3)"
|
|
8
|
+
yellow: "oklch(0.85 0.20 92)"
|
|
9
|
+
red: "oklch(0.70 0.19 22)"
|
|
10
|
+
fg: "oklch(1.00 0.000 0)"
|
|
11
|
+
fg-muted: "oklch(0.71 0.02 261)"
|
|
12
|
+
typography:
|
|
13
|
+
body-md:
|
|
14
|
+
fontFamily: VT323
|
|
15
|
+
fontSize: 1rem
|
|
16
|
+
fontWeight: "400"
|
|
17
|
+
---
|
|
18
|
+
|
|
19
|
+
## Brand & Style
|
|
20
|
+
|
|
21
|
+
Matrix Status design system. A dark, atmospheric theme with VT323 typography. Use this design system\'s color tokens, spacing, and typographic choices consistently across all generated components. This theme **respects the visitor's system color scheme** — dark by default, with a light variant that auto-applies on `@media (prefers-color-scheme: light)`. Apply both color sets via CSS variables in a `<style>` block; never hard-code one mode only.
|
|
22
|
+
|
|
23
|
+
## Colors
|
|
24
|
+
|
|
25
|
+
- **bg** (oklch(0.16 0.000 0)): Use for backgrounds.
|
|
26
|
+
- **card** (oklch(0.00 0.000 0 / 0.5)): Use for supporting UI elements.
|
|
27
|
+
- **green** (oklch(0.79 0.21 152)): Use for supporting UI elements.
|
|
28
|
+
- **green-border** (oklch(0.72 0.22 150 / 0.3)): Use for borders and dividers.
|
|
29
|
+
- **yellow** (oklch(0.85 0.20 92)): Use for supporting UI elements.
|
|
30
|
+
- **red** (oklch(0.70 0.19 22)): Use for supporting UI elements.
|
|
31
|
+
- **fg** (oklch(1.00 0.000 0)): Use for text content.
|
|
32
|
+
- **fg-muted** (oklch(0.71 0.02 261)): Use for text content.
|
|
33
|
+
|
|
34
|
+
## Typography
|
|
35
|
+
|
|
36
|
+
Load fonts from Google Fonts: VT323. Use display=optional.
|
|
37
|
+
Primary body font: 'VT323', monospace.
|
|
38
|
+
|
|
39
|
+
## Components
|
|
40
|
+
|
|
41
|
+
Apply the color tokens and typography consistently to all interactive elements (buttons, inputs, cards, modals). Ensure sufficient contrast between text and background colors for accessibility.
|
package/themes/mesh.md
ADDED
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: Mesh Void
|
|
3
|
+
colors:
|
|
4
|
+
void: "oklch(0.07 0.000 0)"
|
|
5
|
+
panel: "oklch(0.10 0.000 0)"
|
|
6
|
+
fg: "oklch(1.00 0.000 0)"
|
|
7
|
+
fg-muted: "oklch(0.49 0.000 0)"
|
|
8
|
+
fg-dim: "oklch(0.30 0.000 0)"
|
|
9
|
+
border: "oklch(1.00 0.000 0 / 0.15)"
|
|
10
|
+
hover: "oklch(0.13 0.000 0)"
|
|
11
|
+
accent: "oklch(0.87 0.28 145)"
|
|
12
|
+
ring: "oklch(0.36 0.000 0)"
|
|
13
|
+
typography:
|
|
14
|
+
body-md:
|
|
15
|
+
fontFamily: Inter
|
|
16
|
+
fontSize: 1rem
|
|
17
|
+
fontWeight: "400"
|
|
18
|
+
---
|
|
19
|
+
|
|
20
|
+
## Brand & Style
|
|
21
|
+
|
|
22
|
+
Mesh Void design system. A clean, structured theme with Inter and JetBrains Mono typography. Use this design system\'s color tokens, spacing, and typographic choices consistently across all generated components. This theme **respects the visitor's system color scheme** — light by default, with a dark variant that auto-applies on `@media (prefers-color-scheme: dark)`. Apply both color sets via CSS variables in a `<style>` block; never hard-code one mode only.
|
|
23
|
+
|
|
24
|
+
## Colors
|
|
25
|
+
|
|
26
|
+
- **void** (oklch(0.07 0.000 0)): Use for supporting UI elements.
|
|
27
|
+
- **panel** (oklch(0.10 0.000 0)): Use for supporting UI elements.
|
|
28
|
+
- **fg** (oklch(1.00 0.000 0)): Use for text content.
|
|
29
|
+
- **fg-muted** (oklch(0.49 0.000 0)): Use for text content.
|
|
30
|
+
- **fg-dim** (oklch(0.30 0.000 0)): Use for text content.
|
|
31
|
+
- **border** (oklch(1.00 0.000 0 / 0.15)): Use for borders and dividers.
|
|
32
|
+
- **hover** (oklch(0.13 0.000 0)): Use for supporting UI elements.
|
|
33
|
+
- **accent** (oklch(0.87 0.28 145)): Use for primary actions and accents.
|
|
34
|
+
|
|
35
|
+
## Typography
|
|
36
|
+
|
|
37
|
+
Load fonts from Google Fonts: Inter, JetBrains Mono. Use display=optional.
|
|
38
|
+
Primary body font: 'Inter', -apple-system, sans-serif.
|
|
39
|
+
|
|
40
|
+
## Components
|
|
41
|
+
|
|
42
|
+
Apply the color tokens and typography consistently to all interactive elements (buttons, inputs, cards, modals). Ensure sufficient contrast between text and background colors for accessibility.
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: NeoMario
|
|
3
|
+
colors:
|
|
4
|
+
bg: "oklch(0.96 0.01 90)"
|
|
5
|
+
card-bg: "oklch(1.00 0 0)"
|
|
6
|
+
text: "oklch(0.15 0.02 280)"
|
|
7
|
+
border: "oklch(0.15 0.02 280)"
|
|
8
|
+
accent: "oklch(0.55 0.24 28)"
|
|
9
|
+
accent-light: "oklch(0.55 0.24 28 / 0.1)"
|
|
10
|
+
muted: "oklch(0.50 0.02 280)"
|
|
11
|
+
yellow: "oklch(0.85 0.18 85)"
|
|
12
|
+
yellow-dark: "oklch(0.75 0.16 85)"
|
|
13
|
+
green: "oklch(0.62 0.19 145)"
|
|
14
|
+
blue: "oklch(0.52 0.18 255)"
|
|
15
|
+
red: "oklch(0.55 0.24 28)"
|
|
16
|
+
typography:
|
|
17
|
+
body-md:
|
|
18
|
+
fontFamily: Space Grotesk
|
|
19
|
+
fontSize: 1rem
|
|
20
|
+
fontWeight: "400"
|
|
21
|
+
rounded:
|
|
22
|
+
DEFAULT: 4px
|
|
23
|
+
---
|
|
24
|
+
|
|
25
|
+
## Brand & Style
|
|
26
|
+
|
|
27
|
+
NeoMario design system. A clean, structured theme with Space Grotesk and JetBrains Mono typography. Use this design system\'s color tokens, spacing, and typographic choices consistently across all generated components. This theme **respects the visitor's system color scheme** — light by default, with a dark variant that auto-applies on `@media (prefers-color-scheme: dark)`. Apply both color sets via CSS variables in a `<style>` block; never hard-code one mode only.
|
|
28
|
+
|
|
29
|
+
## Colors
|
|
30
|
+
|
|
31
|
+
- **bg** (oklch(0.96 0.01 90)): Use for backgrounds.
|
|
32
|
+
- **card-bg** (oklch(1.00 0 0)): Use for backgrounds.
|
|
33
|
+
- **text** (oklch(0.15 0.02 280)): Use for text content.
|
|
34
|
+
- **border** (oklch(0.15 0.02 280)): Use for borders and dividers.
|
|
35
|
+
- **accent** (oklch(0.55 0.24 28)): Use for primary actions and accents.
|
|
36
|
+
- **accent-light** (oklch(0.55 0.24 28 / 0.1)): Use for primary actions and accents.
|
|
37
|
+
- **muted** (oklch(0.50 0.02 280)): Use for secondary/muted content.
|
|
38
|
+
- **yellow** (oklch(0.85 0.18 85)): Use for supporting UI elements.
|
|
39
|
+
|
|
40
|
+
## Typography
|
|
41
|
+
|
|
42
|
+
Load fonts from Google Fonts: Space Grotesk, JetBrains Mono. Use display=optional.
|
|
43
|
+
Primary body font: 'Space Grotesk', sans-serif.
|
|
44
|
+
|
|
45
|
+
## Components
|
|
46
|
+
|
|
47
|
+
Apply the color tokens and typography consistently to all interactive elements (buttons, inputs, cards, modals). Ensure sufficient contrast between text and background colors for accessibility.
|
package/themes/neon.md
ADDED
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: Neon Arcade
|
|
3
|
+
colors:
|
|
4
|
+
bg-gradient-start: "#ff5bad"
|
|
5
|
+
bg-gradient-mid: "#ffc85c"
|
|
6
|
+
bg-gradient-end: "#fcee0a"
|
|
7
|
+
panel-dark: "#2a0a2e"
|
|
8
|
+
panel-mid: "#4d1558"
|
|
9
|
+
neon-pink: "#f93c94"
|
|
10
|
+
neon-yellow: "#fcee0a"
|
|
11
|
+
neon-cyan: "#00f0ff"
|
|
12
|
+
text-dark: "#2a0a2e"
|
|
13
|
+
text-light: "#ffffff"
|
|
14
|
+
text-on-pink: "#2a0a2e"
|
|
15
|
+
typography:
|
|
16
|
+
body-md:
|
|
17
|
+
fontFamily: Rajdhani
|
|
18
|
+
fontSize: 1rem
|
|
19
|
+
fontWeight: "400"
|
|
20
|
+
headline:
|
|
21
|
+
fontFamily: Orbitron
|
|
22
|
+
fontSize: 2rem
|
|
23
|
+
fontWeight: "700"
|
|
24
|
+
---
|
|
25
|
+
|
|
26
|
+
## Brand & Style
|
|
27
|
+
|
|
28
|
+
Neon Arcade design system. A clean, structured theme with Orbitron and Rajdhani and Share Tech Mono typography. Use this design system\'s color tokens, spacing, and typographic choices consistently across all generated components. This theme **respects the visitor's system color scheme** — light by default, with a dark variant that auto-applies on `@media (prefers-color-scheme: dark)`. Apply both color sets via CSS variables in a `<style>` block; never hard-code one mode only.
|
|
29
|
+
|
|
30
|
+
## Colors
|
|
31
|
+
|
|
32
|
+
- **bg-gradient-start** (#ff5bad): Use for backgrounds.
|
|
33
|
+
- **bg-gradient-mid** (#ffc85c): Use for backgrounds.
|
|
34
|
+
- **bg-gradient-end** (#fcee0a): Use for backgrounds.
|
|
35
|
+
- **panel-dark** (#2a0a2e): Use for supporting UI elements.
|
|
36
|
+
- **panel-mid** (#4d1558): Use for supporting UI elements.
|
|
37
|
+
- **neon-pink** (#f93c94): Use for text content.
|
|
38
|
+
- **neon-yellow** (#fcee0a): Use for supporting UI elements.
|
|
39
|
+
- **neon-cyan** (#00f0ff): Use for supporting UI elements.
|
|
40
|
+
|
|
41
|
+
## Typography
|
|
42
|
+
|
|
43
|
+
Load fonts from Google Fonts: Orbitron, Rajdhani, Share Tech Mono. Use display=optional.
|
|
44
|
+
Primary body font: 'Rajdhani', sans-serif.
|
|
45
|
+
|
|
46
|
+
## Components
|
|
47
|
+
|
|
48
|
+
Apply the color tokens and typography consistently to all interactive elements (buttons, inputs, cards, modals). Ensure sufficient contrast between text and background colors for accessibility.
|
package/themes/nexus.md
ADDED
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: Nexus Grid
|
|
3
|
+
colors:
|
|
4
|
+
bg: "#000000"
|
|
5
|
+
text: "#ffffff"
|
|
6
|
+
accent-lime: "#D4FF00"
|
|
7
|
+
text-dim: "#888888"
|
|
8
|
+
text-body: "#dddddd"
|
|
9
|
+
separator: "#666666"
|
|
10
|
+
outline: "rgba(255,255,255,0.3)"
|
|
11
|
+
voxel: "#ffffff"
|
|
12
|
+
typography:
|
|
13
|
+
body-md:
|
|
14
|
+
fontFamily: Helvetica Neue
|
|
15
|
+
fontSize: 1rem
|
|
16
|
+
fontWeight: "400"
|
|
17
|
+
---
|
|
18
|
+
|
|
19
|
+
## Brand & Style
|
|
20
|
+
|
|
21
|
+
Nexus Grid design system. A dark, atmospheric theme with system typography. Use this design system\'s color tokens, spacing, and typographic choices consistently across all generated components. This theme **respects the visitor's system color scheme** — dark by default, with a light variant that auto-applies on `@media (prefers-color-scheme: light)`. Apply both color sets via CSS variables in a `<style>` block; never hard-code one mode only.
|
|
22
|
+
|
|
23
|
+
## Colors
|
|
24
|
+
|
|
25
|
+
- **bg** (#000000): Use for backgrounds.
|
|
26
|
+
- **text** (#ffffff): Use for text content.
|
|
27
|
+
- **accent-lime** (#D4FF00): Use for primary actions and accents.
|
|
28
|
+
- **text-dim** (#888888): Use for text content.
|
|
29
|
+
- **text-body** (#dddddd): Use for text content.
|
|
30
|
+
- **separator** (#666666): Use for supporting UI elements.
|
|
31
|
+
- **outline** (rgba(255,255,255,0.3)): Use for supporting UI elements.
|
|
32
|
+
- **voxel** (#ffffff): Use for supporting UI elements.
|
|
33
|
+
|
|
34
|
+
## Typography
|
|
35
|
+
|
|
36
|
+
Primary body font: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif.
|
|
37
|
+
|
|
38
|
+
## Components
|
|
39
|
+
|
|
40
|
+
Apply the color tokens and typography consistently to all interactive elements (buttons, inputs, cards, modals). Ensure sufficient contrast between text and background colors for accessibility.
|
package/themes/opus.md
ADDED
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: Opus Cabinet
|
|
3
|
+
colors:
|
|
4
|
+
bg: "oklch(0.06 0.000 0)"
|
|
5
|
+
bg-surface: "oklch(0.12 0.000 0)"
|
|
6
|
+
bg-card: "oklch(0.13 0.000 0)"
|
|
7
|
+
bg-elevated: "oklch(0.15 0.000 0)"
|
|
8
|
+
bg-header: "oklch(0.18 0.000 0)"
|
|
9
|
+
stripe-a: "oklch(0.12 0.000 0)"
|
|
10
|
+
stripe-b: "oklch(0.14 0.000 0)"
|
|
11
|
+
wood-frame: "oklch(0.27 0.050 50)"
|
|
12
|
+
wood-highlight: "oklch(0.37 0.060 50)"
|
|
13
|
+
gold: "oklch(0.73 0.100 78)"
|
|
14
|
+
gold-dim: "oklch(0.55 0.090 75)"
|
|
15
|
+
copper: "oklch(0.47 0.030 195)"
|
|
16
|
+
silver: "oklch(0.70 0.000 0)"
|
|
17
|
+
royal-blue: "oklch(0.31 0.070 250)"
|
|
18
|
+
parchment: "oklch(0.78 0.060 70)"
|
|
19
|
+
iron-dark: "oklch(0.32 0.040 240)"
|
|
20
|
+
iron-darker: "oklch(0.16 0.010 240)"
|
|
21
|
+
iron-border: "oklch(0.43 0.030 230)"
|
|
22
|
+
iron-text: "oklch(0.83 0.020 240)"
|
|
23
|
+
text: "oklch(0.90 0.000 0)"
|
|
24
|
+
text-dim: "oklch(0.57 0.000 0)"
|
|
25
|
+
text-muted: "oklch(0.40 0.000 0)"
|
|
26
|
+
border: "oklch(0.27 0.000 0)"
|
|
27
|
+
border-hover: "oklch(0.55 0.090 75)"
|
|
28
|
+
typography:
|
|
29
|
+
body-md:
|
|
30
|
+
fontFamily: Cinzel
|
|
31
|
+
fontSize: 1rem
|
|
32
|
+
fontWeight: "400"
|
|
33
|
+
headline:
|
|
34
|
+
fontFamily: Cinzel Decorative
|
|
35
|
+
fontSize: 2rem
|
|
36
|
+
fontWeight: "700"
|
|
37
|
+
---
|
|
38
|
+
|
|
39
|
+
## Brand & Style
|
|
40
|
+
|
|
41
|
+
Opus Cabinet design system. A dark, atmospheric theme with Cinzel and Cinzel Decorative typography. Use this design system\'s color tokens, spacing, and typographic choices consistently across all generated components. This theme **respects the visitor's system color scheme** — dark by default, with a light variant that auto-applies on `@media (prefers-color-scheme: light)`. Apply both color sets via CSS variables in a `<style>` block; never hard-code one mode only.
|
|
42
|
+
|
|
43
|
+
## Colors
|
|
44
|
+
|
|
45
|
+
- **bg** (oklch(0.06 0.000 0)): Use for backgrounds.
|
|
46
|
+
- **bg-surface** (oklch(0.12 0.000 0)): Use for backgrounds.
|
|
47
|
+
- **bg-card** (oklch(0.13 0.000 0)): Use for backgrounds.
|
|
48
|
+
- **bg-elevated** (oklch(0.15 0.000 0)): Use for backgrounds.
|
|
49
|
+
- **bg-header** (oklch(0.18 0.000 0)): Use for backgrounds.
|
|
50
|
+
- **stripe-a** (oklch(0.12 0.000 0)): Use for supporting UI elements.
|
|
51
|
+
- **stripe-b** (oklch(0.14 0.000 0)): Use for supporting UI elements.
|
|
52
|
+
- **wood-frame** (oklch(0.27 0.050 50)): Use for supporting UI elements.
|
|
53
|
+
|
|
54
|
+
## Typography
|
|
55
|
+
|
|
56
|
+
Load fonts from Google Fonts: Cinzel, Cinzel Decorative. Use display=optional.
|
|
57
|
+
Primary body font: 'Cinzel', serif.
|
|
58
|
+
|
|
59
|
+
## Components
|
|
60
|
+
|
|
61
|
+
Apply the color tokens and typography consistently to all interactive elements (buttons, inputs, cards, modals). Ensure sufficient contrast between text and background colors for accessibility.
|
package/themes/orbit.md
ADDED
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: Orbit Dashboard
|
|
3
|
+
colors:
|
|
4
|
+
bg-gradient-from: "oklch(0.56 0.29 302)"
|
|
5
|
+
bg-gradient-to: "oklch(0.44 0.22 304)"
|
|
6
|
+
surface: "oklch(0.00 0.000 0)"
|
|
7
|
+
card: "oklch(0.18 0.000 0 / 0.8)"
|
|
8
|
+
card-solid: "oklch(0.28 0.03 257)"
|
|
9
|
+
border: "oklch(0.37 0.03 260)"
|
|
10
|
+
fg: "oklch(1.00 0.000 0)"
|
|
11
|
+
fg-muted: "oklch(0.71 0.02 261)"
|
|
12
|
+
fg-dim: "oklch(0.55 0.03 264)"
|
|
13
|
+
accent-green: "oklch(0.79 0.21 152)"
|
|
14
|
+
accent-blue: "oklch(0.71 0.17 255)"
|
|
15
|
+
accent-yellow: "oklch(0.85 0.20 92)"
|
|
16
|
+
accent-orange: "oklch(0.75 0.18 56)"
|
|
17
|
+
typography:
|
|
18
|
+
body-md:
|
|
19
|
+
fontFamily: Inter
|
|
20
|
+
fontSize: 1rem
|
|
21
|
+
fontWeight: "400"
|
|
22
|
+
---
|
|
23
|
+
|
|
24
|
+
## Brand & Style
|
|
25
|
+
|
|
26
|
+
Orbit Dashboard design system. A clean, structured theme with Inter typography. Use this design system\'s color tokens, spacing, and typographic choices consistently across all generated components. This theme **respects the visitor's system color scheme** — light by default, with a dark variant that auto-applies on `@media (prefers-color-scheme: dark)`. Apply both color sets via CSS variables in a `<style>` block; never hard-code one mode only.
|
|
27
|
+
|
|
28
|
+
## Colors
|
|
29
|
+
|
|
30
|
+
- **bg-gradient-from** (oklch(0.56 0.29 302)): Use for backgrounds.
|
|
31
|
+
- **bg-gradient-to** (oklch(0.44 0.22 304)): Use for backgrounds.
|
|
32
|
+
- **surface** (oklch(0.00 0.000 0)): Use for supporting UI elements.
|
|
33
|
+
- **card** (oklch(0.18 0.000 0 / 0.8)): Use for supporting UI elements.
|
|
34
|
+
- **card-solid** (oklch(0.28 0.03 257)): Use for supporting UI elements.
|
|
35
|
+
- **border** (oklch(0.37 0.03 260)): Use for borders and dividers.
|
|
36
|
+
- **fg** (oklch(1.00 0.000 0)): Use for text content.
|
|
37
|
+
- **fg-muted** (oklch(0.71 0.02 261)): Use for text content.
|
|
38
|
+
|
|
39
|
+
## Typography
|
|
40
|
+
|
|
41
|
+
Load fonts from Google Fonts: Inter. Use display=optional.
|
|
42
|
+
Primary body font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif.
|
|
43
|
+
|
|
44
|
+
## Components
|
|
45
|
+
|
|
46
|
+
Apply the color tokens and typography consistently to all interactive elements (buttons, inputs, cards, modals). Ensure sufficient contrast between text and background colors for accessibility.
|