@nurix/etna 0.19.11 → 0.19.12

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 (486) hide show
  1. package/data/harness-index.json +1 -1
  2. package/data/harnesses/code/harness.json +1 -1
  3. package/data/harnesses/code/rules/frontend.md +5 -5
  4. package/data/harnesses/code/skills/design/SKILL.md +70 -50
  5. package/data/harnesses/code/skills/design/components/charts.md +76 -0
  6. package/data/harnesses/code/skills/design/components/collections.md +132 -0
  7. package/data/harnesses/code/skills/design/components/feedback.md +47 -0
  8. package/data/harnesses/code/skills/design/components/hooks.md +35 -0
  9. package/data/harnesses/code/skills/design/components/index.md +143 -0
  10. package/data/harnesses/code/skills/design/components/inputs.md +327 -0
  11. package/data/harnesses/code/skills/design/components/layout.md +52 -0
  12. package/data/harnesses/code/skills/design/components/media.md +66 -0
  13. package/data/harnesses/code/skills/design/components/motion.md +82 -0
  14. package/data/harnesses/code/skills/design/components/navigation.md +29 -0
  15. package/data/harnesses/code/skills/design/components/overlays.md +72 -0
  16. package/data/harnesses/code/skills/design/components/setup.md +40 -0
  17. package/data/harnesses/code/skills/design/components/typography.md +46 -0
  18. package/data/harnesses/code/skills/design/components/utils.md +37 -0
  19. package/data/harnesses/code/skills/design/data/blueprints/browse.md +38 -0
  20. package/data/harnesses/code/skills/design/data/blueprints/creation-flow.md +38 -0
  21. package/data/harnesses/code/skills/design/data/blueprints/dashboard.md +38 -0
  22. package/data/harnesses/code/skills/design/data/blueprints/grid.md +38 -0
  23. package/data/harnesses/code/skills/design/data/blueprints/queue.md +38 -0
  24. package/data/harnesses/code/skills/design/data/blueprints/record-detail.md +38 -0
  25. package/data/harnesses/code/skills/design/data/blueprints/settings.md +38 -0
  26. package/data/harnesses/code/skills/design/data/chart-styling/Readme.md +33 -0
  27. package/data/harnesses/code/skills/design/data/chart-styling/carbon-accessible-alert-semantic.md +19 -0
  28. package/data/harnesses/code/skills/design/data/chart-styling/carbon-monochrome-sequential-trend.md +19 -0
  29. package/data/harnesses/code/skills/design/data/chart-styling/datadog-classic-six-aligned.md +19 -0
  30. package/data/harnesses/code/skills/design/data/chart-styling/datawrapper-tiered-gray-hierarchy.md +19 -0
  31. package/data/harnesses/code/skills/design/data/chart-styling/econ-red-rule-horizontal.md +19 -0
  32. package/data/harnesses/code/skills/design/data/chart-styling/financial-diverging-threshold-overlay.md +19 -0
  33. package/data/harnesses/code/skills/design/data/chart-styling/ft-vocabulary-ranked-muted.md +19 -0
  34. package/data/harnesses/code/skills/design/data/chart-styling/grafana-dark-threshold-bands.md +19 -0
  35. package/data/harnesses/code/skills/design/data/chart-styling/material-rounded-explicit-label.md +19 -0
  36. package/data/harnesses/code/skills/design/data/chart-styling/nyt-ghost-grid-direct-label.md +19 -0
  37. package/data/harnesses/code/skills/design/data/chart-styling/plot-currentcolor-inherit.md +19 -0
  38. package/data/harnesses/code/skills/design/data/chart-styling/saas-gradient-glow-area.md +19 -0
  39. package/data/harnesses/code/skills/design/data/chart-styling/shadcn-composable-css-vars.md +19 -0
  40. package/data/harnesses/code/skills/design/data/charts/census.csv +58 -0
  41. package/data/harnesses/code/skills/design/data/checklists/browse.md +21 -0
  42. package/data/harnesses/code/skills/design/data/checklists/creation-flow.md +20 -0
  43. package/data/harnesses/code/skills/design/data/checklists/dashboard.md +21 -0
  44. package/data/harnesses/code/skills/design/data/checklists/grid.md +21 -0
  45. package/data/harnesses/code/skills/design/data/checklists/queue.md +21 -0
  46. package/data/harnesses/code/skills/design/data/checklists/record-detail.md +21 -0
  47. package/data/harnesses/code/skills/design/data/checklists/settings.md +21 -0
  48. package/data/harnesses/code/skills/design/data/chrome/board-column.md +68 -0
  49. package/data/harnesses/code/skills/design/data/chrome/data-table.md +63 -0
  50. package/data/harnesses/code/skills/design/data/chrome/side-panel.md +60 -0
  51. package/data/harnesses/code/skills/design/data/chrome/sidebar.md +78 -0
  52. package/data/harnesses/code/skills/design/data/chrome/stat-cards.md +62 -0
  53. package/data/harnesses/code/skills/design/data/chrome/topbar.md +65 -0
  54. package/data/harnesses/code/skills/design/data/color/accent-presets.md +90 -0
  55. package/data/harnesses/code/skills/design/data/color/aesop-earth-mute.md +91 -0
  56. package/data/harnesses/code/skills/design/data/color/arc-peach-play.md +90 -0
  57. package/data/harnesses/code/skills/design/data/color/attio-hunter-teal.md +90 -0
  58. package/data/harnesses/code/skills/design/data/color/carbon-cyan-signal.md +90 -0
  59. package/data/harnesses/code/skills/design/data/color/clay-parchment.md +90 -0
  60. package/data/harnesses/code/skills/design/data/color/duolingo-feather.md +90 -0
  61. package/data/harnesses/code/skills/design/data/color/geist-mono-signal.md +90 -0
  62. package/data/harnesses/code/skills/design/data/color/linear-graphite-violet.md +90 -0
  63. package/data/harnesses/code/skills/design/data/color/mercury-onyx-cobalt.md +90 -0
  64. package/data/harnesses/code/skills/design/data/color/notion-paper-ink.md +90 -0
  65. package/data/harnesses/code/skills/design/data/color/radix-slate-iris.md +90 -0
  66. package/data/harnesses/code/skills/design/data/color/raycast-void-spectrum.md +90 -0
  67. package/data/harnesses/code/skills/design/data/color/spectrum-celery-fuchsia.md +90 -0
  68. package/data/harnesses/code/skills/design/data/color/stripe-blurple-ruby.md +90 -0
  69. package/data/harnesses/code/skills/design/data/color/superhuman-cod-picton.md +89 -0
  70. package/data/harnesses/code/skills/design/data/corpora/operations-review/companies.csv +15 -0
  71. package/data/harnesses/code/skills/design/data/corpora/operations-review/corpus.md +87 -0
  72. package/data/harnesses/code/skills/design/data/corpora/operations-review/people.csv +25 -0
  73. package/data/harnesses/code/skills/design/data/corpora/procurement-approvals/companies.csv +15 -0
  74. package/data/harnesses/code/skills/design/data/corpora/procurement-approvals/corpus.md +83 -0
  75. package/data/harnesses/code/skills/design/data/corpora/procurement-approvals/people.csv +25 -0
  76. package/data/harnesses/code/skills/design/data/corpora/revenue-analytics/companies.csv +15 -0
  77. package/data/harnesses/code/skills/design/data/corpora/revenue-analytics/corpus.md +89 -0
  78. package/data/harnesses/code/skills/design/data/corpora/revenue-analytics/people.csv +25 -0
  79. package/data/harnesses/code/skills/design/data/elevation/ant-design-directional-shadow.md +19 -0
  80. package/data/harnesses/code/skills/design/data/elevation/apple-liquid-glass-material.md +18 -0
  81. package/data/harnesses/code/skills/design/data/elevation/atlassian-surface-shadow-pairing.md +20 -0
  82. package/data/harnesses/code/skills/design/data/elevation/fluent-2-key-ambient-ramp.md +20 -0
  83. package/data/harnesses/code/skills/design/data/elevation/github-primer-sparing-shadow.md +19 -0
  84. package/data/harnesses/code/skills/design/data/elevation/ibm-carbon-layer-and-border.md +19 -0
  85. package/data/harnesses/code/skills/design/data/elevation/linear-dark-surface-ladder.md +17 -0
  86. package/data/harnesses/code/skills/design/data/elevation/material-2-key-ambient-dp-ramp.md +19 -0
  87. package/data/harnesses/code/skills/design/data/elevation/material-3-tonal-elevation.md +21 -0
  88. package/data/harnesses/code/skills/design/data/elevation/neobrutalist-hard-offset.md +19 -0
  89. package/data/harnesses/code/skills/design/data/elevation/neumorphic-soft-dual-shadow.md +18 -0
  90. package/data/harnesses/code/skills/design/data/elevation/notion-warm-minimal-hairline.md +17 -0
  91. package/data/harnesses/code/skills/design/data/elevation/polaris-elevation-inset-bevel.md +21 -0
  92. package/data/harnesses/code/skills/design/data/elevation/radix-themes-alpha-ring-scale.md +19 -0
  93. package/data/harnesses/code/skills/design/data/elevation/shadcn-neutral-derived-radius.md +19 -0
  94. package/data/harnesses/code/skills/design/data/elevation/stripe-brand-tinted-dual-shadow.md +18 -0
  95. package/data/harnesses/code/skills/design/data/elevation/tailwind-default-utility-scale.md +19 -0
  96. package/data/harnesses/code/skills/design/data/elevation/vercel-geist-shadow-as-border.md +20 -0
  97. package/data/harnesses/code/skills/design/data/gradients/amber-attention-fill.md +16 -0
  98. package/data/harnesses/code/skills/design/data/gradients/cloud-shadow-wash.md +16 -0
  99. package/data/harnesses/code/skills/design/data/gradients/confident-lavender-wash.md +16 -0
  100. package/data/harnesses/code/skills/design/data/gradients/ember-ship-flare.md +18 -0
  101. package/data/harnesses/code/skills/design/data/gradients/full-metal-wash.md +16 -0
  102. package/data/harnesses/code/skills/design/data/gradients/indigo-ruby-cta-band.md +18 -0
  103. package/data/harnesses/code/skills/design/data/gradients/linear-graphite-wash.md +18 -0
  104. package/data/harnesses/code/skills/design/data/gradients/marble-quartz-wash.md +16 -0
  105. package/data/harnesses/code/skills/design/data/gradients/midnight-aurora-panel.md +16 -0
  106. package/data/harnesses/code/skills/design/data/gradients/neutral-volume-fill.md +16 -0
  107. package/data/harnesses/code/skills/design/data/gradients/revenue-uptrend-fill.md +16 -0
  108. package/data/harnesses/code/skills/design/data/gradients/risk-decline-fill.md +16 -0
  109. package/data/harnesses/code/skills/design/data/gradients/signal-blue-develop.md +18 -0
  110. package/data/harnesses/code/skills/design/data/gradients/slate-mist-wash.md +16 -0
  111. package/data/harnesses/code/skills/design/data/gradients/stripe-atmosphere-mesh.md +18 -0
  112. package/data/harnesses/code/skills/design/data/gradients/teal-signal-accent.md +16 -0
  113. package/data/harnesses/code/skills/design/data/gradients/violet-magenta-promo.md +16 -0
  114. package/data/harnesses/code/skills/design/data/iconography.md +199 -0
  115. package/data/harnesses/code/skills/design/data/motion/accordion-expand.md +18 -0
  116. package/data/harnesses/code/skills/design/data/motion/destructive-hold-confirm.md +18 -0
  117. package/data/harnesses/code/skills/design/data/motion/drag-dismiss-momentum.md +18 -0
  118. package/data/harnesses/code/skills/design/data/motion/empty-state-arrive.md +18 -0
  119. package/data/harnesses/code/skills/design/data/motion/hover-lift.md +18 -0
  120. package/data/harnesses/code/skills/design/data/motion/modal-center-arrive.md +18 -0
  121. package/data/harnesses/code/skills/design/data/motion/number-ticker-roll.md +18 -0
  122. package/data/harnesses/code/skills/design/data/motion/onboarding-bounce.md +18 -0
  123. package/data/harnesses/code/skills/design/data/motion/panel-slide.md +18 -0
  124. package/data/harnesses/code/skills/design/data/motion/press-feedback.md +18 -0
  125. package/data/harnesses/code/skills/design/data/motion/progress-linear-loop.md +18 -0
  126. package/data/harnesses/code/skills/design/data/motion/route-crossfade.md +18 -0
  127. package/data/harnesses/code/skills/design/data/motion/rubber-band-overscroll.md +18 -0
  128. package/data/harnesses/code/skills/design/data/motion/skeleton-shimmer.md +18 -0
  129. package/data/harnesses/code/skills/design/data/motion/stagger-arrive.md +18 -0
  130. package/data/harnesses/code/skills/design/data/motion/toast-enter-stack.md +18 -0
  131. package/data/harnesses/code/skills/design/data/motion/tooltip-chain-instant.md +18 -0
  132. package/data/harnesses/code/skills/design/data/motion/trigger-anchored-reveal.md +18 -0
  133. package/data/harnesses/code/skills/design/data/tells.csv +34 -0
  134. package/data/harnesses/code/skills/design/data/typography/anton-work-sans.md +17 -0
  135. package/data/harnesses/code/skills/design/data/typography/archivo-black-archivo.md +17 -0
  136. package/data/harnesses/code/skills/design/data/typography/bitter-karla.md +17 -0
  137. package/data/harnesses/code/skills/design/data/typography/dm-serif-dm-sans.md +17 -0
  138. package/data/harnesses/code/skills/design/data/typography/fraunces-inter.md +17 -0
  139. package/data/harnesses/code/skills/design/data/typography/geist-geist-mono.md +17 -0
  140. package/data/harnesses/code/skills/design/data/typography/hubot-sans-mona-sans.md +17 -0
  141. package/data/harnesses/code/skills/design/data/typography/ibm-plex-sans-operator-single-family.md +17 -0
  142. package/data/harnesses/code/skills/design/data/typography/instrument-serif-instrument-sans.md +17 -0
  143. package/data/harnesses/code/skills/design/data/typography/inter-operator-single-family.md +17 -0
  144. package/data/harnesses/code/skills/design/data/typography/libre-baskerville-libre-franklin.md +17 -0
  145. package/data/harnesses/code/skills/design/data/typography/newsreader-inter.md +17 -0
  146. package/data/harnesses/code/skills/design/data/typography/playfair-display-source-sans.md +17 -0
  147. package/data/harnesses/code/skills/design/data/typography/public-sans-operator-single-family.md +17 -0
  148. package/data/harnesses/code/skills/design/data/typography/sohne-inter-fintech.md +17 -0
  149. package/data/harnesses/code/skills/design/data/typography/source-serif-source-sans.md +17 -0
  150. package/data/harnesses/code/skills/design/data/typography/space-grotesk-work-sans-space-mono.md +17 -0
  151. package/data/harnesses/code/skills/design/data/typography/spectral-manrope.md +17 -0
  152. package/data/harnesses/code/skills/design/data/voices/bright-collaborator.md +29 -0
  153. package/data/harnesses/code/skills/design/data/voices/direct-operator.md +29 -0
  154. package/data/harnesses/code/skills/design/data/voices/earnest-helper.md +29 -0
  155. package/data/harnesses/code/skills/design/data/voices/editorial-composed.md +29 -0
  156. package/data/harnesses/code/skills/design/data/voices/quiet-concierge.md +29 -0
  157. package/data/harnesses/code/skills/design/data/voices/warm-guide.md +29 -0
  158. package/data/harnesses/code/skills/design/design-md/SCHEMA.md +179 -0
  159. package/data/harnesses/code/skills/design/design-md/index.csv +67 -0
  160. package/data/harnesses/code/skills/design/design-md/library/airbnb.md +207 -0
  161. package/data/harnesses/code/skills/design/design-md/library/airtable.md +205 -0
  162. package/data/harnesses/code/skills/design/design-md/library/anthropic-claude.md +203 -0
  163. package/data/harnesses/code/skills/design/design-md/library/apple.md +206 -0
  164. package/data/harnesses/code/skills/design/design-md/library/binance.md +210 -0
  165. package/data/harnesses/code/skills/design/design-md/library/bmw.md +210 -0
  166. package/data/harnesses/code/skills/design/design-md/library/cal.md +209 -0
  167. package/data/harnesses/code/skills/design/design-md/library/clay.md +204 -0
  168. package/data/harnesses/code/skills/design/design-md/library/clickhouse.md +205 -0
  169. package/data/harnesses/code/skills/design/design-md/library/cohere.md +205 -0
  170. package/data/harnesses/code/skills/design/design-md/library/coinbase.md +198 -0
  171. package/data/harnesses/code/skills/design/design-md/library/composio.md +198 -0
  172. package/data/harnesses/code/skills/design/design-md/library/cursor.md +197 -0
  173. package/data/harnesses/code/skills/design/design-md/library/elevenlabs.md +199 -0
  174. package/data/harnesses/code/skills/design/design-md/library/expo.md +200 -0
  175. package/data/harnesses/code/skills/design/design-md/library/figma.md +199 -0
  176. package/data/harnesses/code/skills/design/design-md/library/framer.md +202 -0
  177. package/data/harnesses/code/skills/design/design-md/library/hashicorp.md +205 -0
  178. package/data/harnesses/code/skills/design/design-md/library/ibm.md +205 -0
  179. package/data/harnesses/code/skills/design/design-md/library/intercom.md +204 -0
  180. package/data/harnesses/code/skills/design/design-md/library/kraken.md +200 -0
  181. package/data/harnesses/code/skills/design/design-md/library/linear-app.md +198 -0
  182. package/data/harnesses/code/skills/design/design-md/library/lovable.md +199 -0
  183. package/data/harnesses/code/skills/design/design-md/library/meta.md +204 -0
  184. package/data/harnesses/code/skills/design/design-md/library/minimax.md +204 -0
  185. package/data/harnesses/code/skills/design/design-md/library/mintlify.md +210 -0
  186. package/data/harnesses/code/skills/design/design-md/library/miro.md +209 -0
  187. package/data/harnesses/code/skills/design/design-md/library/mistral-ai.md +201 -0
  188. package/data/harnesses/code/skills/design/design-md/library/mongodb.md +201 -0
  189. package/data/harnesses/code/skills/design/design-md/library/notion.md +204 -0
  190. package/data/harnesses/code/skills/design/design-md/library/nvidia.md +215 -0
  191. package/data/harnesses/code/skills/design/design-md/library/ollama.md +213 -0
  192. package/data/harnesses/code/skills/design/design-md/library/opencode-ai.md +216 -0
  193. package/data/harnesses/code/skills/design/design-md/library/posthog.md +218 -0
  194. package/data/harnesses/code/skills/design/design-md/library/raycast.md +214 -0
  195. package/data/harnesses/code/skills/design/design-md/library/replicate.md +202 -0
  196. package/data/harnesses/code/skills/design/design-md/library/resend.md +203 -0
  197. package/data/harnesses/code/skills/design/design-md/library/revolut.md +203 -0
  198. package/data/harnesses/code/skills/design/design-md/library/runwayml.md +203 -0
  199. package/data/harnesses/code/skills/design/design-md/library/sanity.md +200 -0
  200. package/data/harnesses/code/skills/design/design-md/library/sentry.md +201 -0
  201. package/data/harnesses/code/skills/design/design-md/library/shopify.md +202 -0
  202. package/data/harnesses/code/skills/design/design-md/library/slack.md +202 -0
  203. package/data/harnesses/code/skills/design/design-md/library/spacex.md +206 -0
  204. package/data/harnesses/code/skills/design/design-md/library/spotify.md +206 -0
  205. package/data/harnesses/code/skills/design/design-md/library/stripe.md +196 -0
  206. package/data/harnesses/code/skills/design/design-md/library/supabase.md +196 -0
  207. package/data/harnesses/code/skills/design/design-md/library/superhuman.md +194 -0
  208. package/data/harnesses/code/skills/design/design-md/library/tesla.md +198 -0
  209. package/data/harnesses/code/skills/design/design-md/library/theverge.md +199 -0
  210. package/data/harnesses/code/skills/design/design-md/library/together-ai.md +193 -0
  211. package/data/harnesses/code/skills/design/design-md/library/uber.md +195 -0
  212. package/data/harnesses/code/skills/design/design-md/library/vercel.md +195 -0
  213. package/data/harnesses/code/skills/design/design-md/library/voltagent.md +197 -0
  214. package/data/harnesses/code/skills/design/design-md/library/warp.md +196 -0
  215. package/data/harnesses/code/skills/design/design-md/library/webflow.md +197 -0
  216. package/data/harnesses/code/skills/design/design-md/library/wired.md +197 -0
  217. package/data/harnesses/code/skills/design/design-md/library/wise.md +198 -0
  218. package/data/harnesses/code/skills/design/design-md/library/x-ai.md +199 -0
  219. package/data/harnesses/code/skills/design/design-md/library/zapier.md +198 -0
  220. package/data/harnesses/code/skills/design/design-md/nurix.md +214 -0
  221. package/data/harnesses/code/skills/design/design-md/variants/editorial-luxury.md +184 -0
  222. package/data/harnesses/code/skills/design/design-md/variants/expressive-saas.md +216 -0
  223. package/data/harnesses/code/skills/design/design-md/variants/quiet-premium.md +211 -0
  224. package/data/harnesses/code/skills/design/design-md/variants/terse-dense-operator.md +212 -0
  225. package/data/harnesses/code/skills/design/design-md/variants/warm-approachable.md +216 -0
  226. package/data/harnesses/code/skills/design/references/compose.md +23 -0
  227. package/data/harnesses/code/skills/design/references/content.md +28 -0
  228. package/data/harnesses/code/skills/design/references/emission.md +21 -0
  229. package/data/harnesses/code/skills/design/references/existing-apps.md +27 -0
  230. package/data/harnesses/code/skills/design/references/intake.md +36 -0
  231. package/data/harnesses/code/skills/design/references/object-pass.md +24 -0
  232. package/data/harnesses/code/skills/design/references/ship-gate.md +29 -0
  233. package/data/harnesses/code/skills/design/references/ux-patterns/Readme.md +195 -0
  234. package/data/harnesses/code/skills/design/references/ux-patterns/ai-layer.md +49 -0
  235. package/data/harnesses/code/skills/design/references/ux-patterns/attributes-lifecycle.md +43 -0
  236. package/data/harnesses/code/skills/design/references/ux-patterns/container-choice.md +44 -0
  237. package/data/harnesses/code/skills/design/references/ux-patterns/creation-paths.md +46 -0
  238. package/data/harnesses/code/skills/design/references/ux-patterns/dashboards.md +42 -0
  239. package/data/harnesses/code/skills/design/references/ux-patterns/modes.md +42 -0
  240. package/data/harnesses/code/skills/design/references/ux-patterns/object-model.md +46 -0
  241. package/data/harnesses/code/skills/design/references/ux-patterns/page-archetype.md +48 -0
  242. package/data/harnesses/code/skills/design/references/ux-patterns/promotion-demotion.md +37 -0
  243. package/data/harnesses/code/skills/design/references/ux-patterns/settings.md +42 -0
  244. package/data/harnesses/code/skills/design/references/ux-patterns/standard-pages.md +46 -0
  245. package/data/harnesses/code/skills/design/references/ux-patterns/state-matrix.md +41 -0
  246. package/data/harnesses/code/skills/design/references/ux-patterns/table-mechanics.md +48 -0
  247. package/data/harnesses/code/skills/design/references/ux-patterns/verbs.md +45 -0
  248. package/data/harnesses/code/skills/design/references/ux-patterns/viewer-context.md +40 -0
  249. package/data/harnesses/code/skills/design/scripts/README-validator.md +27 -0
  250. package/data/harnesses/code/skills/design/scripts/select-chart.mjs +596 -0
  251. package/data/harnesses/code/skills/design/scripts/validate-design-md.mjs +1198 -0
  252. package/package.json +1 -1
  253. package/data/harnesses/code/skills/design/data/catalog/rules.csv +0 -137
  254. package/data/harnesses/code/skills/design/data/combinations/Readme.md +0 -33
  255. package/data/harnesses/code/skills/design/data/combinations/accent-presets.md +0 -113
  256. package/data/harnesses/code/skills/design/data/combinations/charts.csv +0 -33
  257. package/data/harnesses/code/skills/design/data/combinations/fonts-known.json +0 -448
  258. package/data/harnesses/code/skills/design/data/combinations/icons.csv +0 -157
  259. package/data/harnesses/code/skills/design/data/combinations/landing.csv +0 -38
  260. package/data/harnesses/code/skills/design/data/combinations/lucide-names.json +0 -2001
  261. package/data/harnesses/code/skills/design/data/combinations/manifest.json +0 -330
  262. package/data/harnesses/code/skills/design/data/combinations/motion.csv +0 -10
  263. package/data/harnesses/code/skills/design/data/combinations/palettes.csv +0 -92
  264. package/data/harnesses/code/skills/design/data/combinations/product-router.csv +0 -80
  265. package/data/harnesses/code/skills/design/data/combinations/styles.csv +0 -67
  266. package/data/harnesses/code/skills/design/data/combinations/typography.csv +0 -64
  267. package/data/harnesses/code/skills/design/data/design-md/SCHEMA.md +0 -106
  268. package/data/harnesses/code/skills/design/data/design-md/library/airbnb.md +0 -154
  269. package/data/harnesses/code/skills/design/data/design-md/library/airtable.md +0 -151
  270. package/data/harnesses/code/skills/design/data/design-md/library/anthropic-claude.md +0 -139
  271. package/data/harnesses/code/skills/design/data/design-md/library/apple.md +0 -139
  272. package/data/harnesses/code/skills/design/data/design-md/library/binance.md +0 -140
  273. package/data/harnesses/code/skills/design/data/design-md/library/bmw.md +0 -140
  274. package/data/harnesses/code/skills/design/data/design-md/library/cal.md +0 -140
  275. package/data/harnesses/code/skills/design/data/design-md/library/clay.md +0 -139
  276. package/data/harnesses/code/skills/design/data/design-md/library/clickhouse.md +0 -139
  277. package/data/harnesses/code/skills/design/data/design-md/library/cohere.md +0 -147
  278. package/data/harnesses/code/skills/design/data/design-md/library/coinbase.md +0 -156
  279. package/data/harnesses/code/skills/design/data/design-md/library/composio.md +0 -138
  280. package/data/harnesses/code/skills/design/data/design-md/library/cursor.md +0 -138
  281. package/data/harnesses/code/skills/design/data/design-md/library/elevenlabs.md +0 -137
  282. package/data/harnesses/code/skills/design/data/design-md/library/expo.md +0 -148
  283. package/data/harnesses/code/skills/design/data/design-md/library/figma.md +0 -141
  284. package/data/harnesses/code/skills/design/data/design-md/library/framer.md +0 -156
  285. package/data/harnesses/code/skills/design/data/design-md/library/hashicorp.md +0 -140
  286. package/data/harnesses/code/skills/design/data/design-md/library/ibm.md +0 -153
  287. package/data/harnesses/code/skills/design/data/design-md/library/intercom.md +0 -158
  288. package/data/harnesses/code/skills/design/data/design-md/library/kraken.md +0 -156
  289. package/data/harnesses/code/skills/design/data/design-md/library/linear-app.md +0 -122
  290. package/data/harnesses/code/skills/design/data/design-md/library/lovable.md +0 -140
  291. package/data/harnesses/code/skills/design/data/design-md/library/meta.md +0 -139
  292. package/data/harnesses/code/skills/design/data/design-md/library/minimax.md +0 -139
  293. package/data/harnesses/code/skills/design/data/design-md/library/mintlify.md +0 -139
  294. package/data/harnesses/code/skills/design/data/design-md/library/miro.md +0 -153
  295. package/data/harnesses/code/skills/design/data/design-md/library/mistral-ai.md +0 -140
  296. package/data/harnesses/code/skills/design/data/design-md/library/mongodb.md +0 -155
  297. package/data/harnesses/code/skills/design/data/design-md/library/notion.md +0 -140
  298. package/data/harnesses/code/skills/design/data/design-md/library/nvidia.md +0 -141
  299. package/data/harnesses/code/skills/design/data/design-md/library/ollama.md +0 -145
  300. package/data/harnesses/code/skills/design/data/design-md/library/opencode-ai.md +0 -142
  301. package/data/harnesses/code/skills/design/data/design-md/library/posthog.md +0 -152
  302. package/data/harnesses/code/skills/design/data/design-md/library/raycast.md +0 -137
  303. package/data/harnesses/code/skills/design/data/design-md/library/replicate.md +0 -140
  304. package/data/harnesses/code/skills/design/data/design-md/library/resend.md +0 -170
  305. package/data/harnesses/code/skills/design/data/design-md/library/revolut.md +0 -145
  306. package/data/harnesses/code/skills/design/data/design-md/library/runwayml.md +0 -137
  307. package/data/harnesses/code/skills/design/data/design-md/library/sanity.md +0 -168
  308. package/data/harnesses/code/skills/design/data/design-md/library/sentry.md +0 -163
  309. package/data/harnesses/code/skills/design/data/design-md/library/shopify.md +0 -147
  310. package/data/harnesses/code/skills/design/data/design-md/library/slack.md +0 -158
  311. package/data/harnesses/code/skills/design/data/design-md/library/spacex.md +0 -171
  312. package/data/harnesses/code/skills/design/data/design-md/library/spotify.md +0 -166
  313. package/data/harnesses/code/skills/design/data/design-md/library/stripe.md +0 -160
  314. package/data/harnesses/code/skills/design/data/design-md/library/supabase.md +0 -173
  315. package/data/harnesses/code/skills/design/data/design-md/library/superhuman.md +0 -145
  316. package/data/harnesses/code/skills/design/data/design-md/library/tesla.md +0 -153
  317. package/data/harnesses/code/skills/design/data/design-md/library/theverge.md +0 -167
  318. package/data/harnesses/code/skills/design/data/design-md/library/together-ai.md +0 -140
  319. package/data/harnesses/code/skills/design/data/design-md/library/uber.md +0 -140
  320. package/data/harnesses/code/skills/design/data/design-md/library/vercel.md +0 -140
  321. package/data/harnesses/code/skills/design/data/design-md/library/voltagent.md +0 -130
  322. package/data/harnesses/code/skills/design/data/design-md/library/warp.md +0 -140
  323. package/data/harnesses/code/skills/design/data/design-md/library/webflow.md +0 -140
  324. package/data/harnesses/code/skills/design/data/design-md/library/wired.md +0 -139
  325. package/data/harnesses/code/skills/design/data/design-md/library/wise.md +0 -137
  326. package/data/harnesses/code/skills/design/data/design-md/library/x-ai.md +0 -138
  327. package/data/harnesses/code/skills/design/data/design-md/library/zapier.md +0 -158
  328. package/data/harnesses/code/skills/design/data/design-md/nurix.md +0 -138
  329. package/data/harnesses/code/skills/design/data/design-tokens/SCHEMA.md +0 -695
  330. package/data/harnesses/code/skills/design/data/design-tokens/airbnb/design.resolver.json +0 -20
  331. package/data/harnesses/code/skills/design/data/design-tokens/airbnb/design.tokens.json +0 -1272
  332. package/data/harnesses/code/skills/design/data/design-tokens/airtable/design.resolver.json +0 -20
  333. package/data/harnesses/code/skills/design/data/design-tokens/airtable/design.tokens.json +0 -1268
  334. package/data/harnesses/code/skills/design/data/design-tokens/anthropic-claude/design.resolver.json +0 -20
  335. package/data/harnesses/code/skills/design/data/design-tokens/anthropic-claude/design.tokens.json +0 -1273
  336. package/data/harnesses/code/skills/design/data/design-tokens/apple/design.resolver.json +0 -20
  337. package/data/harnesses/code/skills/design/data/design-tokens/apple/design.tokens.json +0 -1262
  338. package/data/harnesses/code/skills/design/data/design-tokens/binance/design.resolver.json +0 -20
  339. package/data/harnesses/code/skills/design/data/design-tokens/binance/design.tokens.json +0 -1257
  340. package/data/harnesses/code/skills/design/data/design-tokens/bmw/design.resolver.json +0 -20
  341. package/data/harnesses/code/skills/design/data/design-tokens/bmw/design.tokens.json +0 -1270
  342. package/data/harnesses/code/skills/design/data/design-tokens/cal/design.resolver.json +0 -20
  343. package/data/harnesses/code/skills/design/data/design-tokens/cal/design.tokens.json +0 -1270
  344. package/data/harnesses/code/skills/design/data/design-tokens/clay/design.resolver.json +0 -20
  345. package/data/harnesses/code/skills/design/data/design-tokens/clay/design.tokens.json +0 -1261
  346. package/data/harnesses/code/skills/design/data/design-tokens/clickhouse/design.resolver.json +0 -20
  347. package/data/harnesses/code/skills/design/data/design-tokens/clickhouse/design.tokens.json +0 -1268
  348. package/data/harnesses/code/skills/design/data/design-tokens/cohere/design.resolver.json +0 -20
  349. package/data/harnesses/code/skills/design/data/design-tokens/cohere/design.tokens.json +0 -1281
  350. package/data/harnesses/code/skills/design/data/design-tokens/coinbase/design.resolver.json +0 -20
  351. package/data/harnesses/code/skills/design/data/design-tokens/coinbase/design.tokens.json +0 -1262
  352. package/data/harnesses/code/skills/design/data/design-tokens/composio/design.resolver.json +0 -20
  353. package/data/harnesses/code/skills/design/data/design-tokens/composio/design.tokens.json +0 -1271
  354. package/data/harnesses/code/skills/design/data/design-tokens/cursor/design.resolver.json +0 -20
  355. package/data/harnesses/code/skills/design/data/design-tokens/cursor/design.tokens.json +0 -1276
  356. package/data/harnesses/code/skills/design/data/design-tokens/elevenlabs/design.resolver.json +0 -20
  357. package/data/harnesses/code/skills/design/data/design-tokens/elevenlabs/design.tokens.json +0 -1293
  358. package/data/harnesses/code/skills/design/data/design-tokens/expo/design.resolver.json +0 -20
  359. package/data/harnesses/code/skills/design/data/design-tokens/expo/design.tokens.json +0 -1270
  360. package/data/harnesses/code/skills/design/data/design-tokens/figma/design.resolver.json +0 -20
  361. package/data/harnesses/code/skills/design/data/design-tokens/figma/design.tokens.json +0 -1276
  362. package/data/harnesses/code/skills/design/data/design-tokens/framer/design.resolver.json +0 -20
  363. package/data/harnesses/code/skills/design/data/design-tokens/framer/design.tokens.json +0 -1267
  364. package/data/harnesses/code/skills/design/data/design-tokens/goldens.json +0 -251
  365. package/data/harnesses/code/skills/design/data/design-tokens/hashicorp/design.resolver.json +0 -20
  366. package/data/harnesses/code/skills/design/data/design-tokens/hashicorp/design.tokens.json +0 -1273
  367. package/data/harnesses/code/skills/design/data/design-tokens/ibm/design.resolver.json +0 -20
  368. package/data/harnesses/code/skills/design/data/design-tokens/ibm/design.tokens.json +0 -1286
  369. package/data/harnesses/code/skills/design/data/design-tokens/intercom/design.resolver.json +0 -20
  370. package/data/harnesses/code/skills/design/data/design-tokens/intercom/design.tokens.json +0 -1290
  371. package/data/harnesses/code/skills/design/data/design-tokens/kraken/design.resolver.json +0 -20
  372. package/data/harnesses/code/skills/design/data/design-tokens/kraken/design.tokens.json +0 -1270
  373. package/data/harnesses/code/skills/design/data/design-tokens/linear-app/design.resolver.json +0 -23
  374. package/data/harnesses/code/skills/design/data/design-tokens/linear-app/design.tokens.dark.json +0 -599
  375. package/data/harnesses/code/skills/design/data/design-tokens/linear-app/design.tokens.json +0 -1272
  376. package/data/harnesses/code/skills/design/data/design-tokens/lovable/design.resolver.json +0 -20
  377. package/data/harnesses/code/skills/design/data/design-tokens/lovable/design.tokens.json +0 -1267
  378. package/data/harnesses/code/skills/design/data/design-tokens/meta/design.resolver.json +0 -20
  379. package/data/harnesses/code/skills/design/data/design-tokens/meta/design.tokens.json +0 -1289
  380. package/data/harnesses/code/skills/design/data/design-tokens/minimax/design.resolver.json +0 -20
  381. package/data/harnesses/code/skills/design/data/design-tokens/minimax/design.tokens.json +0 -1258
  382. package/data/harnesses/code/skills/design/data/design-tokens/mintlify/design.resolver.json +0 -20
  383. package/data/harnesses/code/skills/design/data/design-tokens/mintlify/design.tokens.json +0 -1284
  384. package/data/harnesses/code/skills/design/data/design-tokens/miro/design.resolver.json +0 -20
  385. package/data/harnesses/code/skills/design/data/design-tokens/miro/design.tokens.json +0 -1291
  386. package/data/harnesses/code/skills/design/data/design-tokens/mistral-ai/design.resolver.json +0 -20
  387. package/data/harnesses/code/skills/design/data/design-tokens/mistral-ai/design.tokens.json +0 -1263
  388. package/data/harnesses/code/skills/design/data/design-tokens/mongodb/design.resolver.json +0 -20
  389. package/data/harnesses/code/skills/design/data/design-tokens/mongodb/design.tokens.json +0 -1270
  390. package/data/harnesses/code/skills/design/data/design-tokens/notion/design.resolver.json +0 -20
  391. package/data/harnesses/code/skills/design/data/design-tokens/notion/design.tokens.json +0 -1261
  392. package/data/harnesses/code/skills/design/data/design-tokens/nurix/design.resolver.json +0 -20
  393. package/data/harnesses/code/skills/design/data/design-tokens/nurix/design.tokens.json +0 -1209
  394. package/data/harnesses/code/skills/design/data/design-tokens/nvidia/design.resolver.json +0 -20
  395. package/data/harnesses/code/skills/design/data/design-tokens/nvidia/design.tokens.json +0 -1265
  396. package/data/harnesses/code/skills/design/data/design-tokens/ollama/design.resolver.json +0 -20
  397. package/data/harnesses/code/skills/design/data/design-tokens/ollama/design.tokens.json +0 -1253
  398. package/data/harnesses/code/skills/design/data/design-tokens/opencode-ai/design.resolver.json +0 -20
  399. package/data/harnesses/code/skills/design/data/design-tokens/opencode-ai/design.tokens.json +0 -1268
  400. package/data/harnesses/code/skills/design/data/design-tokens/posthog/design.resolver.json +0 -20
  401. package/data/harnesses/code/skills/design/data/design-tokens/posthog/design.tokens.json +0 -1261
  402. package/data/harnesses/code/skills/design/data/design-tokens/raycast/design.resolver.json +0 -20
  403. package/data/harnesses/code/skills/design/data/design-tokens/raycast/design.tokens.json +0 -1263
  404. package/data/harnesses/code/skills/design/data/design-tokens/replicate/design.resolver.json +0 -20
  405. package/data/harnesses/code/skills/design/data/design-tokens/replicate/design.tokens.json +0 -1266
  406. package/data/harnesses/code/skills/design/data/design-tokens/resend/design.resolver.json +0 -23
  407. package/data/harnesses/code/skills/design/data/design-tokens/resend/design.tokens.dark.json +0 -623
  408. package/data/harnesses/code/skills/design/data/design-tokens/resend/design.tokens.json +0 -1276
  409. package/data/harnesses/code/skills/design/data/design-tokens/revolut/design.resolver.json +0 -20
  410. package/data/harnesses/code/skills/design/data/design-tokens/revolut/design.tokens.json +0 -1264
  411. package/data/harnesses/code/skills/design/data/design-tokens/runwayml/design.resolver.json +0 -20
  412. package/data/harnesses/code/skills/design/data/design-tokens/runwayml/design.tokens.json +0 -1268
  413. package/data/harnesses/code/skills/design/data/design-tokens/sanity/design.resolver.json +0 -20
  414. package/data/harnesses/code/skills/design/data/design-tokens/sanity/design.tokens.json +0 -1270
  415. package/data/harnesses/code/skills/design/data/design-tokens/sentry/design.resolver.json +0 -20
  416. package/data/harnesses/code/skills/design/data/design-tokens/sentry/design.tokens.json +0 -1288
  417. package/data/harnesses/code/skills/design/data/design-tokens/shopify/design.resolver.json +0 -20
  418. package/data/harnesses/code/skills/design/data/design-tokens/shopify/design.tokens.json +0 -1272
  419. package/data/harnesses/code/skills/design/data/design-tokens/slack/design.resolver.json +0 -20
  420. package/data/harnesses/code/skills/design/data/design-tokens/slack/design.tokens.json +0 -1265
  421. package/data/harnesses/code/skills/design/data/design-tokens/spacex/design.resolver.json +0 -20
  422. package/data/harnesses/code/skills/design/data/design-tokens/spacex/design.tokens.json +0 -1287
  423. package/data/harnesses/code/skills/design/data/design-tokens/spotify/design.resolver.json +0 -20
  424. package/data/harnesses/code/skills/design/data/design-tokens/spotify/design.tokens.json +0 -1286
  425. package/data/harnesses/code/skills/design/data/design-tokens/stripe/design.resolver.json +0 -20
  426. package/data/harnesses/code/skills/design/data/design-tokens/stripe/design.tokens.json +0 -1285
  427. package/data/harnesses/code/skills/design/data/design-tokens/supabase/design.resolver.json +0 -20
  428. package/data/harnesses/code/skills/design/data/design-tokens/supabase/design.tokens.json +0 -1287
  429. package/data/harnesses/code/skills/design/data/design-tokens/superhuman/design.resolver.json +0 -20
  430. package/data/harnesses/code/skills/design/data/design-tokens/superhuman/design.tokens.json +0 -1278
  431. package/data/harnesses/code/skills/design/data/design-tokens/tesla/design.resolver.json +0 -20
  432. package/data/harnesses/code/skills/design/data/design-tokens/tesla/design.tokens.json +0 -1269
  433. package/data/harnesses/code/skills/design/data/design-tokens/theverge/design.resolver.json +0 -20
  434. package/data/harnesses/code/skills/design/data/design-tokens/theverge/design.tokens.json +0 -1285
  435. package/data/harnesses/code/skills/design/data/design-tokens/together-ai/design.resolver.json +0 -20
  436. package/data/harnesses/code/skills/design/data/design-tokens/together-ai/design.tokens.json +0 -1303
  437. package/data/harnesses/code/skills/design/data/design-tokens/uber/design.resolver.json +0 -20
  438. package/data/harnesses/code/skills/design/data/design-tokens/uber/design.tokens.json +0 -1274
  439. package/data/harnesses/code/skills/design/data/design-tokens/vercel/design.resolver.json +0 -20
  440. package/data/harnesses/code/skills/design/data/design-tokens/vercel/design.tokens.json +0 -1296
  441. package/data/harnesses/code/skills/design/data/design-tokens/voltagent/design.resolver.json +0 -23
  442. package/data/harnesses/code/skills/design/data/design-tokens/voltagent/design.tokens.dark.json +0 -612
  443. package/data/harnesses/code/skills/design/data/design-tokens/voltagent/design.tokens.json +0 -1282
  444. package/data/harnesses/code/skills/design/data/design-tokens/warp/design.resolver.json +0 -20
  445. package/data/harnesses/code/skills/design/data/design-tokens/warp/design.tokens.json +0 -1287
  446. package/data/harnesses/code/skills/design/data/design-tokens/webflow/design.resolver.json +0 -20
  447. package/data/harnesses/code/skills/design/data/design-tokens/webflow/design.tokens.json +0 -1268
  448. package/data/harnesses/code/skills/design/data/design-tokens/wired/design.resolver.json +0 -20
  449. package/data/harnesses/code/skills/design/data/design-tokens/wired/design.tokens.json +0 -1276
  450. package/data/harnesses/code/skills/design/data/design-tokens/wise/design.resolver.json +0 -20
  451. package/data/harnesses/code/skills/design/data/design-tokens/wise/design.tokens.json +0 -1273
  452. package/data/harnesses/code/skills/design/data/design-tokens/x-ai/design.resolver.json +0 -20
  453. package/data/harnesses/code/skills/design/data/design-tokens/x-ai/design.tokens.json +0 -1296
  454. package/data/harnesses/code/skills/design/data/design-tokens/zapier/design.resolver.json +0 -20
  455. package/data/harnesses/code/skills/design/data/design-tokens/zapier/design.tokens.json +0 -1286
  456. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/command-center.tsx +0 -249
  457. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/create-edit.tsx +0 -249
  458. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/dashboard.tsx +0 -225
  459. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/entity-detail.tsx +0 -249
  460. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/list-detail.tsx +0 -224
  461. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/log-stream.tsx +0 -249
  462. package/data/harnesses/code/skills/design/data/operator-pack/fixtures.md +0 -88
  463. package/data/harnesses/code/skills/design/data/operator-pack/surface-catalog.md +0 -132
  464. package/data/harnesses/code/skills/design/data/operator-pack/trust-rubric.md +0 -76
  465. package/data/harnesses/code/skills/design/references/create.md +0 -173
  466. package/data/harnesses/code/skills/design/references/diagnosis.md +0 -108
  467. package/data/harnesses/code/skills/design/references/hard-rules.md +0 -177
  468. package/data/harnesses/code/skills/design/references/improve.md +0 -116
  469. package/data/harnesses/code/skills/design/references/interaction.md +0 -77
  470. package/data/harnesses/code/skills/design/references/introspect.md +0 -100
  471. package/data/harnesses/code/skills/design/references/lifecycle.md +0 -73
  472. package/data/harnesses/code/skills/design/references/personality.md +0 -575
  473. package/data/harnesses/code/skills/design/references/structure.md +0 -159
  474. package/data/harnesses/code/skills/design/scripts/convert-design-md.mjs +0 -1312
  475. package/data/harnesses/code/skills/design/scripts/derive-personality.mjs +0 -1498
  476. package/data/harnesses/code/skills/design/scripts/generate-fixtures.mjs +0 -551
  477. package/data/harnesses/code/skills/design/scripts/lib/checks.mjs +0 -1092
  478. package/data/harnesses/code/skills/design/scripts/lib/golden.mjs +0 -26
  479. package/data/harnesses/code/skills/design/scripts/lib/vocabulary.mjs +0 -65
  480. package/data/harnesses/code/skills/design/scripts/phase-gate.mjs +0 -538
  481. package/data/harnesses/code/skills/design/scripts/preship-sweep.mjs +0 -312
  482. package/data/harnesses/code/skills/design/scripts/render-rung.mjs +0 -890
  483. package/data/harnesses/code/skills/design/scripts/scaffold.mjs +0 -769
  484. package/data/harnesses/code/skills/design/scripts/self-integrity.mjs +0 -675
  485. package/data/harnesses/code/skills/design/scripts/snapshot-goldens.mjs +0 -164
  486. package/data/harnesses/code/skills/design/scripts/validate-combinations.mjs +0 -439
@@ -1,140 +0,0 @@
1
- ---
2
- schema: design-md/v1
3
- product: BMW
4
- provenance: library
5
- sourced: 2026-07-04
6
- ---
7
-
8
- # BMW — measured corporate-automotive, translated for operators
9
-
10
- The BMW corporate design (distinct from BMW M's motorsport-bombastic variant): measured, settled,
11
- engineered. A light near-white canvas, a single corporate blue for every primary action, and one
12
- categorical signature — **everything is rectangular, 0px corners** — with depth from a greyscale
13
- surface ladder and hairlines, never shadow. This operator reading keeps the palette, the blue
14
- accent, the 0px geometry, the flatness, and the heavy-display type voice; the marketing graces
15
- (dark-navy hero bands, 64px display type, full-bleed photography, the M tricolor stripe, 80px
16
- section rhythm) stay behind.
17
-
18
- ## 1 Visual Theme
19
-
20
- Light by default; dark is opt-in. Flat and categorically shadowless: hierarchy rides a greyscale surface ladder
21
- (`background` white → `card` soft-grey plate → hairline `border`) and type weight, never drop shadow. A single accent, BMW
22
- corporate blue (`primary`, brand `#1c69d4`), is reserved for the one action that matters. The geometry is the identity:
23
- `radius` 0 — buttons, inputs, cards, and chips all rectangular. The anchor surface is a white canvas beside a soft-grey
24
- `sidebar`; density is `standard`, stepping denser per archetype — dealership-functional, not cramped.
25
-
26
- ## 2 Color Roles
27
-
28
- Light values first. One accent — `primary` blue is the only chromatic hue that carries meaning; status
29
- hues speak only status. BMW reserves blue for action, so selection and hover use a faint blue wash.
30
-
31
- | Role | Value | Allowed where |
32
- | --- | --- | --- |
33
- | `background` / `popover` | white `#ffffff` (canvas) | the dominant page and overlay surface |
34
- | `card` | soft grey `#fafafa` (surface-card) | card and panel plates — lift by color-block contrast, no shadow |
35
- | `foreground` / `card-foreground` | ink `#262626` (not pure black) | all primary text |
36
- | `muted` / `secondary` | `#f7f7f7` (surface-soft) | hover rows, subtle fills, secondary buttons, footer bands |
37
- | `muted-foreground` | `#6b6b6b` | labels, captions, breadcrumbs, secondary text |
38
- | `border` / `input` | hairline `#e6e6e6` | every separator, grid line, and field edge |
39
- | `primary` | BMW blue `#1c69d4` | the one primary action; active nav; selected-tile border |
40
- | `accent` | faint blue wash `#e9f1fc` | selected / hovered rows and nav, on-accent surfaces only |
41
- | `ring` | `primary` | the focus outline — unmistakable, because keyboard-first |
42
- | `destructive` | red `#dc2626` | destructive actions and validation errors only |
43
- | `success` / `warning` | green `#22c55e` / amber `#f59e0b` | status signalling only, never chrome |
44
-
45
- The dark navy hero (`#1a2129`) and the M tricolor (`#0066b1` / `#1c69d4` / `#e22718`) are brand graces, not operator
46
- tokens — no chrome role here (see §7); the M hues resurface only as chart categoricals, the brand's only spare palette.
47
-
48
- ## 3 Typography
49
-
50
- One sans, one mono. `font-sans` is Inter — the documented open-source stand-in for the licensed BMW Type
51
- Next Latin, which runs a wide body and takes no negative tracking. `font-mono` is Roboto Mono (Roboto
52
- sits in BMW's fallback stack) for IDs, codes, timestamps, and logs. The editorial signature is a
53
- heavy/normal contrast: `font-weight-strong` 700 heads against `font-weight-normal` 400 body; numeric
54
- columns render `tabular-nums`.
55
-
56
- | Step | Role | Size · line | Weight · tracking |
57
- | --- | --- | --- | --- |
58
- | h1 | page title | 24px / 1.25 | `font-weight-strong` · `heading-tracking` (0) |
59
- | h2 | section head | 20px / 1.3 | `font-weight-strong` · 0 |
60
- | h3 | card / group head | 16px / 1.4 | `font-weight-strong` · 0 |
61
- | body | UI + prose | 14px / 1.5 | `font-weight-normal` |
62
- | small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
63
- | caption | uppercase eyebrow / inline link | 13px / 1.3 | `font-weight-strong`, `+1.5px`, uppercase |
64
-
65
- The uppercase letter-spaced label (`+1.5px`, the "LEARN MORE" machined-precision voice) is BMW's distinctive small-type
66
- carry-over. The system uses 700 / 400 only — never 500; emphasize by weight, not size.
67
-
68
- ## 4 Component Stylings
69
-
70
- Every recurring operator component composes from the primitives — no literal values, `radius` 0 everywhere.
71
-
72
- - **Button** — `primary`: filled `primary` on `primary-foreground`, `radius` (rectangular), no pill.
73
- Secondary: `background` fill, 1px `border`, `foreground`. Ghost: transparent, `accent` on hover.
74
- - **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the `ring` at
75
- full 2px, no glow (BMW thickens the field edge to ink — the `ring` carries that emphasis).
76
- - **Card** — `card` soft-grey plate distinguished by color-block contrast, optional 1px `border`,
77
- `radius`; no shadow at rest, inset by `density-inset`.
78
- - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
79
- numeric columns; row selection tints `accent`.
80
- - **Side panel** — detail and edit open beside the work in the side panel (`side-panel-width` / `side-panel-width-rich`), never over it.
81
- - **Badge / filter chip** — rectangular, hairline `border`, `muted`/status fill, uppercase caption; an
82
- active chip fills `foreground` ink with `primary-foreground` text (BMW's chip idiom); status badges
83
- take `success` / `warning` / `destructive`, never `primary`.
84
-
85
- ## 5 Layout
86
-
87
- Base spacing unit 4px through Tailwind, but BMW's native 8px rhythm shows in the on-scale ramp `4 · 8 · 12 · 16 · 24 · 32 ·
88
- 48 · 64` (the marketing 80px section rhythm stays behind). Shell dimensions map one-to-one to the layout primitives:
89
- sidebar `sidebar-width-expanded` / `sidebar-width-collapsed`, topbar `topbar-height` (BMW's 64px nav), side panel
90
- `side-panel-width` / `side-panel-width-rich`, modal cap `modal-width-max`, forms `form-max-width`, tables full-width capped
91
- at ~1440px. Density is governed globally by `density-tier` and stepped per archetype by the surface catalog.
92
-
93
- ## 6 Depth
94
-
95
- Flat, and more so than most — BMW never draws a drop shadow. Hierarchy comes from the surface ladder and hairlines:
96
-
97
- - **0 — canvas** `background` white, no border.
98
- - **1 — panel / card** `card` soft-grey plate on an optional 1px `border`; separation is color-block
99
- contrast, not shadow.
100
- - **2 — overlay** `popover` / side panel / modal — the only place `shadow-intensity` earns a whisper
101
- `sm` shadow, kept minimal because the brand is shadowless; a hairline still carries the edge.
102
-
103
- Focus is a 2px `ring` outline (never a glow), visible everywhere. Three z-levels: content, chrome, overlay.
104
-
105
- ## 7 Do's & Don'ts
106
-
107
- - **Do** reserve `primary` blue for the single most important action on a surface; everything else is
108
- neutral or status.
109
- - **Do** keep every corner rectangular — `radius` 0 on buttons, inputs, cards, and chips is the BMW
110
- signature; carry hierarchy with the greyscale surface ladder, hairlines, and weight.
111
- - **Do** set heads in `font-weight-strong` (700) against `font-weight-normal` (400) body; apply
112
- `tabular-nums` to numeric columns and `font-mono` to IDs, codes, and timestamps.
113
- - **Don't** promote a second chromatic accent — the M tricolor and dark-navy hero stay marketing-only;
114
- status uses `success` / `warning` / `destructive`.
115
- - **Don't** pill or round a control (radius stays inside `radius-scale`), signal elevation with a drop
116
- shadow, or thin dense body to the marketing Light 300 weight.
117
-
118
- ## 8 Responsive
119
-
120
- The operator sweep is 375 / 768 / 1024 / 1440.
121
-
122
- | Breakpoint | What changes |
123
- | --- | --- |
124
- | 375 | sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; density holds |
125
- | 768 | sidebar collapses to the icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
126
- | 1024 | sidebar expands; two-pane queue+detail holds side by side |
127
- | 1440 | content caps at ~1440px; forms hold `form-max-width`; tables and dashboards use the full width |
128
-
129
- ## 9 Agent Prompt Guide
130
-
131
- Directives the emitting agent follows verbatim:
132
-
133
- - Carries over: the palette (white canvas, ink text, `#1c69d4` blue), the single-accent discipline, the
134
- 0px rectangular geometry, the greyscale-ladder flatness, the heavy 700 / normal 400 type voice.
135
- - Stays behind: dark-navy hero bands, 64px display type, full-bleed photography, the M tricolor stripe,
136
- the 80px section rhythm — none belong in operator chrome.
137
- - Everything is rectangular (round only a circular icon button); accent only the primary action with
138
- blue — if two things want the accent, one is not primary; stay shadowless, reaching for the `card`
139
- grey plate and hairlines before any elevation, a whisper `sm` shadow only for a true overlay.
140
- - Numeric columns are `tabular-nums`, IDs / codes / timestamps `font-mono`, every workflow keyboard-complete with the `ring` focus outline always visible.
@@ -1,140 +0,0 @@
1
- ---
2
- schema: design-md/v1
3
- product: Cal.com
4
- provenance: library
5
- sourced: 2026-07-04
6
- ---
7
-
8
- # Cal.com — operator reading
9
-
10
- The operator reading of Cal.com's design language, distilled from Cal's marketing surface. It keeps
11
- what an internal tool can wear — the monochrome near-black action layer, the light-gray surface
12
- ladder, soft-rounded 8px/12px geometry, the Cal Sans / Inter type voice — and leaves the marketing
13
- scaffolding behind (§9).
14
-
15
- ## 1 Visual Theme
16
-
17
- Light by default; dark is opt-in. Near-monochrome: the one action that matters wears a near-black
18
- `primary` (#111111), not a chromatic accent — the system reads confidently engineered without spending
19
- color on chrome. Flat but soft: hierarchy is carried by hairline `border`, type weight, and a light-gray
20
- surface ladder, with soft drop shadows lifting only elevated cards. Geometry is soft-rounded (8px
21
- controls, 12px cards) — the friendly-modern-SaaS read. The anchor surface is a white content canvas over
22
- a faint cool-gray `sidebar`; one scarce near-black surface (#101010) frames or closes a view — the
23
- operator descendant of Cal's dark footer. Density is `spacious`: generous whitespace is the brand's
24
- signature; surfaces step denser per archetype without cramming.
25
-
26
- ## 2 Color Roles
27
-
28
- Light values (hex — the corpus's native format). The action layer is monochrome: `primary` is a
29
- near-black, the only chromatic brand color (`brand-accent` blue) is confined to inline links.
30
-
31
- | Role | Value | Allowed where |
32
- | --- | --- | --- |
33
- | `background` / `card` / `popover` | white `#ffffff` | page, cards, and overlays — the dominant surface |
34
- | `foreground` | near-black `#111111` | all primary ink and headlines |
35
- | `muted` / `secondary` | light gray `#f5f5f5` | subtle fills, hover rows, secondary buttons |
36
- | `muted-foreground` | `#6b7280` | labels, captions, secondary text |
37
- | `accent` | soft gray `#f3f4f6` | selected/active rows and nav — achromatic, no hue |
38
- | `border` / `input` | hairline `#e5e7eb` | every separator, grid line, and field edge |
39
- | `primary` | near-black `#111111` (press `#242424`) | the one primary action — monochrome, never a hue |
40
- | `ring` | ink `#111111` | the focus outline — border shifts to ink on focus |
41
- | `destructive` | red `#ef4444` | destructive actions and error state only |
42
- | `success` / `warning` | green `#10b981` / amber `#f59e0b` | status signalling only, never chrome |
43
-
44
- The `brand-accent` blue (`#3b82f6`) rides inline links only, never a CTA (§7). The badge pastels —
45
- orange, pink, violet, emerald — are the chart palette (the one place this monochrome brand spends color).
46
-
47
- ## 3 Typography
48
-
49
- One UI sans, one mono. `font-sans` is Inter — body, tables, buttons, nav, and captions all ride it. The
50
- brand's display voice is **Cal Sans** (a custom geometric face, weight 600, negative tracking), but it is
51
- licensed and unavailable publicly, so headings reproduce the voice through Inter at `font-weight-strong`
52
- with a tight negative `heading-tracking`. Hero display (48–64px) stays behind; operator headings scale to
53
- 18–24px. `font-mono` is JetBrains Mono for IDs, codes, and timestamps; numeric columns render
54
- `tabular-nums` (Inter carries `tnum`) so figures align down a column.
55
-
56
- | Step | Role | Size · line | Weight · tracking |
57
- | --- | --- | --- | --- |
58
- | h1 | page title | 24px / 1.25 | `font-weight-strong` · `heading-tracking` |
59
- | h2 | section head | 18px / 1.4 | `font-weight-strong` · `heading-tracking` |
60
- | h3 | card / group head | 15px / 1.4 | `font-weight-strong` |
61
- | body | UI + prose | 14px / 1.5 | `font-weight-normal` |
62
- | small | labels, meta, dense rows | 13px / 1.4 | `font-weight-normal` |
63
- | caption | uppercase eyebrow | 12px / 1.2 | `font-weight-strong`, `+0.02em`, uppercase |
64
-
65
- ## 4 Component Stylings
66
-
67
- Every recurring operator component composes from the primitives — no literal values.
68
-
69
- - **Button** — `primary`: filled near-black `primary` on `primary-foreground`, `radius` (8px), no pill,
70
- press darkens to `#242424`. Secondary: `background` fill, 1px `border`, `foreground`. Ghost: `muted` hover.
71
- - **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus shifts the edge to the
72
- ink `ring` at 2px, no glow.
73
- - **Card** — `card` surface, 1px `border`, `radius` steps up to 12px for content cards; soft shadow only
74
- when it lifts off the canvas (`shadow-intensity`); inset by `density-inset`.
75
- - **Table row** — height `table-row-height`; `border` grid lines; `muted` hover; `tabular-nums` on
76
- numeric columns; selection tints `accent`.
77
- - **Side panel** — detail/edit open beside the work, not over it (`side-panel-width` / `side-panel-width-rich`).
78
- - **Badge** — pill radius, `muted` or status fill, uppercase caption; status badges take `success` /
79
- `warning` / `destructive`, never `primary`.
80
-
81
- ## 5 Layout
82
-
83
- Base spacing unit 4px; the on-scale ramp is `4 · 8 · 12 · 16 · 24 · 32 · 48 · 64` (the marketing 96px
84
- section rhythm stays behind). Shell dimensions map one-to-one to the layout primitives: sidebar
85
- `sidebar-width-expanded` / `sidebar-width-collapsed`, topbar `topbar-height` (64px — Cal's airier nav
86
- band), side panel `side-panel-width` / `side-panel-width-rich`, modal cap `modal-width-max`, forms
87
- `form-max-width`, tables full-width. Density is governed globally by `density-tier` (`spacious`, Cal's
88
- generous whitespace) and stepped per archetype by the surface catalog.
89
-
90
- ## 6 Depth
91
-
92
- Soft and modern. Hierarchy comes from the surface ladder and hairlines, with soft shadow reserved for
93
- true lift — no heavy drops, no neumorphism, no glassmorphism:
94
-
95
- - **0 — canvas** `background`, no border.
96
- - **1 — card / panel** `card` on a 1px `border`; a light-gray `muted` fill distinguishes feature
97
- surfaces; soft `sm` shadow (`0 1px 2px rgba(0,0,0,0.05)`) only when it must lift off the canvas.
98
- - **2 — overlay** `popover` / side panel / modal — soft `md` shadow (`0 4px 12px rgba(0,0,0,0.08)`); the
99
- scarce near-black `#101010` surface elevates by color contrast, not a heavier shadow.
100
-
101
- Focus is an ink `ring` outline (never a glow), visible on every interactive element. Three z-levels:
102
- content, sticky chrome, overlay.
103
-
104
- ## 7 Do's & Don'ts
105
-
106
- - **Do** reserve near-black `primary` for the single most important action; keep the action layer
107
- monochrome, and carry hierarchy with hairlines, weight, whitespace, and the surface ladder before shadow.
108
- - **Do** hold display weight at 600 with the tight negative `heading-tracking` — Cal's voice reads
109
- off-brand without it; apply `tabular-nums` to numeric columns and `font-mono` to IDs, codes, timestamps.
110
- - **Don't** promote a chromatic accent to the action layer — `brand-accent` blue is inline-link-only,
111
- the badge pastels are chart-only.
112
- - **Don't** pill the primary CTA or use a card radius beyond 16px — larger reads as consumer-toy, not
113
- professional software.
114
- - **Don't** scatter the near-black surface (at most one per view, framing or closing it — a scarce
115
- signal, not a panel), or signal elevation with heavy drop shadows.
116
-
117
- ## 8 Responsive
118
-
119
- The operator sweep across breakpoints:
120
-
121
- | Breakpoint (px) | What changes |
122
- | --- | --- |
123
- | 375 | sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; density holds |
124
- | 768 | sidebar collapses to the icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
125
- | 1024 | sidebar expands; two-pane queue+detail holds side by side |
126
- | 1440 | forms cap at `form-max-width`; tables and dashboards use the full width |
127
-
128
- ## 9 Agent Prompt Guide
129
-
130
- What carries from Cal into an operator surface, and what stays on the marketing page.
131
-
132
- - Reach first for the white canvas, hairline `border`, and light-gray surface ladder — a monochrome
133
- grayscale system. Accent only the primary action, in near-black; if two things want it, one is not primary.
134
- - Keep geometry soft: 8px on controls, 12px on cards; never pill a CTA, never exceed 16px on a card.
135
- - Headings are Inter 600 with tight negative tracking (the Cal Sans voice reproduced) — never ship Cal
136
- Sans itself, never scale a heading to hero 48–64px. Numeric columns are `tabular-nums`; IDs, codes, and
137
- timestamps are JetBrains Mono.
138
- - The near-black `#101010` surface is scarce — one framing element per view, never a panel. Leave behind
139
- the hero display, the 96px band rhythm, the nav-pill switcher, product-fragment-in-card, and any
140
- gradient; charts are the only place color spends.
@@ -1,139 +0,0 @@
1
- ---
2
- schema: design-md/v1
3
- product: Clay
4
- provenance: library
5
- sourced: 2026-07-04
6
- ---
7
-
8
- # Clay — the warm-cream operator reading
9
-
10
- Clay's marketing surface is the most playful brand in the GTM-data category: a cream-tinted white
11
- canvas holding 3D claymation illustrations and saturated single-color feature cards in six hues.
12
- This is the *operator* reading — the warmth, the near-black actions, the generous radius, and the
13
- Inter body voice carried into a CRM/queue/dashboard; the hero-scale Plain Black display, the 3D
14
- illustrations, and the saturated feature-card fills stay behind in marketing. What makes a tool read
15
- as Clay is the cream substrate and the disciplined near-black action, not a colored card.
16
-
17
- ## 1 Visual Theme
18
-
19
- Light by default; warm, not cool. The canvas is a cream-tinted white (`background` — `#fffaf0`), never
20
- a gray — that faint warmth is Clay's non-negotiable differentiator from the cool-gray data-platform
21
- field. Flat: hierarchy comes from hairline `border`, warm surface steps, and type weight, never heavy
22
- shadow. A single reserved action color — near-black `primary` (`#0a0a0a`), Clay's authentic CTA —
23
- carries emphasis in the chrome. The anchor surface is the cream content canvas beside a faintly deeper
24
- cream `sidebar`. Radius is generous (`radius` 12px) to keep Clay's rounded, friendly character. Density
25
- is `spacious` — this brand breathes, and its operator tools breathe with it.
26
-
27
- ## 2 Color Roles
28
-
29
- Light values first; hex is Clay's native format. One reserved accent — near-black `primary` is the only
30
- tone the chrome uses for emphasis; the six saturated brand hues live in charts only, never in chrome.
31
-
32
- | Role | Value | Allowed where |
33
- | --- | --- | --- |
34
- | `background` / `card` / `popover` | cream white `#fffaf0` | page, cards, and overlays — the dominant warm surface |
35
- | `foreground` | ink `#0a0a0a` | all primary text, headings |
36
- | `muted` | soft cream `#faf5e8` | hover rows, subtle fills |
37
- | `muted-foreground` | mid gray `#6a6a6a` | labels, captions, secondary text |
38
- | `secondary` | cream card `#f5f0e0` | secondary buttons, quiet chips |
39
- | `border` / `input` | hairline `#e5e5e5` | every separator, grid line, and field edge |
40
- | `primary` | near-black `#0a0a0a` (hover `#1f1f1f`, disabled `#e5e5e5`) | the one primary action; active nav |
41
- | `accent` | warm cream `#ebe6d6` | selected/hovered rows and active nav, on-accent surfaces only |
42
- | `ring` | near-black `#0a0a0a` | the focus outline — unmistakable on cream, because keyboard-first |
43
- | `destructive` | red `#ef4444` | destructive actions and error state only |
44
- | `success` / `warning` | green `#22c55e` / amber `#f59e0b` | status signalling only, never chrome |
45
-
46
- The saturated palette — teal, pink, lavender, ochre, coral — is Clay's brand voltage; here it carries
47
- **data series** (`chart-1..5`), not chrome. The marketing feature cards stay behind (see §7).
48
-
49
- ## 3 Typography
50
-
51
- One sans, one mono. `font-sans` is Inter — body, UI, and headings all ride it; heading weight and a
52
- faint negative tracking, not a second family, carry the voice. Clay's display face, Plain Black, is a
53
- hero-scale marketing type (72px, -2.5px tracking) and stays behind. `font-mono` carries IDs, codes,
54
- timestamps, and log lines. Numeric columns render `tabular-nums` so figures align down a column.
55
-
56
- | Step | Role | Size · line | Weight · tracking |
57
- | --- | --- | --- | --- |
58
- | h1 | page title | 24px / 1.3 | `font-weight-strong` · `heading-tracking` |
59
- | h2 | section head | 18px / 1.4 | `font-weight-strong` · `heading-tracking` |
60
- | h3 | card / group head | 16px / 1.4 | `font-weight-strong` · `0` |
61
- | body | UI + prose | 16px / 1.55 | `font-weight-normal` |
62
- | small | labels, meta, dense table | 14px / 1.5 | `font-weight-normal` |
63
- | caption | uppercase eyebrow | 12px / 1.4 | `font-weight-strong`, `+0.1em`, uppercase |
64
-
65
- Bump weight one step for emphasis; never change size to emphasize.
66
-
67
- ## 4 Component Stylings
68
-
69
- Every recurring operator component composes from the primitives — no literal values.
70
-
71
- - **Button** — `primary`: filled near-black `primary` on `primary-foreground`, `radius` (generous),
72
- no pill; hover deepens to `#1f1f1f`. Secondary: `secondary` cream fill, 1px `border`. Ghost:
73
- transparent, `accent` on hover.
74
- - **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the near-black
75
- `ring` at 2px, no glow.
76
- - **Card** — `card` surface, 1px `border`, `radius`; shadow only when it must lift off the canvas
77
- (`shadow-intensity`); inset by `density-inset`.
78
- - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
79
- numeric columns; row selection tints `accent`.
80
- - **Side panel** — detail and edit open beside the work in `side-panel-width` (`-rich` when heavy).
81
- - **Badge** — pill (`radius-scale` 9999, Clay's brand-authentic chip shape), `muted`/status fill,
82
- uppercase caption; status badges take `success` / `warning` / `destructive`, never `primary`.
83
-
84
- ## 5 Layout
85
-
86
- Base spacing unit 4px (Clay's documented base); the on-scale ramp is `4 · 8 · 12 · 16 · 24 · 32 · 48 ·
87
- 64` (marketing's 96px section rhythm stays behind). Shell dimensions map one-to-one to the layout
88
- primitives: sidebar `sidebar-width-expanded` / `sidebar-width-collapsed`, topbar `topbar-height`, side
89
- panel `side-panel-width` / `side-panel-width-rich`, modal cap `modal-width-max`, forms `form-max-width`,
90
- tables full-width. Density is governed globally by `density-tier` (`spacious`, rewriting the spacing
91
- scale through `density-gap`) and stepped per archetype by the surface catalog.
92
-
93
- ## 6 Depth
94
-
95
- Flat. Hierarchy comes from warm surface steps and hairlines, not shadow:
96
-
97
- - **0 — canvas** `background` cream, no border.
98
- - **1 — panel / card** `card` on a 1px `border`; a step to `muted` / `secondary` cream separates
99
- nested surfaces before any shadow does.
100
- - **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a soft `md`
101
- shadow. No level stacks a heavier shadow to signal rank; rank is border, warm surface, and position.
102
-
103
- Focus is a 2px near-black `ring` outline, never a glow; three z-levels: content, chrome, overlay.
104
-
105
- ## 7 Do's & Don'ts
106
-
107
- - **Do** anchor every surface on the cream `background` (`#fffaf0`). The warm tint is the identity.
108
- - **Do** reserve near-black `primary` for the single most important action; everything else is neutral.
109
- - **Do** let the saturated palette carry data (`chart-1..5`) — that is where Clay's color belongs.
110
- - **Do** apply `tabular-nums` to every numeric column and `font-mono` to IDs, codes, and timestamps.
111
- - **Don't** cool the neutrals to gray. A gray canvas is a different brand.
112
- - **Don't** bring the saturated feature-card fills into chrome — no hot-pink button, no teal panel.
113
- - **Don't** pill the primary CTA (pill is for badges/chips) or reach past `radius-scale`.
114
- - **Don't** import Plain Black or 3D claymation into the tool — they are hero-scale marketing assets.
115
- - **Don't** signal elevation with heavy drop shadows.
116
-
117
- ## 8 Responsive
118
-
119
- The operator sweep is 375 / 768 / 1024 / 1440.
120
-
121
- | Breakpoint | What changes |
122
- | --- | --- |
123
- | 375 | sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; density holds |
124
- | 768 | sidebar collapses to the icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
125
- | 1024 | sidebar expands; two-pane queue+detail holds side by side |
126
- | 1440 | forms cap at `form-max-width`; tables and dashboards use the full width, generous cream gutters |
127
-
128
- ## 9 Agent Prompt Guide
129
-
130
- Directives the emitting agent follows verbatim:
131
-
132
- - Reach for the cream canvas first; the warm `background` is what makes the tool read as Clay.
133
- - Accent only the primary action, and the accent is near-black. If two want it, one is not primary.
134
- - Charts carry Clay's saturated palette (`chart-1..5`); chrome stays warm-neutral. Never invert this.
135
- - Keep radius generous — the rounded character is the brand; do not tighten controls to a hard edge.
136
- - Detail and edit go in the side panel; a modal is a confirmation, not a workspace.
137
- - Every numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono`.
138
- - Every workflow completes from the keyboard; the near-black `ring` focus outline is always visible.
139
- - Plain Black hero type and 3D illustrations are marketing. They never enter the operator surface.
@@ -1,139 +0,0 @@
1
- ---
2
- schema: design-md/v1
3
- product: ClickHouse
4
- provenance: library
5
- sourced: 2026-07-04
6
- ---
7
-
8
- # ClickHouse — an operator reading of the black-canvas, electric-yellow system
9
-
10
- ClickHouse's web system is the highest-contrast brand in the data-platform category: near-black canvas,
11
- one electric-yellow voltage, white confident-bold sans, real SQL in dark cards. This entry is the
12
- *operator* reading — an internal tool (query console, cluster dashboard, job queue, log stream) in
13
- ClickHouse's language. What carries: the near-black canvas, the one yellow accent held scarce, white
14
- ink on dark surfaces, flat shadowless depth from surface contrast and hairlines, the 8px-not-pill
15
- radius, and Inter's tight bold-700 voice. What stays behind: the 72/56/40px hero display, full-bleed
16
- yellow CTA bands, 56px yellow stat numbers, hero 7/5 splits, and the 96px section rhythm.
17
-
18
- **This brand is categorically dark.** ClickHouse ships no light-mode surface — the black canvas *is*
19
- the identity. White-canvas is off-brand.
20
-
21
- ## 1 Visual Theme
22
-
23
- Dark by default — the near-black `background` (`#0a0a0a`) is the floor of every surface, with no light
24
- counterpart. Emphatically flat: hierarchy comes from the surface ladder (canvas → card → elevated),
25
- hairline `border`, type weight, and white-on-black contrast — never shadow. A single accent,
26
- electric-yellow `primary` (`#faff69`), is held scarce: it wears the one primary action, the focus
27
- `ring`, and the active-nav indicator, nothing else. The neutral ramp is pure achromatic grey (white
28
- ink down through `#cccccc` to `#888888`), so the UI reads engineered and monochrome, yellow its only
29
- voltage. Density is `dense` — the brand's engineering-grade rhythm.
30
-
31
- ## 2 Color Roles
32
-
33
- Dark values. One accent — yellow `primary` is the only chromatic hue that carries meaning; status
34
- hues speak only status.
35
-
36
- | Role | Value | Allowed where |
37
- | --- | --- | --- |
38
- | `background` | near-black canvas `#0a0a0a` | page floor and content area — the dominant surface |
39
- | `foreground` | white ink `#ffffff` | headlines and primary text |
40
- | `card` / `popover` / `secondary` | dim panel `#1a1a1a` | cards, overlays, secondary-button fills — lifted off the canvas |
41
- | `muted` | recessive fill `#121212` | inset wells, disabled tracks, faint band tints |
42
- | `muted-foreground` | mid grey `#888888` | labels, captions, secondary text |
43
- | `accent` | elevated grey `#242424` | hover and selected rows and nav — a neutral lift |
44
- | `border` / `input` | hairline `#2a2a2a` | every separator, grid line, and field edge |
45
- | `primary` | electric yellow `#faff69` | the one primary action; active-nav indicator; key interactive detail |
46
- | `primary-foreground` | black `#0a0a0a` | text on the yellow action — the high-contrast brand signal |
47
- | `ring` | yellow `#faff69` | the focus outline — unmistakable, because keyboard-first |
48
- | `destructive` | red `#ef4444` | destructive actions and error state only |
49
- | `success` / `warning` | emerald `#22c55e` / amber `#f59e0b` | status signalling only, never chrome |
50
-
51
- The yellow's power is its scarcity at element level; full-bleed yellow bands and stat numbers are
52
- marketing voltage and carry no operator role (see §7).
53
-
54
- ## 3 Typography
55
-
56
- One sans, one mono. `font-sans` is Inter — body, UI, and headings all ride it; weight and tight
57
- tracking, not a second family, carry the display voice. `font-mono` is JetBrains Mono for IDs, codes,
58
- timestamps, log lines, and SQL; numeric columns render `tabular-nums`. The marketing display scale
59
- (72/56/40px) stays behind — an operator surface tops out at a 24px page title.
60
-
61
- | Step | Role | Size · line | Weight · tracking |
62
- | --- | --- | --- | --- |
63
- | h1 | page title | 24px / 1.3 | `font-weight-strong` · `heading-tracking` |
64
- | h2 | section head | 18px / 1.35 | `font-weight-strong` · `heading-tracking` |
65
- | h3 | card / group head | 15px / 1.4 | `font-weight-strong` |
66
- | body | UI + prose | 14px / 1.5 | `font-weight-normal` |
67
- | small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
68
- | caption | uppercase eyebrow | 12px / 1.4 | `font-weight-strong`, `+0.1em`, uppercase |
69
-
70
- Headings run Inter at the strong weight (700) with tight negative tracking — the brand's defining
71
- trait, preserved at operator sizes even as the display *scale* stays behind. Build hierarchy on size
72
- and weight, never a second family; bump weight for emphasis, never size.
73
-
74
- ## 4 Component Stylings
75
-
76
- Every recurring operator component composes from the primitives — no literal values.
77
-
78
- - **Button** — primary: filled yellow `primary` on black `primary-foreground`, `radius`, never a pill. Secondary: `secondary` dim-panel fill, `border`, `foreground`. Ghost: transparent, `accent` on hover.
79
- - **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the yellow `ring` at full 2px, no glow.
80
- - **Card** — `card` dim-panel surface, 1px `border`, `radius`; depth is the surface lift off the canvas, not shadow; inset by `density-inset`.
81
- - **Table row** — height `table-row-height`; `border` grid lines carry the grid; `accent` on hover; `tabular-nums` on numeric columns; selection tints `accent` with a yellow `primary` left-indicator.
82
- - **Side panel** — detail and edit open in the panel (`side-panel-width`, `side-panel-width-rich` for content-heavy), beside the work, not over it.
83
- - **Badge** — hairline `border`, `muted`/status fill, uppercase caption; status badges take `success` / `warning` / `destructive`, never `primary`. Pill radius is badges-only.
84
-
85
- ## 5 Layout
86
-
87
- Base spacing unit 4px; the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64` — the marketing
88
- 96px section rhythm stays behind. Shell dimensions map one-to-one to the layout primitives: sidebar
89
- `sidebar-width-expanded` / `sidebar-width-collapsed`, topbar `topbar-height` (64px, the brand's nav
90
- height), side panel `side-panel-width` / `side-panel-width-rich`, modal cap `modal-width-max`, forms
91
- `form-max-width`, tables full-width. Density is governed globally by `density-tier` (dense, rewriting
92
- the spacing scale through `density-gap`) and stepped per archetype by the surface catalog.
93
-
94
- ## 6 Depth
95
-
96
- Flat and shadowless. Depth comes from the surface ladder and hairlines, not drop shadows:
97
-
98
- - **0 — canvas** `background` (`#0a0a0a`), no border.
99
- - **1 — panel / card** `card` (`#1a1a1a`) on a 1px `border`; the dim-panel lift off the near-black canvas carries rank. Hover/selected lift one step to `accent` (`#242424`).
100
- - **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns the faintest lift, enough to separate an overlay from the black canvas above a scrim. Rank is surface, border, and position — never a heavier shadow.
101
-
102
- Focus is a 2px yellow `ring` outline (never a glow), visible on every interactive element. Three
103
- z-levels: content, sticky chrome, overlay.
104
-
105
- ## 7 Do's & Don'ts
106
-
107
- - **Do** anchor every surface on the near-black canvas; the yellow-on-black pairing is the brand.
108
- - **Do** reserve yellow `primary` for the primary action, the focus `ring`, and the active-nav indicator — nothing else. Its scarcity at element scale is what reads as voltage.
109
- - **Do** carry hierarchy with the surface ladder, hairlines, weight, and size — the brand is flat.
110
- - **Do** run headings Inter 700 with tight negative tracking; build hierarchy on size and weight.
111
- - **Do** apply `tabular-nums` to numeric columns and `font-mono` to IDs, codes, timestamps, and SQL.
112
- - **Don't** introduce a second brand color — ClickHouse is monochrome plus one yellow.
113
- - **Don't** fill large surfaces with yellow or set body text in yellow; the full-bleed yellow band is marketing-only.
114
- - **Don't** pill controls or reach for a radius outside `radius-scale` — the button/input radius is 8px.
115
- - **Don't** signal elevation with drop shadows, or adapt the shell to a light canvas — this brand has no light surface.
116
-
117
- ## 8 Responsive
118
-
119
- The operator sweep is 375 / 768 / 1024 / 1440.
120
-
121
- | Breakpoint | What changes |
122
- | --- | --- |
123
- | 375 | sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; density holds |
124
- | 768 | sidebar collapses to the icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
125
- | 1024 | sidebar expands; two-pane queue+detail holds side by side |
126
- | 1440 | content caps at `form-max-width` for forms; tables and dashboards use the full width |
127
-
128
- ## 9 Agent Prompt Guide
129
-
130
- Directives the emitting agent follows verbatim:
131
-
132
- - Wear the near-black canvas by default; this brand is categorically dark — no light surface to fall back to. Cards and panels are the dim-panel lift off it, not white.
133
- - Spend yellow once per surface: the primary action, the focus ring, the active-nav indicator. If two things want the yellow, one is not primary. Color otherwise belongs to data and status.
134
- - Depth is surface contrast and hairlines, never shadow; reach for the faint overlay lift only for a true modal or popover over the canvas.
135
- - Headings ride Inter 700 with tight tracking; the display scale (72/56/40px) stays behind — operator headings top out at 24px, hierarchy is size and weight.
136
- - Every numeric column is `tabular-nums`; every ID / code / timestamp / log line and SQL block is `font-mono` (JetBrains Mono). Show the real query, not an illustration of one.
137
- - Detail and edit go in the side panel beside the work; a modal is a confirmation, not a workspace.
138
- - Keyboard-first: the yellow `ring` focus outline is always visible.
139
- - Leave behind: full-bleed yellow CTA bands, 56px yellow stat numbers, hero 7/5 splits, and the 96px section rhythm — marketing voltage, not operator chrome.