@aexol/spectral 0.7.0 → 0.7.1

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 (459) hide show
  1. package/dist/agent/index.js +76 -301
  2. package/dist/cli.js +11 -0
  3. package/dist/designer/data/systems/agentic/DESIGN.md +71 -0
  4. package/dist/designer/data/systems/agentic/components.html +154 -0
  5. package/dist/designer/data/systems/agentic/tokens.css +63 -0
  6. package/dist/designer/data/systems/airbnb/DESIGN.md +393 -0
  7. package/dist/designer/data/systems/airbnb/components.html +1373 -0
  8. package/dist/designer/data/systems/airbnb/tokens.css +261 -0
  9. package/dist/designer/data/systems/airtable/DESIGN.md +92 -0
  10. package/dist/designer/data/systems/airtable/components.html +489 -0
  11. package/dist/designer/data/systems/airtable/tokens.css +261 -0
  12. package/dist/designer/data/systems/ant/DESIGN.md +71 -0
  13. package/dist/designer/data/systems/ant/components.html +154 -0
  14. package/dist/designer/data/systems/ant/tokens.css +63 -0
  15. package/dist/designer/data/systems/apple/DESIGN.md +250 -0
  16. package/dist/designer/data/systems/apple/components.html +749 -0
  17. package/dist/designer/data/systems/apple/tokens.css +286 -0
  18. package/dist/designer/data/systems/application/DESIGN.md +71 -0
  19. package/dist/designer/data/systems/application/components.html +154 -0
  20. package/dist/designer/data/systems/application/tokens.css +63 -0
  21. package/dist/designer/data/systems/arc/DESIGN.md +152 -0
  22. package/dist/designer/data/systems/arc/components.html +432 -0
  23. package/dist/designer/data/systems/arc/tokens.css +137 -0
  24. package/dist/designer/data/systems/artistic/DESIGN.md +71 -0
  25. package/dist/designer/data/systems/artistic/components.html +136 -0
  26. package/dist/designer/data/systems/artistic/tokens.css +63 -0
  27. package/dist/designer/data/systems/atelier-zero/DESIGN.md +316 -0
  28. package/dist/designer/data/systems/atelier-zero/components.html +136 -0
  29. package/dist/designer/data/systems/atelier-zero/tokens.css +63 -0
  30. package/dist/designer/data/systems/bento/DESIGN.md +71 -0
  31. package/dist/designer/data/systems/bento/components.html +136 -0
  32. package/dist/designer/data/systems/bento/tokens.css +63 -0
  33. package/dist/designer/data/systems/binance/DESIGN.md +348 -0
  34. package/dist/designer/data/systems/binance/components.html +550 -0
  35. package/dist/designer/data/systems/binance/tokens.css +255 -0
  36. package/dist/designer/data/systems/bmw/DESIGN.md +183 -0
  37. package/dist/designer/data/systems/bmw/components.html +551 -0
  38. package/dist/designer/data/systems/bmw/tokens.css +179 -0
  39. package/dist/designer/data/systems/bmw-m/DESIGN.md +246 -0
  40. package/dist/designer/data/systems/bmw-m/components.html +342 -0
  41. package/dist/designer/data/systems/bmw-m/tokens.css +64 -0
  42. package/dist/designer/data/systems/bold/DESIGN.md +71 -0
  43. package/dist/designer/data/systems/bold/components.html +136 -0
  44. package/dist/designer/data/systems/bold/tokens.css +63 -0
  45. package/dist/designer/data/systems/brutalism/DESIGN.md +71 -0
  46. package/dist/designer/data/systems/brutalism/components.html +154 -0
  47. package/dist/designer/data/systems/brutalism/tokens.css +63 -0
  48. package/dist/designer/data/systems/bugatti/DESIGN.md +271 -0
  49. package/dist/designer/data/systems/bugatti/components.html +342 -0
  50. package/dist/designer/data/systems/bugatti/tokens.css +64 -0
  51. package/dist/designer/data/systems/cafe/DESIGN.md +71 -0
  52. package/dist/designer/data/systems/cafe/components.html +136 -0
  53. package/dist/designer/data/systems/cafe/tokens.css +63 -0
  54. package/dist/designer/data/systems/cal/DESIGN.md +262 -0
  55. package/dist/designer/data/systems/cal/components.html +376 -0
  56. package/dist/designer/data/systems/cal/tokens.css +265 -0
  57. package/dist/designer/data/systems/canva/DESIGN.md +157 -0
  58. package/dist/designer/data/systems/canva/components.html +461 -0
  59. package/dist/designer/data/systems/canva/tokens.css +147 -0
  60. package/dist/designer/data/systems/cisco/DESIGN.md +201 -0
  61. package/dist/designer/data/systems/cisco/components.html +342 -0
  62. package/dist/designer/data/systems/cisco/tokens.css +64 -0
  63. package/dist/designer/data/systems/claude/DESIGN.md +315 -0
  64. package/dist/designer/data/systems/claude/components.html +483 -0
  65. package/dist/designer/data/systems/claude/tokens.css +130 -0
  66. package/dist/designer/data/systems/clay/DESIGN.md +307 -0
  67. package/dist/designer/data/systems/clay/components.html +136 -0
  68. package/dist/designer/data/systems/clay/tokens.css +63 -0
  69. package/dist/designer/data/systems/claymorphism/DESIGN.md +71 -0
  70. package/dist/designer/data/systems/claymorphism/components.html +136 -0
  71. package/dist/designer/data/systems/claymorphism/tokens.css +63 -0
  72. package/dist/designer/data/systems/clean/DESIGN.md +71 -0
  73. package/dist/designer/data/systems/clean/components.html +136 -0
  74. package/dist/designer/data/systems/clean/tokens.css +63 -0
  75. package/dist/designer/data/systems/clickhouse/DESIGN.md +284 -0
  76. package/dist/designer/data/systems/clickhouse/components.html +506 -0
  77. package/dist/designer/data/systems/clickhouse/tokens.css +135 -0
  78. package/dist/designer/data/systems/cohere/DESIGN.md +269 -0
  79. package/dist/designer/data/systems/cohere/components.html +353 -0
  80. package/dist/designer/data/systems/cohere/tokens.css +126 -0
  81. package/dist/designer/data/systems/coinbase/DESIGN.md +132 -0
  82. package/dist/designer/data/systems/coinbase/components.html +501 -0
  83. package/dist/designer/data/systems/coinbase/tokens.css +257 -0
  84. package/dist/designer/data/systems/colorful/DESIGN.md +71 -0
  85. package/dist/designer/data/systems/colorful/components.html +136 -0
  86. package/dist/designer/data/systems/colorful/tokens.css +63 -0
  87. package/dist/designer/data/systems/composio/DESIGN.md +310 -0
  88. package/dist/designer/data/systems/composio/components.html +342 -0
  89. package/dist/designer/data/systems/composio/tokens.css +64 -0
  90. package/dist/designer/data/systems/contemporary/DESIGN.md +71 -0
  91. package/dist/designer/data/systems/contemporary/components.html +136 -0
  92. package/dist/designer/data/systems/contemporary/tokens.css +63 -0
  93. package/dist/designer/data/systems/corporate/DESIGN.md +71 -0
  94. package/dist/designer/data/systems/corporate/components.html +136 -0
  95. package/dist/designer/data/systems/corporate/tokens.css +63 -0
  96. package/dist/designer/data/systems/cosmic/DESIGN.md +71 -0
  97. package/dist/designer/data/systems/cosmic/components.html +136 -0
  98. package/dist/designer/data/systems/cosmic/tokens.css +63 -0
  99. package/dist/designer/data/systems/creative/DESIGN.md +71 -0
  100. package/dist/designer/data/systems/creative/components.html +136 -0
  101. package/dist/designer/data/systems/creative/tokens.css +63 -0
  102. package/dist/designer/data/systems/cursor/DESIGN.md +312 -0
  103. package/dist/designer/data/systems/cursor/components.html +654 -0
  104. package/dist/designer/data/systems/cursor/tokens.css +218 -0
  105. package/dist/designer/data/systems/dashboard/DESIGN.md +71 -0
  106. package/dist/designer/data/systems/dashboard/components.html +154 -0
  107. package/dist/designer/data/systems/dashboard/tokens.css +63 -0
  108. package/dist/designer/data/systems/default/DESIGN.md +62 -0
  109. package/dist/designer/data/systems/default/components.html +523 -0
  110. package/dist/designer/data/systems/default/tokens.css +200 -0
  111. package/dist/designer/data/systems/discord/DESIGN.md +162 -0
  112. package/dist/designer/data/systems/discord/components.html +359 -0
  113. package/dist/designer/data/systems/discord/tokens.css +125 -0
  114. package/dist/designer/data/systems/dithered/DESIGN.md +71 -0
  115. package/dist/designer/data/systems/dithered/components.html +136 -0
  116. package/dist/designer/data/systems/dithered/tokens.css +63 -0
  117. package/dist/designer/data/systems/doodle/DESIGN.md +71 -0
  118. package/dist/designer/data/systems/doodle/components.html +136 -0
  119. package/dist/designer/data/systems/doodle/tokens.css +63 -0
  120. package/dist/designer/data/systems/dramatic/DESIGN.md +71 -0
  121. package/dist/designer/data/systems/dramatic/components.html +136 -0
  122. package/dist/designer/data/systems/dramatic/tokens.css +63 -0
  123. package/dist/designer/data/systems/duolingo/DESIGN.md +154 -0
  124. package/dist/designer/data/systems/duolingo/components.html +532 -0
  125. package/dist/designer/data/systems/duolingo/tokens.css +130 -0
  126. package/dist/designer/data/systems/editorial/DESIGN.md +71 -0
  127. package/dist/designer/data/systems/editorial/components.html +154 -0
  128. package/dist/designer/data/systems/editorial/tokens.css +63 -0
  129. package/dist/designer/data/systems/elegant/DESIGN.md +71 -0
  130. package/dist/designer/data/systems/elegant/components.html +136 -0
  131. package/dist/designer/data/systems/elegant/tokens.css +63 -0
  132. package/dist/designer/data/systems/elevenlabs/DESIGN.md +268 -0
  133. package/dist/designer/data/systems/elevenlabs/components.html +342 -0
  134. package/dist/designer/data/systems/elevenlabs/tokens.css +127 -0
  135. package/dist/designer/data/systems/energetic/DESIGN.md +72 -0
  136. package/dist/designer/data/systems/energetic/components.html +136 -0
  137. package/dist/designer/data/systems/energetic/tokens.css +63 -0
  138. package/dist/designer/data/systems/enterprise/DESIGN.md +71 -0
  139. package/dist/designer/data/systems/enterprise/components.html +154 -0
  140. package/dist/designer/data/systems/enterprise/tokens.css +63 -0
  141. package/dist/designer/data/systems/expo/DESIGN.md +284 -0
  142. package/dist/designer/data/systems/expo/components.html +342 -0
  143. package/dist/designer/data/systems/expo/tokens.css +64 -0
  144. package/dist/designer/data/systems/expressive/DESIGN.md +71 -0
  145. package/dist/designer/data/systems/expressive/components.html +136 -0
  146. package/dist/designer/data/systems/expressive/tokens.css +63 -0
  147. package/dist/designer/data/systems/fantasy/DESIGN.md +71 -0
  148. package/dist/designer/data/systems/fantasy/components.html +136 -0
  149. package/dist/designer/data/systems/fantasy/tokens.css +63 -0
  150. package/dist/designer/data/systems/ferrari/DESIGN.md +317 -0
  151. package/dist/designer/data/systems/ferrari/components.html +342 -0
  152. package/dist/designer/data/systems/ferrari/tokens.css +64 -0
  153. package/dist/designer/data/systems/figma/DESIGN.md +223 -0
  154. package/dist/designer/data/systems/figma/components.html +344 -0
  155. package/dist/designer/data/systems/figma/tokens.css +126 -0
  156. package/dist/designer/data/systems/flat/DESIGN.md +71 -0
  157. package/dist/designer/data/systems/flat/components.html +136 -0
  158. package/dist/designer/data/systems/flat/tokens.css +63 -0
  159. package/dist/designer/data/systems/framer/DESIGN.md +249 -0
  160. package/dist/designer/data/systems/framer/components.html +438 -0
  161. package/dist/designer/data/systems/framer/tokens.css +238 -0
  162. package/dist/designer/data/systems/friendly/DESIGN.md +71 -0
  163. package/dist/designer/data/systems/friendly/components.html +136 -0
  164. package/dist/designer/data/systems/friendly/tokens.css +63 -0
  165. package/dist/designer/data/systems/futuristic/DESIGN.md +71 -0
  166. package/dist/designer/data/systems/futuristic/components.html +136 -0
  167. package/dist/designer/data/systems/futuristic/tokens.css +63 -0
  168. package/dist/designer/data/systems/github/DESIGN.md +155 -0
  169. package/dist/designer/data/systems/github/components.html +383 -0
  170. package/dist/designer/data/systems/github/tokens.css +125 -0
  171. package/dist/designer/data/systems/glassmorphism/DESIGN.md +71 -0
  172. package/dist/designer/data/systems/glassmorphism/components.html +154 -0
  173. package/dist/designer/data/systems/glassmorphism/tokens.css +63 -0
  174. package/dist/designer/data/systems/gradient/DESIGN.md +71 -0
  175. package/dist/designer/data/systems/gradient/components.html +154 -0
  176. package/dist/designer/data/systems/gradient/tokens.css +63 -0
  177. package/dist/designer/data/systems/hashicorp/DESIGN.md +281 -0
  178. package/dist/designer/data/systems/hashicorp/components.html +502 -0
  179. package/dist/designer/data/systems/hashicorp/tokens.css +272 -0
  180. package/dist/designer/data/systems/hud/DESIGN.md +173 -0
  181. package/dist/designer/data/systems/hud/components.html +136 -0
  182. package/dist/designer/data/systems/hud/tokens.css +63 -0
  183. package/dist/designer/data/systems/huggingface/DESIGN.md +149 -0
  184. package/dist/designer/data/systems/huggingface/components.html +346 -0
  185. package/dist/designer/data/systems/huggingface/tokens.css +125 -0
  186. package/dist/designer/data/systems/ibm/DESIGN.md +335 -0
  187. package/dist/designer/data/systems/ibm/components.html +342 -0
  188. package/dist/designer/data/systems/ibm/tokens.css +64 -0
  189. package/dist/designer/data/systems/intercom/DESIGN.md +149 -0
  190. package/dist/designer/data/systems/intercom/components.html +557 -0
  191. package/dist/designer/data/systems/intercom/tokens.css +150 -0
  192. package/dist/designer/data/systems/kami/DESIGN.md +410 -0
  193. package/dist/designer/data/systems/kami/components.html +601 -0
  194. package/dist/designer/data/systems/kami/tokens.css +272 -0
  195. package/dist/designer/data/systems/kraken/DESIGN.md +128 -0
  196. package/dist/designer/data/systems/kraken/components.html +342 -0
  197. package/dist/designer/data/systems/kraken/tokens.css +64 -0
  198. package/dist/designer/data/systems/lamborghini/DESIGN.md +291 -0
  199. package/dist/designer/data/systems/lamborghini/components.html +342 -0
  200. package/dist/designer/data/systems/lamborghini/tokens.css +64 -0
  201. package/dist/designer/data/systems/levels/DESIGN.md +71 -0
  202. package/dist/designer/data/systems/levels/components.html +154 -0
  203. package/dist/designer/data/systems/levels/tokens.css +63 -0
  204. package/dist/designer/data/systems/linear-app/DESIGN.md +370 -0
  205. package/dist/designer/data/systems/linear-app/components.html +370 -0
  206. package/dist/designer/data/systems/linear-app/tokens.css +130 -0
  207. package/dist/designer/data/systems/lingo/DESIGN.md +71 -0
  208. package/dist/designer/data/systems/lingo/components.html +154 -0
  209. package/dist/designer/data/systems/lingo/tokens.css +63 -0
  210. package/dist/designer/data/systems/loom/DESIGN.md +201 -0
  211. package/dist/designer/data/systems/loom/components.html +446 -0
  212. package/dist/designer/data/systems/loom/tokens.css +138 -0
  213. package/dist/designer/data/systems/lovable/DESIGN.md +301 -0
  214. package/dist/designer/data/systems/lovable/components.html +441 -0
  215. package/dist/designer/data/systems/lovable/tokens.css +258 -0
  216. package/dist/designer/data/systems/luxury/DESIGN.md +71 -0
  217. package/dist/designer/data/systems/luxury/components.html +154 -0
  218. package/dist/designer/data/systems/luxury/tokens.css +63 -0
  219. package/dist/designer/data/systems/mastercard/DESIGN.md +368 -0
  220. package/dist/designer/data/systems/mastercard/components.html +342 -0
  221. package/dist/designer/data/systems/mastercard/tokens.css +64 -0
  222. package/dist/designer/data/systems/material/DESIGN.md +71 -0
  223. package/dist/designer/data/systems/material/components.html +154 -0
  224. package/dist/designer/data/systems/material/tokens.css +63 -0
  225. package/dist/designer/data/systems/meta/DESIGN.md +369 -0
  226. package/dist/designer/data/systems/meta/components.html +398 -0
  227. package/dist/designer/data/systems/meta/tokens.css +263 -0
  228. package/dist/designer/data/systems/minimal/DESIGN.md +71 -0
  229. package/dist/designer/data/systems/minimal/components.html +154 -0
  230. package/dist/designer/data/systems/minimal/tokens.css +63 -0
  231. package/dist/designer/data/systems/minimax/DESIGN.md +260 -0
  232. package/dist/designer/data/systems/minimax/components.html +590 -0
  233. package/dist/designer/data/systems/minimax/tokens.css +148 -0
  234. package/dist/designer/data/systems/mintlify/DESIGN.md +329 -0
  235. package/dist/designer/data/systems/mintlify/components.html +737 -0
  236. package/dist/designer/data/systems/mintlify/tokens.css +256 -0
  237. package/dist/designer/data/systems/miro/DESIGN.md +111 -0
  238. package/dist/designer/data/systems/miro/components.html +342 -0
  239. package/dist/designer/data/systems/miro/tokens.css +64 -0
  240. package/dist/designer/data/systems/mission-control/DESIGN.md +474 -0
  241. package/dist/designer/data/systems/mission-control/components.html +136 -0
  242. package/dist/designer/data/systems/mission-control/tokens.css +63 -0
  243. package/dist/designer/data/systems/mistral-ai/DESIGN.md +264 -0
  244. package/dist/designer/data/systems/mistral-ai/components.html +338 -0
  245. package/dist/designer/data/systems/mistral-ai/tokens.css +125 -0
  246. package/dist/designer/data/systems/modern/DESIGN.md +71 -0
  247. package/dist/designer/data/systems/modern/components.html +154 -0
  248. package/dist/designer/data/systems/modern/tokens.css +63 -0
  249. package/dist/designer/data/systems/mongodb/DESIGN.md +269 -0
  250. package/dist/designer/data/systems/mongodb/components.html +462 -0
  251. package/dist/designer/data/systems/mongodb/tokens.css +176 -0
  252. package/dist/designer/data/systems/mono/DESIGN.md +71 -0
  253. package/dist/designer/data/systems/mono/components.html +136 -0
  254. package/dist/designer/data/systems/mono/tokens.css +63 -0
  255. package/dist/designer/data/systems/neobrutalism/DESIGN.md +71 -0
  256. package/dist/designer/data/systems/neobrutalism/components.html +136 -0
  257. package/dist/designer/data/systems/neobrutalism/tokens.css +63 -0
  258. package/dist/designer/data/systems/neon/DESIGN.md +71 -0
  259. package/dist/designer/data/systems/neon/components.html +136 -0
  260. package/dist/designer/data/systems/neon/tokens.css +63 -0
  261. package/dist/designer/data/systems/neumorphism/DESIGN.md +71 -0
  262. package/dist/designer/data/systems/neumorphism/components.html +136 -0
  263. package/dist/designer/data/systems/neumorphism/tokens.css +63 -0
  264. package/dist/designer/data/systems/nike/DESIGN.md +366 -0
  265. package/dist/designer/data/systems/nike/components.html +512 -0
  266. package/dist/designer/data/systems/nike/tokens.css +304 -0
  267. package/dist/designer/data/systems/notion/DESIGN.md +312 -0
  268. package/dist/designer/data/systems/notion/components.html +413 -0
  269. package/dist/designer/data/systems/notion/tokens.css +130 -0
  270. package/dist/designer/data/systems/nvidia/DESIGN.md +296 -0
  271. package/dist/designer/data/systems/nvidia/components.html +414 -0
  272. package/dist/designer/data/systems/nvidia/tokens.css +133 -0
  273. package/dist/designer/data/systems/ollama/DESIGN.md +270 -0
  274. package/dist/designer/data/systems/ollama/components.html +700 -0
  275. package/dist/designer/data/systems/ollama/tokens.css +242 -0
  276. package/dist/designer/data/systems/openai/DESIGN.md +140 -0
  277. package/dist/designer/data/systems/openai/components.html +382 -0
  278. package/dist/designer/data/systems/openai/tokens.css +133 -0
  279. package/dist/designer/data/systems/opencode-ai/DESIGN.md +284 -0
  280. package/dist/designer/data/systems/opencode-ai/components.html +389 -0
  281. package/dist/designer/data/systems/opencode-ai/tokens.css +126 -0
  282. package/dist/designer/data/systems/pacman/DESIGN.md +71 -0
  283. package/dist/designer/data/systems/pacman/components.html +342 -0
  284. package/dist/designer/data/systems/pacman/tokens.css +64 -0
  285. package/dist/designer/data/systems/paper/DESIGN.md +71 -0
  286. package/dist/designer/data/systems/paper/components.html +136 -0
  287. package/dist/designer/data/systems/paper/tokens.css +63 -0
  288. package/dist/designer/data/systems/perplexity/DESIGN.md +286 -0
  289. package/dist/designer/data/systems/perplexity/components.html +455 -0
  290. package/dist/designer/data/systems/perplexity/tokens.css +151 -0
  291. package/dist/designer/data/systems/perspective/DESIGN.md +71 -0
  292. package/dist/designer/data/systems/perspective/components.html +136 -0
  293. package/dist/designer/data/systems/perspective/tokens.css +63 -0
  294. package/dist/designer/data/systems/pinterest/DESIGN.md +233 -0
  295. package/dist/designer/data/systems/pinterest/components.html +865 -0
  296. package/dist/designer/data/systems/pinterest/tokens.css +262 -0
  297. package/dist/designer/data/systems/playstation/DESIGN.md +367 -0
  298. package/dist/designer/data/systems/playstation/components.html +414 -0
  299. package/dist/designer/data/systems/playstation/tokens.css +150 -0
  300. package/dist/designer/data/systems/posthog/DESIGN.md +259 -0
  301. package/dist/designer/data/systems/posthog/components.html +827 -0
  302. package/dist/designer/data/systems/posthog/tokens.css +272 -0
  303. package/dist/designer/data/systems/premium/DESIGN.md +71 -0
  304. package/dist/designer/data/systems/premium/components.html +154 -0
  305. package/dist/designer/data/systems/premium/tokens.css +63 -0
  306. package/dist/designer/data/systems/professional/DESIGN.md +71 -0
  307. package/dist/designer/data/systems/professional/components.html +136 -0
  308. package/dist/designer/data/systems/professional/tokens.css +63 -0
  309. package/dist/designer/data/systems/publication/DESIGN.md +71 -0
  310. package/dist/designer/data/systems/publication/components.html +154 -0
  311. package/dist/designer/data/systems/publication/tokens.css +63 -0
  312. package/dist/designer/data/systems/raycast/DESIGN.md +271 -0
  313. package/dist/designer/data/systems/raycast/components.html +507 -0
  314. package/dist/designer/data/systems/raycast/tokens.css +143 -0
  315. package/dist/designer/data/systems/refined/DESIGN.md +71 -0
  316. package/dist/designer/data/systems/refined/components.html +136 -0
  317. package/dist/designer/data/systems/refined/tokens.css +63 -0
  318. package/dist/designer/data/systems/renault/DESIGN.md +314 -0
  319. package/dist/designer/data/systems/renault/components.html +154 -0
  320. package/dist/designer/data/systems/renault/tokens.css +63 -0
  321. package/dist/designer/data/systems/replicate/DESIGN.md +264 -0
  322. package/dist/designer/data/systems/replicate/components.html +340 -0
  323. package/dist/designer/data/systems/replicate/tokens.css +125 -0
  324. package/dist/designer/data/systems/resend/DESIGN.md +306 -0
  325. package/dist/designer/data/systems/resend/components.html +839 -0
  326. package/dist/designer/data/systems/resend/tokens.css +353 -0
  327. package/dist/designer/data/systems/retro/DESIGN.md +71 -0
  328. package/dist/designer/data/systems/retro/components.html +136 -0
  329. package/dist/designer/data/systems/retro/tokens.css +63 -0
  330. package/dist/designer/data/systems/revolut/DESIGN.md +188 -0
  331. package/dist/designer/data/systems/revolut/components.html +342 -0
  332. package/dist/designer/data/systems/revolut/tokens.css +64 -0
  333. package/dist/designer/data/systems/runwayml/DESIGN.md +247 -0
  334. package/dist/designer/data/systems/runwayml/components.html +638 -0
  335. package/dist/designer/data/systems/runwayml/tokens.css +204 -0
  336. package/dist/designer/data/systems/sanity/DESIGN.md +360 -0
  337. package/dist/designer/data/systems/sanity/components.html +342 -0
  338. package/dist/designer/data/systems/sanity/tokens.css +64 -0
  339. package/dist/designer/data/systems/sentry/DESIGN.md +265 -0
  340. package/dist/designer/data/systems/sentry/components.html +387 -0
  341. package/dist/designer/data/systems/sentry/tokens.css +219 -0
  342. package/dist/designer/data/systems/shadcn/DESIGN.md +71 -0
  343. package/dist/designer/data/systems/shadcn/components.html +732 -0
  344. package/dist/designer/data/systems/shadcn/tokens.css +255 -0
  345. package/dist/designer/data/systems/shopify/DESIGN.md +353 -0
  346. package/dist/designer/data/systems/shopify/components.html +342 -0
  347. package/dist/designer/data/systems/shopify/tokens.css +141 -0
  348. package/dist/designer/data/systems/simple/DESIGN.md +71 -0
  349. package/dist/designer/data/systems/simple/components.html +136 -0
  350. package/dist/designer/data/systems/simple/tokens.css +63 -0
  351. package/dist/designer/data/systems/skeumorphism/DESIGN.md +71 -0
  352. package/dist/designer/data/systems/skeumorphism/components.html +136 -0
  353. package/dist/designer/data/systems/skeumorphism/tokens.css +63 -0
  354. package/dist/designer/data/systems/slack/DESIGN.md +363 -0
  355. package/dist/designer/data/systems/slack/components.html +387 -0
  356. package/dist/designer/data/systems/slack/tokens.css +127 -0
  357. package/dist/designer/data/systems/sleek/DESIGN.md +71 -0
  358. package/dist/designer/data/systems/sleek/components.html +136 -0
  359. package/dist/designer/data/systems/sleek/tokens.css +63 -0
  360. package/dist/designer/data/systems/spacex/DESIGN.md +197 -0
  361. package/dist/designer/data/systems/spacex/components.html +496 -0
  362. package/dist/designer/data/systems/spacex/tokens.css +154 -0
  363. package/dist/designer/data/systems/spacious/DESIGN.md +71 -0
  364. package/dist/designer/data/systems/spacious/components.html +136 -0
  365. package/dist/designer/data/systems/spacious/tokens.css +63 -0
  366. package/dist/designer/data/systems/spotify/DESIGN.md +249 -0
  367. package/dist/designer/data/systems/spotify/components.html +365 -0
  368. package/dist/designer/data/systems/spotify/tokens.css +127 -0
  369. package/dist/designer/data/systems/starbucks/DESIGN.md +583 -0
  370. package/dist/designer/data/systems/starbucks/components.html +493 -0
  371. package/dist/designer/data/systems/starbucks/tokens.css +182 -0
  372. package/dist/designer/data/systems/storytelling/DESIGN.md +71 -0
  373. package/dist/designer/data/systems/storytelling/components.html +136 -0
  374. package/dist/designer/data/systems/storytelling/tokens.css +63 -0
  375. package/dist/designer/data/systems/stripe/DESIGN.md +325 -0
  376. package/dist/designer/data/systems/stripe/components.html +1018 -0
  377. package/dist/designer/data/systems/stripe/tokens.css +295 -0
  378. package/dist/designer/data/systems/supabase/DESIGN.md +258 -0
  379. package/dist/designer/data/systems/supabase/components.html +741 -0
  380. package/dist/designer/data/systems/supabase/tokens.css +294 -0
  381. package/dist/designer/data/systems/superhuman/DESIGN.md +255 -0
  382. package/dist/designer/data/systems/superhuman/components.html +537 -0
  383. package/dist/designer/data/systems/superhuman/tokens.css +160 -0
  384. package/dist/designer/data/systems/tesla/DESIGN.md +289 -0
  385. package/dist/designer/data/systems/tesla/components.html +724 -0
  386. package/dist/designer/data/systems/tesla/tokens.css +285 -0
  387. package/dist/designer/data/systems/tetris/DESIGN.md +71 -0
  388. package/dist/designer/data/systems/tetris/components.html +342 -0
  389. package/dist/designer/data/systems/tetris/tokens.css +64 -0
  390. package/dist/designer/data/systems/theverge/DESIGN.md +342 -0
  391. package/dist/designer/data/systems/theverge/components.html +342 -0
  392. package/dist/designer/data/systems/theverge/tokens.css +64 -0
  393. package/dist/designer/data/systems/together-ai/DESIGN.md +266 -0
  394. package/dist/designer/data/systems/together-ai/components.html +422 -0
  395. package/dist/designer/data/systems/together-ai/tokens.css +127 -0
  396. package/dist/designer/data/systems/totality-festival/DESIGN.md +206 -0
  397. package/dist/designer/data/systems/totality-festival/components.html +136 -0
  398. package/dist/designer/data/systems/totality-festival/tokens.css +63 -0
  399. package/dist/designer/data/systems/trading-terminal/DESIGN.md +178 -0
  400. package/dist/designer/data/systems/trading-terminal/components.html +154 -0
  401. package/dist/designer/data/systems/trading-terminal/tokens.css +63 -0
  402. package/dist/designer/data/systems/uber/DESIGN.md +298 -0
  403. package/dist/designer/data/systems/uber/components.html +347 -0
  404. package/dist/designer/data/systems/uber/tokens.css +131 -0
  405. package/dist/designer/data/systems/urdu/DESIGN.md +1002 -0
  406. package/dist/designer/data/systems/urdu/components.html +136 -0
  407. package/dist/designer/data/systems/urdu/tokens.css +63 -0
  408. package/dist/designer/data/systems/vercel/DESIGN.md +313 -0
  409. package/dist/designer/data/systems/vercel/components.html +839 -0
  410. package/dist/designer/data/systems/vercel/tokens.css +270 -0
  411. package/dist/designer/data/systems/vibrant/DESIGN.md +71 -0
  412. package/dist/designer/data/systems/vibrant/components.html +136 -0
  413. package/dist/designer/data/systems/vibrant/tokens.css +63 -0
  414. package/dist/designer/data/systems/vintage/DESIGN.md +71 -0
  415. package/dist/designer/data/systems/vintage/components.html +136 -0
  416. package/dist/designer/data/systems/vintage/tokens.css +63 -0
  417. package/dist/designer/data/systems/vodafone/DESIGN.md +426 -0
  418. package/dist/designer/data/systems/vodafone/components.html +342 -0
  419. package/dist/designer/data/systems/vodafone/tokens.css +64 -0
  420. package/dist/designer/data/systems/voltagent/DESIGN.md +326 -0
  421. package/dist/designer/data/systems/voltagent/components.html +154 -0
  422. package/dist/designer/data/systems/voltagent/tokens.css +63 -0
  423. package/dist/designer/data/systems/warm-editorial/DESIGN.md +65 -0
  424. package/dist/designer/data/systems/warm-editorial/components.html +136 -0
  425. package/dist/designer/data/systems/warm-editorial/tokens.css +63 -0
  426. package/dist/designer/data/systems/warp/DESIGN.md +256 -0
  427. package/dist/designer/data/systems/warp/components.html +411 -0
  428. package/dist/designer/data/systems/warp/tokens.css +156 -0
  429. package/dist/designer/data/systems/webex/DESIGN.md +207 -0
  430. package/dist/designer/data/systems/webex/components.html +342 -0
  431. package/dist/designer/data/systems/webex/tokens.css +64 -0
  432. package/dist/designer/data/systems/webflow/DESIGN.md +95 -0
  433. package/dist/designer/data/systems/webflow/components.html +413 -0
  434. package/dist/designer/data/systems/webflow/tokens.css +191 -0
  435. package/dist/designer/data/systems/wechat/DESIGN.md +302 -0
  436. package/dist/designer/data/systems/wechat/components.html +507 -0
  437. package/dist/designer/data/systems/wechat/tokens.css +176 -0
  438. package/dist/designer/data/systems/wired/DESIGN.md +281 -0
  439. package/dist/designer/data/systems/wired/components.html +342 -0
  440. package/dist/designer/data/systems/wired/tokens.css +64 -0
  441. package/dist/designer/data/systems/wise/DESIGN.md +176 -0
  442. package/dist/designer/data/systems/wise/components.html +365 -0
  443. package/dist/designer/data/systems/wise/tokens.css +141 -0
  444. package/dist/designer/data/systems/x-ai/DESIGN.md +260 -0
  445. package/dist/designer/data/systems/x-ai/components.html +460 -0
  446. package/dist/designer/data/systems/x-ai/tokens.css +268 -0
  447. package/dist/designer/data/systems/xiaohongshu/DESIGN.md +402 -0
  448. package/dist/designer/data/systems/xiaohongshu/components.html +865 -0
  449. package/dist/designer/data/systems/xiaohongshu/tokens.css +193 -0
  450. package/dist/designer/data/systems/zapier/DESIGN.md +331 -0
  451. package/dist/designer/data/systems/zapier/components.html +342 -0
  452. package/dist/designer/data/systems/zapier/tokens.css +64 -0
  453. package/dist/designer/guidelines.js +176 -0
  454. package/dist/designer/index.js +236 -0
  455. package/dist/designer/skills.js +1675 -0
  456. package/dist/designer/systems.js +216 -0
  457. package/dist/server/pi-bridge.js +155 -5
  458. package/dist/server/session-stream.js +45 -1
  459. package/package.json +1 -1
package/dist/designer/data/systems/minimal/DESIGN.md ADDED
@@ -0,0 +1,71 @@
1
+ # Design System Inspired by Minimal
2
+
3
+ > Category: Modern & Minimal
4
+ > Stripped-back design emphasizing whitespace, clean typography, and restrained color for maximum clarity and focus.
5
+
6
+ ## 1. Visual Theme & Atmosphere
7
+
8
+ Stripped-back design emphasizing whitespace, clean typography, and restrained color for maximum clarity and focus.
9
+
10
+ - **Visual style:** minimal, clean, bold
11
+ - **Color stance:** primary, neutral, success, warning, danger
12
+ - **Design intent:** Keep outputs recognizable to this style family while preserving usability and readability.
13
+
14
+ ## 2. Color
15
+
16
+ - **Primary:** `#0C0C09` — Token from style foundations.
17
+ - **Secondary:** `#312C85` — Token from style foundations.
18
+ - **Success:** `#16A34A` — Token from style foundations.
19
+ - **Warning:** `#D97706` — Token from style foundations.
20
+ - **Danger:** `#DC2626` — Token from style foundations.
21
+ - **Surface:** `#F4F4F1` — Token from style foundations.
22
+ - **Text:** `#0C0C09` — Token from style foundations.
23
+ - **Neutral:** `#F4F4F1` — Derived from the surface token for official format compatibility.
24
+
25
+ - Favor Primary (#0C0C09) for CTA emphasis.
26
+ - Use Surface (#F4F4F1) for large backgrounds and cards.
27
+ - Keep body copy on Text (#0C0C09) for legibility.
28
+
29
+ ## 3. Typography
30
+
31
+ - **Scale:** desktop-first expressive scale
32
+ - **Families:** primary=Open Sans, display=Inter, mono=Inconsolata
33
+ - **Weights:** 100, 200, 300, 400, 500, 600, 700, 800, 900
34
+ - Headings should carry the style personality; body text should optimize scanability and contrast.
35
+
36
+ ## 4. Spacing & Grid
37
+
38
+ - **Spacing scale:** 4/8/12/16/24/32
39
+ - Keep vertical rhythm consistent across sections and components.
40
+ - Align columns and modules to a predictable grid; avoid ad-hoc offsets.
41
+
42
+ ## 5. Layout & Composition
43
+
44
+ - Prefer clear content blocks with consistent internal padding.
45
+ - Keep hierarchy obvious: headline → support text → primary action.
46
+ - Use whitespace to separate concerns before adding borders or shadows.
47
+
48
+ ## 6. Components
49
+
50
+ - Buttons: primary action uses `#0C0C09`; secondary actions stay neutral.
51
+ - Inputs: strong focus-visible states, clear labels, and predictable error messaging.
52
+ - Cards/sections: use consistent radii, spacing, and elevation strategy across the page.
53
+
54
+ ## 7. Motion & Interaction
55
+
56
+ - Use subtle transitions that emphasize Primary (#0C0C09) as the interaction signal.
57
+ - Default to short, purposeful transitions (150–250ms) with stable easing.
58
+ - Ensure hover, focus-visible, active, disabled, and loading states are explicit.
59
+
60
+ ## 8. Voice & Brand
61
+
62
+ - Tone should reflect the visual style: concise, confident, and product-specific.
63
+ - Keep microcopy action-oriented and avoid generic filler language.
64
+ - Preserve the style identity in headlines while keeping UI labels literal and clear.
65
+
66
+ ## 9. Anti-patterns
67
+
68
+ - Do not introduce off-palette colors when an existing token can solve the problem.
69
+ - Do not flatten hierarchy by using the same type size/weight for all text.
70
+ - Do not add decorative effects that reduce readability or accessibility.
71
+ - Do not mix unrelated visual metaphors in the same interface.
package/dist/designer/data/systems/minimal/components.html ADDED
@@ -0,0 +1,154 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
6
+ <title>Minimal - reference components</title>
7
+ <meta name="description" content="Reference fixture for design-systems/minimal: minimal product language with white space, black text, hairline borders, and quiet interaction." />
8
+ <style>
9
+ :root {
10
+ --bg: #ffffff;
11
+ --surface: #fafafa;
12
+ --surface-warm: #f5f5f5;
13
+ --fg: #111111;
14
+ --fg-2: #3a3a3a;
15
+ --muted: #777777;
16
+ --meta: #111111;
17
+ --border: #e2e2e2;
18
+ --border-soft: #eeeeee;
19
+ --accent: #111111;
20
+ --accent-on: #ffffff;
21
+ --accent-hover: color-mix(in oklab, var(--accent), black 8%);
22
+ --accent-active: color-mix(in oklab, var(--accent), black 14%);
23
+ --success: #168a46;
24
+ --warn: #b7791f;
25
+ --danger: #c53030;
26
+ --font-display: Inter, system-ui, sans-serif;
27
+ --font-body: Inter, system-ui, sans-serif;
28
+ --font-mono: "SF Mono", ui-monospace, Menlo, monospace;
29
+ --text-xs: 12px;
30
+ --text-sm: 14px;
31
+ --text-base: 16px;
32
+ --text-lg: 18px;
33
+ --text-xl: 22px;
34
+ --text-2xl: 32px;
35
+ --text-3xl: 48px;
36
+ --text-4xl: 64px;
37
+ --leading-body: 1.55;
38
+ --leading-tight: 1.08;
39
+ --tracking-display: -0.02em;
40
+ --space-1: 4px;
41
+ --space-2: 8px;
42
+ --space-3: 12px;
43
+ --space-4: 16px;
44
+ --space-5: 20px;
45
+ --space-6: 24px;
46
+ --space-8: 32px;
47
+ --space-12: 48px;
48
+ --section-y-desktop: 112px;
49
+ --section-y-tablet: 80px;
50
+ --section-y-phone: 56px;
51
+ --radius-sm: 2px;
52
+ --radius-md: 4px;
53
+ --radius-lg: 8px;
54
+ --radius-pill: 9999px;
55
+ --elev-flat: none;
56
+ --elev-ring: 0 0 0 1px var(--border);
57
+ --elev-raised: 0 12px 30px rgba(0, 0, 0, 0.08);
58
+ --focus-ring: 0 0 0 3px rgba(17, 17, 17, 0.18);
59
+ --motion-fast: 140ms;
60
+ --motion-base: 220ms;
61
+ --ease-standard: cubic-bezier(0.2, 0, 0, 1);
62
+ --container-max: 1120px;
63
+ --container-gutter-desktop: 36px;
64
+ --container-gutter-tablet: 24px;
65
+ --container-gutter-phone: 16px;
66
+ }
67
+
68
+ *, *::before, *::after { box-sizing: border-box; }
69
+ html, body { margin: 0; padding: 0; }
70
+ body {
71
+ min-height: 100vh;
72
+ background: var(--bg);
73
+ color: var(--fg);
74
+ font-family: var(--font-body);
75
+ font-size: var(--text-base);
76
+ line-height: var(--leading-body);
77
+ -webkit-font-smoothing: antialiased;
78
+ }
79
+ .page { min-height: 100vh; background: linear-gradient(135deg, #ffffff 0%, #fafafa 100%); }
80
+ .container { max-width: var(--container-max); margin-inline: auto; padding-inline: var(--container-gutter-desktop); }
81
+ section { padding-block: var(--section-y-desktop); }
82
+ @media (max-width: 1023px) { .container { padding-inline: var(--container-gutter-tablet); } section { padding-block: var(--section-y-tablet); } }
83
+ @media (max-width: 639px) { .container { padding-inline: var(--container-gutter-phone); } section { padding-block: var(--section-y-phone); } }
84
+ h1, h2, h3, p { margin: 0; }
85
+ h1, h2, h3 { font-family: var(--font-display); line-height: var(--leading-tight); letter-spacing: var(--tracking-display); }
86
+ h1 { max-width: 820px; font-size: var(--text-4xl); font-weight: 760; }
87
+ h2 { font-size: var(--text-3xl); font-weight: 700; }
88
+ h3 { font-size: var(--text-xl); font-weight: 700; }
89
+ .eyebrow { color: var(--meta); font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
90
+ .lead { max-width: 640px; color: var(--fg-2); font-size: var(--text-lg); }
91
+ .hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr); gap: var(--space-8); align-items: center; }
92
+ .stack > * + * { margin-block-start: var(--space-4); }
93
+ .actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-block-start: var(--space-6); }
94
+ .btn {
95
+ display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 var(--space-5);
96
+ border: 1px solid transparent; border-radius: var(--radius-md); font: 700 var(--text-sm) / 1 var(--font-body);
97
+ color: inherit; text-decoration: none; cursor: pointer; transition: background-color var(--motion-fast) var(--ease-standard), border-color var(--motion-fast) var(--ease-standard), color var(--motion-fast) var(--ease-standard), transform var(--motion-fast) var(--ease-standard), box-shadow var(--motion-fast) var(--ease-standard);
98
+ }
99
+ .btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }
100
+ .btn-primary { background: var(--accent); color: var(--accent-on); }
101
+ .btn-primary:hover { background: var(--accent-hover); transform: translateY(-1px); }
102
+ .btn-secondary { background: var(--surface); color: var(--fg); border-color: var(--border); box-shadow: var(--elev-ring); }
103
+ .btn-secondary:hover { border-color: var(--accent); color: var(--accent); }
104
+ .panel { background: color-mix(in oklab, var(--surface), transparent 4%); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--elev-raised); overflow: hidden; }
105
+ .panel-head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding: var(--space-5); border-bottom: 1px solid var(--border-soft); }
106
+ .status { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--meta); font: 700 var(--text-xs) / 1 var(--font-mono); text-transform: uppercase; letter-spacing: 0.08em; }
107
+ .status::before { width: 8px; height: 8px; border-radius: var(--radius-pill); background: var(--success); content: ""; }
108
+ .metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--border-soft); }
109
+ .metric { padding: var(--space-5); border-right: 1px solid var(--border-soft); }
110
+ .metric:last-child { border-right: 0; }
111
+ .metric strong { display: block; font-family: var(--font-display); font-size: var(--text-2xl); line-height: var(--leading-tight); }
112
+ .metric span { color: var(--muted); font-size: var(--text-sm); }
113
+ .card-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); padding: var(--space-5); }
114
+ .mini-card { min-height: 148px; padding: var(--space-5); border: 1px solid var(--border-soft); border-radius: var(--radius-md); background: var(--surface-warm); }
115
+ .mini-card p, .tile p { color: var(--muted); font-size: var(--text-sm); margin-block-start: var(--space-3); }
116
+ .swatches { display: flex; gap: var(--space-2); margin-block-start: var(--space-4); }
117
+ .swatch { width: 32px; height: 32px; border-radius: var(--radius-sm); border: 1px solid var(--border); }
118
+ .swatch.accent { background: var(--accent); } .swatch.surface { background: var(--surface); } .swatch.warm { background: var(--surface-warm); } .swatch.fg { background: var(--fg); }
119
+ .field { display: grid; gap: var(--space-2); margin-block-start: var(--space-5); }
120
+ label { color: var(--fg-2); font-size: var(--text-sm); font-weight: 700; }
121
+ input { width: 100%; min-height: 46px; padding: 0 var(--space-4); border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); color: var(--fg); font: inherit; }
122
+ input:focus { outline: none; box-shadow: var(--focus-ring); border-color: var(--accent); }
123
+ .lower { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
124
+ .tile { padding: var(--space-5); border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
125
+ @media (max-width: 860px) { .hero, .lower { grid-template-columns: 1fr; } .metric-grid, .card-row { grid-template-columns: 1fr; } .metric { border-right: 0; border-bottom: 1px solid var(--border-soft); } .metric:last-child { border-bottom: 0; } }
126
+ </style>
127
+ </head>
128
+ <body>
129
+ <main class="page">
130
+ <section>
131
+ <div class="container hero">
132
+ <div class="stack">
133
+ <p class="eyebrow">Minimal design system</p>
134
+ <h1>Quiet interface system</h1>
135
+ <p class="lead">Strict reduction, generous whitespace, and almost invisible component chrome.</p>
136
+ <div class="actions" aria-label="Reference actions">
137
+ <a class="btn btn-primary" href="#">Primary action</a>
138
+ <a class="btn btn-secondary" href="#">Secondary action</a>
139
+ </div>
140
+ </div>
141
+ <article class="panel" aria-label="Minimal component preview">
142
+ <div class="panel-head"><div><p class="eyebrow">Live module</p><h3>Reference component</h3></div><span class="status">online</span></div>
143
+ <div class="metric-grid"><div class="metric"><strong>98%</strong><span>Signal quality</span></div><div class="metric"><strong>24</strong><span>Active flows</span></div><div class="metric"><strong>3.2s</strong><span>Response time</span></div></div>
144
+ <div class="card-row">
145
+ <div class="mini-card"><h3>Palette</h3><p>minimal product language with white space, black text, hairline borders, and quiet interaction.</p><div class="swatches" aria-label="Token swatches"><span class="swatch accent"></span><span class="swatch surface"></span><span class="swatch warm"></span><span class="swatch fg"></span></div></div>
146
+ <div class="mini-card"><h3>Control</h3><p>Focus, hover, and status states share the same brand signal.</p><div class="field"><label for="minimal-input">Reference input</label><input id="minimal-input" value="Minimal system token" /></div></div>
147
+ </div>
148
+ </article>
149
+ </div>
150
+ </section>
151
+ <section><div class="container lower"><article class="tile"><p class="eyebrow">Typography</p><h2>Display rhythm</h2><p>Headlines use the display stack with the declared scale and leading.</p></article><article class="tile"><p class="eyebrow">Surface</p><h2>Layer system</h2><p>Cards, warm panels, borders, and raised states resolve through shared tokens.</p></article><article class="tile"><p class="eyebrow">Interaction</p><h2>Motion states</h2><p>Buttons, inputs, and panels use brand-specific focus rings and easing.</p></article></div></section>
152
+ </main>
153
+ </body>
154
+ </html>
package/dist/designer/data/systems/minimal/tokens.css ADDED
@@ -0,0 +1,63 @@
1
+ /* design-systems/minimal/tokens.css
2
+ * Structured token bindings for Minimal.
3
+ * minimal product language with white space, black text, hairline borders, and quiet interaction.
4
+ */
5
+
6
+ :root {
7
+ --bg: #ffffff;
8
+ --surface: #fafafa;
9
+ --surface-warm: #f5f5f5;
10
+ --fg: #111111;
11
+ --fg-2: #3a3a3a;
12
+ --muted: #777777;
13
+ --meta: #111111;
14
+ --border: #e2e2e2;
15
+ --border-soft: #eeeeee;
16
+ --accent: #111111;
17
+ --accent-on: #ffffff;
18
+ --accent-hover: color-mix(in oklab, var(--accent), black 8%);
19
+ --accent-active: color-mix(in oklab, var(--accent), black 14%);
20
+ --success: #168a46;
21
+ --warn: #b7791f;
22
+ --danger: #c53030;
23
+ --font-display: Inter, system-ui, sans-serif;
24
+ --font-body: Inter, system-ui, sans-serif;
25
+ --font-mono: "SF Mono", ui-monospace, Menlo, monospace;
26
+ --text-xs: 12px;
27
+ --text-sm: 14px;
28
+ --text-base: 16px;
29
+ --text-lg: 18px;
30
+ --text-xl: 22px;
31
+ --text-2xl: 32px;
32
+ --text-3xl: 48px;
33
+ --text-4xl: 64px;
34
+ --leading-body: 1.55;
35
+ --leading-tight: 1.08;
36
+ --tracking-display: -0.02em;
37
+ --space-1: 4px;
38
+ --space-2: 8px;
39
+ --space-3: 12px;
40
+ --space-4: 16px;
41
+ --space-5: 20px;
42
+ --space-6: 24px;
43
+ --space-8: 32px;
44
+ --space-12: 48px;
45
+ --section-y-desktop: 112px;
46
+ --section-y-tablet: 80px;
47
+ --section-y-phone: 56px;
48
+ --radius-sm: 2px;
49
+ --radius-md: 4px;
50
+ --radius-lg: 8px;
51
+ --radius-pill: 9999px;
52
+ --elev-flat: none;
53
+ --elev-ring: 0 0 0 1px var(--border);
54
+ --elev-raised: 0 12px 30px rgba(0, 0, 0, 0.08);
55
+ --focus-ring: 0 0 0 3px rgba(17, 17, 17, 0.18);
56
+ --motion-fast: 140ms;
57
+ --motion-base: 220ms;
58
+ --ease-standard: cubic-bezier(0.2, 0, 0, 1);
59
+ --container-max: 1120px;
60
+ --container-gutter-desktop: 36px;
61
+ --container-gutter-tablet: 24px;
62
+ --container-gutter-phone: 16px;
63
+ }
package/dist/designer/data/systems/minimax/DESIGN.md ADDED
@@ -0,0 +1,260 @@
1
+ # Design System Inspired by MiniMax
2
+
3
+ > Category: AI & LLM
4
+ > AI model provider. Bold dark interface with neon accents.
5
+
6
+ ## 1. Visual Theme & Atmosphere
7
+
8
+ MiniMax's website is a clean, product-showcase platform for a Chinese AI technology company that bridges consumer-friendly appeal with technical credibility. The design language is predominantly white-space-driven with a light, airy feel — pure white backgrounds (`#ffffff`) dominate, letting colorful product cards and AI model illustrations serve as the visual anchors. The overall aesthetic sits at the intersection of Apple's product marketing clarity and a playful, rounded design language that makes AI technology feel approachable.
9
+
10
+ The typography system is notably multi-font: DM Sans serves as the primary UI workhorse, Outfit handles display headings with geometric elegance, Poppins appears for mid-tier headings, and Roboto handles data-heavy contexts. This variety reflects a brand in rapid growth — each font serves a distinct communicative purpose rather than competing for attention. The hero heading at 80px weight 500 in both DM Sans and Outfit with a tight 1.10 line-height creates a bold but not aggressive opening statement.
11
+
12
+ What makes MiniMax distinctive is its pill-button geometry (9999px radius) for navigation and primary actions, combined with softer 8px–24px radiused cards for product showcases. The product cards themselves are richly colorful — vibrant gradients in pink, purple, orange, and blue — creating a "gallery of AI capabilities" feel. Against the white canvas, these colorful cards pop like app icons on a phone home screen, making each AI model/product feel like a self-contained creative tool.
13
+
14
+ **Key Characteristics:**
15
+ - White-dominant layout with colorful product card accents
16
+ - Multi-font system: DM Sans (UI), Outfit (display), Poppins (mid-tier), Roboto (data)
17
+ - Pill buttons (9999px radius) for primary navigation and CTAs
18
+ - Generous rounded cards (20px–24px radius) for product showcases
19
+ - Brand blue spectrum: from `#1456f0` (brand-6) through `#3b82f6` (primary-500) to `#60a5fa` (light)
20
+ - Brand pink (`#ea5ec1`) as secondary accent
21
+ - Near-black text (`#222222`, `#18181b`) on white backgrounds
22
+ - Purple-tinted shadows (`rgba(44, 30, 116, 0.16)`) creating subtle brand-colored depth
23
+ - Dark footer section (`#181e25`) with product/company links
24
+
25
+ ## 2. Color Palette & Roles
26
+
27
+ ### Brand Primary
28
+ - **Brand Blue** (`#1456f0`): `--brand-6`, primary brand identity color
29
+ - **Sky Blue** (`#3daeff`): `--col-brand00`, lighter brand variant for accents
30
+ - **Brand Pink** (`#ea5ec1`): `--col-brand02`, secondary brand accent
31
+
32
+ ### Blue Scale (Primary)
33
+ - **Primary 200** (`#bfdbfe`): `--color-primary-200`, light blue backgrounds
34
+ - **Primary Light** (`#60a5fa`): `--color-primary-light`, active states, highlights
35
+ - **Primary 500** (`#3b82f6`): `--color-primary-500`, standard blue actions
36
+ - **Primary 600** (`#2563eb`): `--color-primary-600`, hover states
37
+ - **Primary 700** (`#1d4ed8`): `--color-primary-700`, pressed/active states
38
+ - **Brand Deep** (`#17437d`): `--brand-3`, deep blue for emphasis
39
+
40
+ ### Text Colors
41
+ - **Near Black** (`#222222`): `--col-text00`, primary text
42
+ - **Dark** (`#18181b`): Button text, headings
43
+ - **Charcoal** (`#181e25`): Dark surface text, footer background
44
+ - **Dark Gray** (`#45515e`): `--col-text04`, secondary text
45
+ - **Mid Gray** (`#8e8e93`): Tertiary text, muted labels
46
+ - **Light Gray** (`#5f5f5f`): `--brand-2`, helper text
47
+
48
+ ### Surface & Background
49
+ - **Pure White** (`#ffffff`): `--col-bg13`, primary background
50
+ - **Light Gray** (`#f0f0f0`): Secondary button backgrounds
51
+ - **Glass White** (`hsla(0, 0%, 100%, 0.4)`): `--fill-bg-white`, frosted glass overlay
52
+ - **Border Light** (`#f2f3f5`): Subtle section dividers
53
+ - **Border Gray** (`#e5e7eb`): Component borders
54
+
55
+ ### Semantic
56
+ - **Success Background** (`#e8ffea`): `--success-bg`, positive state backgrounds
57
+
58
+ ### Shadows
59
+ - **Standard** (`rgba(0, 0, 0, 0.08) 0px 4px 6px`): Default card shadow
60
+ - **Soft Glow** (`rgba(0, 0, 0, 0.08) 0px 0px 22.576px`): Ambient soft shadow
61
+ - **Brand Purple** (`rgba(44, 30, 116, 0.16) 0px 0px 15px`): Brand-tinted glow
62
+ - **Brand Purple Offset** (`rgba(44, 30, 116, 0.11) 6.5px 2px 17.5px`): Directional brand glow
63
+ - **Card Elevation** (`rgba(36, 36, 36, 0.08) 0px 12px 16px -4px`): Lifted card shadow
64
+
65
+ ## 3. Typography Rules
66
+
67
+ ### Font Families
68
+ - **Primary UI**: `DM Sans`, with fallbacks: `Helvetica Neue, Helvetica, Arial`
69
+ - **Display**: `Outfit`, with fallbacks: `Helvetica Neue, Helvetica, Arial`
70
+ - **Mid-tier**: `Poppins`
71
+ - **Data/Technical**: `Roboto`, with fallbacks: `Helvetica Neue, Helvetica, Arial`
72
+
73
+ ### Hierarchy
74
+
75
+ | Role | Font | Size | Weight | Line Height | Notes |
76
+ |------|------|------|--------|-------------|-------|
77
+ | Display Hero | DM Sans / Outfit | 80px (5.00rem) | 500 | 1.10 (tight) | Hero headlines |
78
+ | Section Heading | Outfit | 31px (1.94rem) | 600 | 1.50 | Feature section titles |
79
+ | Section Heading Alt | Roboto / DM Sans | 32px (2.00rem) | 600 | 0.88 (tight) | Compact headers |
80
+ | Card Title | Outfit | 28px (1.75rem) | 500–600 | 1.71 (relaxed) | Product card headings |
81
+ | Sub-heading | Poppins | 24px (1.50rem) | 500 | 1.50 | Mid-tier headings |
82
+ | Feature Label | Poppins | 18px (1.13rem) | 500 | 1.50 | Feature names |
83
+ | Body Large | DM Sans | 20px (1.25rem) | 500 | 1.50 | Emphasized body |
84
+ | Body | DM Sans | 16px (1.00rem) | 400–500 | 1.50 | Standard body text |
85
+ | Body Bold | DM Sans | 16px (1.00rem) | 700 | 1.50 | Strong emphasis |
86
+ | Nav/Link | DM Sans | 14px (0.88rem) | 400–500 | 1.50 | Navigation, links |
87
+ | Button Small | DM Sans | 13px (0.81rem) | 600 | 1.50 | Compact buttons |
88
+ | Caption | DM Sans / Poppins | 13px (0.81rem) | 400 | 1.70 (relaxed) | Metadata |
89
+ | Small Label | DM Sans | 12px (0.75rem) | 500–600 | 1.25–1.50 | Tags, badges |
90
+ | Micro | DM Sans / Outfit | 10px (0.63rem) | 400–500 | 1.50–1.80 | Tiny annotations |
91
+
92
+ ### Principles
93
+ - **Multi-font purpose**: DM Sans = UI workhorse (body, nav, buttons); Outfit = geometric display (headings, product names); Poppins = friendly mid-tier (sub-headings, features); Roboto = technical/data contexts.
94
+ - **Universal 1.50 line-height**: The overwhelming majority of text uses 1.50 line-height, creating a consistent reading rhythm regardless of font or size. Exceptions: display (1.10 tight) and some captions (1.70 relaxed).
95
+ - **Weight 500 as default emphasis**: Most headings use 500 (medium) rather than bold, creating a modern, approachable tone. 600 for section titles, 700 reserved for strong emphasis.
96
+ - **Compact hierarchy**: The size scale jumps from 80px display straight to 28–32px section, then 16–20px body — a deliberate compression that keeps the visual hierarchy feeling efficient.
97
+
98
+ ## 4. Component Stylings
99
+
100
+ ### Buttons
101
+
102
+ **Pill Primary Dark**
103
+ - Background: `#181e25`
104
+ - Text: `#ffffff`
105
+ - Padding: 11px 20px
106
+ - Radius: 8px
107
+ - Use: Primary CTA ("Get Started", "Learn More")
108
+
109
+ **Pill Nav**
110
+ - Background: `rgba(0, 0, 0, 0.05)` (subtle tint)
111
+ - Text: `#18181b`
112
+ - Radius: 9999px (full pill)
113
+ - Use: Navigation tabs, filter toggles
114
+
115
+ **Pill White**
116
+ - Background: `#ffffff`
117
+ - Text: `rgba(24, 30, 37, 0.8)`
118
+ - Radius: 9999px
119
+ - Opacity: 0.5 (default state)
120
+ - Use: Secondary nav, inactive tabs
121
+
122
+ **Secondary Light**
123
+ - Background: `#f0f0f0`
124
+ - Text: `#333333`
125
+ - Padding: 11px 20px
126
+ - Radius: 8px
127
+ - Use: Secondary actions
128
+
129
+ ### Product Cards
130
+ - Background: Vibrant gradients (pink/purple/orange/blue)
131
+ - Radius: 20px–24px (generous rounding)
132
+ - Shadow: `rgba(44, 30, 116, 0.16) 0px 0px 15px` (brand purple glow)
133
+ - Content: Product name, model version, descriptive text
134
+ - Each card has its own color palette matching the product identity
135
+
136
+ ### AI Product Cards (Matrix)
137
+ - Background: white with subtle shadow
138
+ - Radius: 13px–16px
139
+ - Shadow: `rgba(0, 0, 0, 0.08) 0px 4px 6px`
140
+ - Icon/illustration centered above product name
141
+ - Product name in DM Sans 14–16px weight 500
142
+
143
+ ### Links
144
+ - **Primary**: `#18181b` or `#181e25`, underline on dark text
145
+ - **Secondary**: `#8e8e93`, muted for less emphasis
146
+ - **On Dark**: `rgba(255, 255, 255, 0.8)` for footer and dark sections
147
+
148
+ ### Navigation
149
+ - Clean horizontal nav on white background
150
+ - MiniMax logo left-aligned (red accent in logo)
151
+ - DM Sans 14px weight 500 for nav items
152
+ - Pill-shaped active indicators (9999px radius)
153
+ - "Login" text link, minimal right-side actions
154
+ - Sticky header behavior
155
+
156
+ ## 5. Layout Principles
157
+
158
+ ### Spacing System
159
+ - Base unit: 8px
160
+ - Scale: 1px, 2px, 4px, 6px, 8px, 10px, 11px, 14px, 16px, 24px, 32px, 40px, 50px, 64px, 80px
161
+
162
+ ### Grid & Container
163
+ - Max content width centered on page
164
+ - Product card grids: horizontal scroll or 3–4 column layout
165
+ - Full-width white sections with contained content
166
+ - Dark footer at full-width
167
+
168
+ ### Breakpoints
169
+ | Name | Width | Key Changes |
170
+ |------|-------|-------------|
171
+ | Mobile | <768px | Single column, stacked cards |
172
+ | Tablet | 768–1024px | 2-column grids |
173
+ | Desktop | >1024px | Full layout, horizontal card scrolls |
174
+
175
+ ### Whitespace Philosophy
176
+ - **Gallery spacing**: Products are presented like gallery items with generous white space between cards, letting each AI model breathe as its own showcase.
177
+ - **Section rhythm**: Large vertical gaps (64px–80px) between major sections create distinct "chapters" of content.
178
+ - **Card breathing**: Product cards use internal padding of 16px–24px with ample whitespace around text.
179
+
180
+ ### Border Radius Scale
181
+ - Minimal (4px): Small tags, micro badges
182
+ - Standard (8px): Buttons, small cards
183
+ - Comfortable (11px–13px): Medium cards, panels
184
+ - Generous (16px–20px): Large product cards
185
+ - Large (22px–24px): Hero product cards, major containers
186
+ - Pill (30px–32px): Badge pills, rounded panels
187
+ - Full (9999px): Buttons, nav tabs
188
+
189
+ ## 6. Depth & Elevation
190
+
191
+ | Level | Treatment | Use |
192
+ |-------|-----------|-----|
193
+ | Flat (Level 0) | No shadow | White background, text blocks |
194
+ | Subtle (Level 1) | `rgba(0, 0, 0, 0.08) 0px 4px 6px` | Standard cards, containers |
195
+ | Ambient (Level 2) | `rgba(0, 0, 0, 0.08) 0px 0px 22.576px` | Soft glow around elements |
196
+ | Brand Glow (Level 3) | `rgba(44, 30, 116, 0.16) 0px 0px 15px` | Featured product cards |
197
+ | Elevated (Level 4) | `rgba(36, 36, 36, 0.08) 0px 12px 16px -4px` | Lifted cards, hover states |
198
+
199
+ **Shadow Philosophy**: MiniMax uses a distinctive purple-tinted shadow (`rgba(44, 30, 116, ...)`) for featured elements, creating a subtle brand-color glow that connects the shadow system to the blue brand identity. Standard shadows use neutral black but at low opacity (0.08), keeping everything feeling light and airy. The directional shadow variant (6.5px offset) adds dimensional interest to hero product cards.
200
+
201
+ ## 7. Do's and Don'ts
202
+
203
+ ### Do
204
+ - Use white as the dominant background — let product cards provide the color
205
+ - Apply pill radius (9999px) for navigation tabs and toggle buttons
206
+ - Use generous border radius (20px–24px) for product showcase cards
207
+ - Employ the purple-tinted shadow for featured/hero product cards
208
+ - Keep body text at DM Sans weight 400–500 — heavier weights for buttons only
209
+ - Use Outfit for display headings, DM Sans for everything functional
210
+ - Maintain the universal 1.50 line-height across body text
211
+ - Let colorful product illustrations/gradients serve as the primary visual interest
212
+
213
+ ### Don't
214
+ - Don't add colored backgrounds to main content sections — white is structural
215
+ - Don't use sharp corners (0–4px radius) on product cards — the rounded aesthetic is core
216
+ - Don't apply the brand pink (`#ea5ec1`) to text or buttons — it's for logo and decorative accents only
217
+ - Don't mix more than one display font per section (Outfit OR Poppins, not both)
218
+ - Don't use weight 700 for headings — 500–600 is the range, 700 is reserved for strong emphasis in body text
219
+ - Don't darken shadows beyond 0.16 opacity — the light, airy feel requires restraint
220
+ - Don't use Roboto for headings — it's the data/technical context font only
221
+
222
+ ## 8. Responsive Behavior
223
+
224
+ ### Breakpoints
225
+ | Name | Width | Key Changes |
226
+ |------|-------|-------------|
227
+ | Mobile | <768px | Single column, stacked product cards, hamburger nav |
228
+ | Tablet | 768–1024px | 2-column product grids, condensed spacing |
229
+ | Desktop | >1024px | Full horizontal card layouts, expanded spacing |
230
+
231
+ ### Collapsing Strategy
232
+ - Hero: 80px → responsive scaling to ~40px on mobile
233
+ - Product card grid: horizontal scroll → 2-column → single column stacked
234
+ - Navigation: horizontal → hamburger menu
235
+ - Footer: multi-column → stacked sections
236
+ - Spacing: 64–80px gaps → 32–40px on mobile
237
+
238
+ ## 9. Agent Prompt Guide
239
+
240
+ ### Quick Color Reference
241
+ - Background: `#ffffff` (primary), `#181e25` (dark/footer)
242
+ - Text: `#222222` (primary), `#45515e` (secondary), `#8e8e93` (muted)
243
+ - Brand Blue: `#1456f0` (brand), `#3b82f6` (primary-500), `#2563eb` (hover)
244
+ - Brand Pink: `#ea5ec1` (accent only)
245
+ - Borders: `#e5e7eb`, `#f2f3f5`
246
+
247
+ ### Example Component Prompts
248
+ - "Create a hero section on white background. Headline at 80px Outfit weight 500, line-height 1.10, near-black (#222222) text. Sub-text at 16px DM Sans weight 400, line-height 1.50, #45515e. Dark CTA button (#181e25, 8px radius, 11px 20px padding, white text)."
249
+ - "Design a product card grid: white cards with 20px border-radius, shadow rgba(44,30,116,0.16) 0px 0px 15px. Product name at 28px Outfit weight 600. Internal gradient background for the product illustration area."
250
+ - "Build navigation bar: white background, DM Sans 14px weight 500 for links, #18181b text. Pill-shaped active tab (9999px radius, rgba(0,0,0,0.05) background). MiniMax logo left-aligned."
251
+ - "Create an AI product matrix: 4-column grid of cards with 13px radius, subtle shadow rgba(0,0,0,0.08) 0px 4px 6px. Centered icon above product name in DM Sans 16px weight 500."
252
+ - "Design footer on dark (#181e25) background. Product links in DM Sans 14px, rgba(255,255,255,0.8). Multi-column layout."
253
+
254
+ ### Iteration Guide
255
+ 1. Start with white — color comes from product cards and illustrations only
256
+ 2. Pill buttons (9999px) for nav/tabs, standard radius (8px) for CTA buttons
257
+ 3. Purple-tinted shadows for featured cards, neutral shadows for everything else
258
+ 4. DM Sans handles 70% of text — Outfit is display-only, Poppins is mid-tier only
259
+ 5. Keep weights moderate (500–600 for headings) — the brand tone is confident but approachable
260
+ 6. Large radius cards (20–24px) for products, smaller radius (8–13px) for UI elements