@nurix/etna 0.19.10 → 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 (491) 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/data/harnesses/discussion/CLAUDE.md +1 -1
  253. package/data/harnesses/discussion/agents/discussion-baseline.md +27 -2
  254. package/data/harnesses/discussion/harness.json +2 -2
  255. package/data/harnesses/discussion/rules/artifacts.md +2 -0
  256. package/data/harnesses/discussion/rules/method.md +5 -1
  257. package/package.json +1 -1
  258. package/data/harnesses/code/skills/design/data/catalog/rules.csv +0 -137
  259. package/data/harnesses/code/skills/design/data/combinations/Readme.md +0 -33
  260. package/data/harnesses/code/skills/design/data/combinations/accent-presets.md +0 -113
  261. package/data/harnesses/code/skills/design/data/combinations/charts.csv +0 -33
  262. package/data/harnesses/code/skills/design/data/combinations/fonts-known.json +0 -448
  263. package/data/harnesses/code/skills/design/data/combinations/icons.csv +0 -157
  264. package/data/harnesses/code/skills/design/data/combinations/landing.csv +0 -38
  265. package/data/harnesses/code/skills/design/data/combinations/lucide-names.json +0 -2001
  266. package/data/harnesses/code/skills/design/data/combinations/manifest.json +0 -330
  267. package/data/harnesses/code/skills/design/data/combinations/motion.csv +0 -10
  268. package/data/harnesses/code/skills/design/data/combinations/palettes.csv +0 -92
  269. package/data/harnesses/code/skills/design/data/combinations/product-router.csv +0 -80
  270. package/data/harnesses/code/skills/design/data/combinations/styles.csv +0 -67
  271. package/data/harnesses/code/skills/design/data/combinations/typography.csv +0 -64
  272. package/data/harnesses/code/skills/design/data/design-md/SCHEMA.md +0 -106
  273. package/data/harnesses/code/skills/design/data/design-md/library/airbnb.md +0 -154
  274. package/data/harnesses/code/skills/design/data/design-md/library/airtable.md +0 -151
  275. package/data/harnesses/code/skills/design/data/design-md/library/anthropic-claude.md +0 -139
  276. package/data/harnesses/code/skills/design/data/design-md/library/apple.md +0 -139
  277. package/data/harnesses/code/skills/design/data/design-md/library/binance.md +0 -140
  278. package/data/harnesses/code/skills/design/data/design-md/library/bmw.md +0 -140
  279. package/data/harnesses/code/skills/design/data/design-md/library/cal.md +0 -140
  280. package/data/harnesses/code/skills/design/data/design-md/library/clay.md +0 -139
  281. package/data/harnesses/code/skills/design/data/design-md/library/clickhouse.md +0 -139
  282. package/data/harnesses/code/skills/design/data/design-md/library/cohere.md +0 -147
  283. package/data/harnesses/code/skills/design/data/design-md/library/coinbase.md +0 -156
  284. package/data/harnesses/code/skills/design/data/design-md/library/composio.md +0 -138
  285. package/data/harnesses/code/skills/design/data/design-md/library/cursor.md +0 -138
  286. package/data/harnesses/code/skills/design/data/design-md/library/elevenlabs.md +0 -137
  287. package/data/harnesses/code/skills/design/data/design-md/library/expo.md +0 -148
  288. package/data/harnesses/code/skills/design/data/design-md/library/figma.md +0 -141
  289. package/data/harnesses/code/skills/design/data/design-md/library/framer.md +0 -156
  290. package/data/harnesses/code/skills/design/data/design-md/library/hashicorp.md +0 -140
  291. package/data/harnesses/code/skills/design/data/design-md/library/ibm.md +0 -153
  292. package/data/harnesses/code/skills/design/data/design-md/library/intercom.md +0 -158
  293. package/data/harnesses/code/skills/design/data/design-md/library/kraken.md +0 -156
  294. package/data/harnesses/code/skills/design/data/design-md/library/linear-app.md +0 -122
  295. package/data/harnesses/code/skills/design/data/design-md/library/lovable.md +0 -140
  296. package/data/harnesses/code/skills/design/data/design-md/library/meta.md +0 -139
  297. package/data/harnesses/code/skills/design/data/design-md/library/minimax.md +0 -139
  298. package/data/harnesses/code/skills/design/data/design-md/library/mintlify.md +0 -139
  299. package/data/harnesses/code/skills/design/data/design-md/library/miro.md +0 -153
  300. package/data/harnesses/code/skills/design/data/design-md/library/mistral-ai.md +0 -140
  301. package/data/harnesses/code/skills/design/data/design-md/library/mongodb.md +0 -155
  302. package/data/harnesses/code/skills/design/data/design-md/library/notion.md +0 -140
  303. package/data/harnesses/code/skills/design/data/design-md/library/nvidia.md +0 -141
  304. package/data/harnesses/code/skills/design/data/design-md/library/ollama.md +0 -145
  305. package/data/harnesses/code/skills/design/data/design-md/library/opencode-ai.md +0 -142
  306. package/data/harnesses/code/skills/design/data/design-md/library/posthog.md +0 -152
  307. package/data/harnesses/code/skills/design/data/design-md/library/raycast.md +0 -137
  308. package/data/harnesses/code/skills/design/data/design-md/library/replicate.md +0 -140
  309. package/data/harnesses/code/skills/design/data/design-md/library/resend.md +0 -170
  310. package/data/harnesses/code/skills/design/data/design-md/library/revolut.md +0 -145
  311. package/data/harnesses/code/skills/design/data/design-md/library/runwayml.md +0 -137
  312. package/data/harnesses/code/skills/design/data/design-md/library/sanity.md +0 -168
  313. package/data/harnesses/code/skills/design/data/design-md/library/sentry.md +0 -163
  314. package/data/harnesses/code/skills/design/data/design-md/library/shopify.md +0 -147
  315. package/data/harnesses/code/skills/design/data/design-md/library/slack.md +0 -158
  316. package/data/harnesses/code/skills/design/data/design-md/library/spacex.md +0 -171
  317. package/data/harnesses/code/skills/design/data/design-md/library/spotify.md +0 -166
  318. package/data/harnesses/code/skills/design/data/design-md/library/stripe.md +0 -160
  319. package/data/harnesses/code/skills/design/data/design-md/library/supabase.md +0 -173
  320. package/data/harnesses/code/skills/design/data/design-md/library/superhuman.md +0 -145
  321. package/data/harnesses/code/skills/design/data/design-md/library/tesla.md +0 -153
  322. package/data/harnesses/code/skills/design/data/design-md/library/theverge.md +0 -167
  323. package/data/harnesses/code/skills/design/data/design-md/library/together-ai.md +0 -140
  324. package/data/harnesses/code/skills/design/data/design-md/library/uber.md +0 -140
  325. package/data/harnesses/code/skills/design/data/design-md/library/vercel.md +0 -140
  326. package/data/harnesses/code/skills/design/data/design-md/library/voltagent.md +0 -130
  327. package/data/harnesses/code/skills/design/data/design-md/library/warp.md +0 -140
  328. package/data/harnesses/code/skills/design/data/design-md/library/webflow.md +0 -140
  329. package/data/harnesses/code/skills/design/data/design-md/library/wired.md +0 -139
  330. package/data/harnesses/code/skills/design/data/design-md/library/wise.md +0 -137
  331. package/data/harnesses/code/skills/design/data/design-md/library/x-ai.md +0 -138
  332. package/data/harnesses/code/skills/design/data/design-md/library/zapier.md +0 -158
  333. package/data/harnesses/code/skills/design/data/design-md/nurix.md +0 -138
  334. package/data/harnesses/code/skills/design/data/design-tokens/SCHEMA.md +0 -695
  335. package/data/harnesses/code/skills/design/data/design-tokens/airbnb/design.resolver.json +0 -20
  336. package/data/harnesses/code/skills/design/data/design-tokens/airbnb/design.tokens.json +0 -1272
  337. package/data/harnesses/code/skills/design/data/design-tokens/airtable/design.resolver.json +0 -20
  338. package/data/harnesses/code/skills/design/data/design-tokens/airtable/design.tokens.json +0 -1268
  339. package/data/harnesses/code/skills/design/data/design-tokens/anthropic-claude/design.resolver.json +0 -20
  340. package/data/harnesses/code/skills/design/data/design-tokens/anthropic-claude/design.tokens.json +0 -1273
  341. package/data/harnesses/code/skills/design/data/design-tokens/apple/design.resolver.json +0 -20
  342. package/data/harnesses/code/skills/design/data/design-tokens/apple/design.tokens.json +0 -1262
  343. package/data/harnesses/code/skills/design/data/design-tokens/binance/design.resolver.json +0 -20
  344. package/data/harnesses/code/skills/design/data/design-tokens/binance/design.tokens.json +0 -1257
  345. package/data/harnesses/code/skills/design/data/design-tokens/bmw/design.resolver.json +0 -20
  346. package/data/harnesses/code/skills/design/data/design-tokens/bmw/design.tokens.json +0 -1270
  347. package/data/harnesses/code/skills/design/data/design-tokens/cal/design.resolver.json +0 -20
  348. package/data/harnesses/code/skills/design/data/design-tokens/cal/design.tokens.json +0 -1270
  349. package/data/harnesses/code/skills/design/data/design-tokens/clay/design.resolver.json +0 -20
  350. package/data/harnesses/code/skills/design/data/design-tokens/clay/design.tokens.json +0 -1261
  351. package/data/harnesses/code/skills/design/data/design-tokens/clickhouse/design.resolver.json +0 -20
  352. package/data/harnesses/code/skills/design/data/design-tokens/clickhouse/design.tokens.json +0 -1268
  353. package/data/harnesses/code/skills/design/data/design-tokens/cohere/design.resolver.json +0 -20
  354. package/data/harnesses/code/skills/design/data/design-tokens/cohere/design.tokens.json +0 -1281
  355. package/data/harnesses/code/skills/design/data/design-tokens/coinbase/design.resolver.json +0 -20
  356. package/data/harnesses/code/skills/design/data/design-tokens/coinbase/design.tokens.json +0 -1262
  357. package/data/harnesses/code/skills/design/data/design-tokens/composio/design.resolver.json +0 -20
  358. package/data/harnesses/code/skills/design/data/design-tokens/composio/design.tokens.json +0 -1271
  359. package/data/harnesses/code/skills/design/data/design-tokens/cursor/design.resolver.json +0 -20
  360. package/data/harnesses/code/skills/design/data/design-tokens/cursor/design.tokens.json +0 -1276
  361. package/data/harnesses/code/skills/design/data/design-tokens/elevenlabs/design.resolver.json +0 -20
  362. package/data/harnesses/code/skills/design/data/design-tokens/elevenlabs/design.tokens.json +0 -1293
  363. package/data/harnesses/code/skills/design/data/design-tokens/expo/design.resolver.json +0 -20
  364. package/data/harnesses/code/skills/design/data/design-tokens/expo/design.tokens.json +0 -1270
  365. package/data/harnesses/code/skills/design/data/design-tokens/figma/design.resolver.json +0 -20
  366. package/data/harnesses/code/skills/design/data/design-tokens/figma/design.tokens.json +0 -1276
  367. package/data/harnesses/code/skills/design/data/design-tokens/framer/design.resolver.json +0 -20
  368. package/data/harnesses/code/skills/design/data/design-tokens/framer/design.tokens.json +0 -1267
  369. package/data/harnesses/code/skills/design/data/design-tokens/goldens.json +0 -251
  370. package/data/harnesses/code/skills/design/data/design-tokens/hashicorp/design.resolver.json +0 -20
  371. package/data/harnesses/code/skills/design/data/design-tokens/hashicorp/design.tokens.json +0 -1273
  372. package/data/harnesses/code/skills/design/data/design-tokens/ibm/design.resolver.json +0 -20
  373. package/data/harnesses/code/skills/design/data/design-tokens/ibm/design.tokens.json +0 -1286
  374. package/data/harnesses/code/skills/design/data/design-tokens/intercom/design.resolver.json +0 -20
  375. package/data/harnesses/code/skills/design/data/design-tokens/intercom/design.tokens.json +0 -1290
  376. package/data/harnesses/code/skills/design/data/design-tokens/kraken/design.resolver.json +0 -20
  377. package/data/harnesses/code/skills/design/data/design-tokens/kraken/design.tokens.json +0 -1270
  378. package/data/harnesses/code/skills/design/data/design-tokens/linear-app/design.resolver.json +0 -23
  379. package/data/harnesses/code/skills/design/data/design-tokens/linear-app/design.tokens.dark.json +0 -599
  380. package/data/harnesses/code/skills/design/data/design-tokens/linear-app/design.tokens.json +0 -1272
  381. package/data/harnesses/code/skills/design/data/design-tokens/lovable/design.resolver.json +0 -20
  382. package/data/harnesses/code/skills/design/data/design-tokens/lovable/design.tokens.json +0 -1267
  383. package/data/harnesses/code/skills/design/data/design-tokens/meta/design.resolver.json +0 -20
  384. package/data/harnesses/code/skills/design/data/design-tokens/meta/design.tokens.json +0 -1289
  385. package/data/harnesses/code/skills/design/data/design-tokens/minimax/design.resolver.json +0 -20
  386. package/data/harnesses/code/skills/design/data/design-tokens/minimax/design.tokens.json +0 -1258
  387. package/data/harnesses/code/skills/design/data/design-tokens/mintlify/design.resolver.json +0 -20
  388. package/data/harnesses/code/skills/design/data/design-tokens/mintlify/design.tokens.json +0 -1284
  389. package/data/harnesses/code/skills/design/data/design-tokens/miro/design.resolver.json +0 -20
  390. package/data/harnesses/code/skills/design/data/design-tokens/miro/design.tokens.json +0 -1291
  391. package/data/harnesses/code/skills/design/data/design-tokens/mistral-ai/design.resolver.json +0 -20
  392. package/data/harnesses/code/skills/design/data/design-tokens/mistral-ai/design.tokens.json +0 -1263
  393. package/data/harnesses/code/skills/design/data/design-tokens/mongodb/design.resolver.json +0 -20
  394. package/data/harnesses/code/skills/design/data/design-tokens/mongodb/design.tokens.json +0 -1270
  395. package/data/harnesses/code/skills/design/data/design-tokens/notion/design.resolver.json +0 -20
  396. package/data/harnesses/code/skills/design/data/design-tokens/notion/design.tokens.json +0 -1261
  397. package/data/harnesses/code/skills/design/data/design-tokens/nurix/design.resolver.json +0 -20
  398. package/data/harnesses/code/skills/design/data/design-tokens/nurix/design.tokens.json +0 -1209
  399. package/data/harnesses/code/skills/design/data/design-tokens/nvidia/design.resolver.json +0 -20
  400. package/data/harnesses/code/skills/design/data/design-tokens/nvidia/design.tokens.json +0 -1265
  401. package/data/harnesses/code/skills/design/data/design-tokens/ollama/design.resolver.json +0 -20
  402. package/data/harnesses/code/skills/design/data/design-tokens/ollama/design.tokens.json +0 -1253
  403. package/data/harnesses/code/skills/design/data/design-tokens/opencode-ai/design.resolver.json +0 -20
  404. package/data/harnesses/code/skills/design/data/design-tokens/opencode-ai/design.tokens.json +0 -1268
  405. package/data/harnesses/code/skills/design/data/design-tokens/posthog/design.resolver.json +0 -20
  406. package/data/harnesses/code/skills/design/data/design-tokens/posthog/design.tokens.json +0 -1261
  407. package/data/harnesses/code/skills/design/data/design-tokens/raycast/design.resolver.json +0 -20
  408. package/data/harnesses/code/skills/design/data/design-tokens/raycast/design.tokens.json +0 -1263
  409. package/data/harnesses/code/skills/design/data/design-tokens/replicate/design.resolver.json +0 -20
  410. package/data/harnesses/code/skills/design/data/design-tokens/replicate/design.tokens.json +0 -1266
  411. package/data/harnesses/code/skills/design/data/design-tokens/resend/design.resolver.json +0 -23
  412. package/data/harnesses/code/skills/design/data/design-tokens/resend/design.tokens.dark.json +0 -623
  413. package/data/harnesses/code/skills/design/data/design-tokens/resend/design.tokens.json +0 -1276
  414. package/data/harnesses/code/skills/design/data/design-tokens/revolut/design.resolver.json +0 -20
  415. package/data/harnesses/code/skills/design/data/design-tokens/revolut/design.tokens.json +0 -1264
  416. package/data/harnesses/code/skills/design/data/design-tokens/runwayml/design.resolver.json +0 -20
  417. package/data/harnesses/code/skills/design/data/design-tokens/runwayml/design.tokens.json +0 -1268
  418. package/data/harnesses/code/skills/design/data/design-tokens/sanity/design.resolver.json +0 -20
  419. package/data/harnesses/code/skills/design/data/design-tokens/sanity/design.tokens.json +0 -1270
  420. package/data/harnesses/code/skills/design/data/design-tokens/sentry/design.resolver.json +0 -20
  421. package/data/harnesses/code/skills/design/data/design-tokens/sentry/design.tokens.json +0 -1288
  422. package/data/harnesses/code/skills/design/data/design-tokens/shopify/design.resolver.json +0 -20
  423. package/data/harnesses/code/skills/design/data/design-tokens/shopify/design.tokens.json +0 -1272
  424. package/data/harnesses/code/skills/design/data/design-tokens/slack/design.resolver.json +0 -20
  425. package/data/harnesses/code/skills/design/data/design-tokens/slack/design.tokens.json +0 -1265
  426. package/data/harnesses/code/skills/design/data/design-tokens/spacex/design.resolver.json +0 -20
  427. package/data/harnesses/code/skills/design/data/design-tokens/spacex/design.tokens.json +0 -1287
  428. package/data/harnesses/code/skills/design/data/design-tokens/spotify/design.resolver.json +0 -20
  429. package/data/harnesses/code/skills/design/data/design-tokens/spotify/design.tokens.json +0 -1286
  430. package/data/harnesses/code/skills/design/data/design-tokens/stripe/design.resolver.json +0 -20
  431. package/data/harnesses/code/skills/design/data/design-tokens/stripe/design.tokens.json +0 -1285
  432. package/data/harnesses/code/skills/design/data/design-tokens/supabase/design.resolver.json +0 -20
  433. package/data/harnesses/code/skills/design/data/design-tokens/supabase/design.tokens.json +0 -1287
  434. package/data/harnesses/code/skills/design/data/design-tokens/superhuman/design.resolver.json +0 -20
  435. package/data/harnesses/code/skills/design/data/design-tokens/superhuman/design.tokens.json +0 -1278
  436. package/data/harnesses/code/skills/design/data/design-tokens/tesla/design.resolver.json +0 -20
  437. package/data/harnesses/code/skills/design/data/design-tokens/tesla/design.tokens.json +0 -1269
  438. package/data/harnesses/code/skills/design/data/design-tokens/theverge/design.resolver.json +0 -20
  439. package/data/harnesses/code/skills/design/data/design-tokens/theverge/design.tokens.json +0 -1285
  440. package/data/harnesses/code/skills/design/data/design-tokens/together-ai/design.resolver.json +0 -20
  441. package/data/harnesses/code/skills/design/data/design-tokens/together-ai/design.tokens.json +0 -1303
  442. package/data/harnesses/code/skills/design/data/design-tokens/uber/design.resolver.json +0 -20
  443. package/data/harnesses/code/skills/design/data/design-tokens/uber/design.tokens.json +0 -1274
  444. package/data/harnesses/code/skills/design/data/design-tokens/vercel/design.resolver.json +0 -20
  445. package/data/harnesses/code/skills/design/data/design-tokens/vercel/design.tokens.json +0 -1296
  446. package/data/harnesses/code/skills/design/data/design-tokens/voltagent/design.resolver.json +0 -23
  447. package/data/harnesses/code/skills/design/data/design-tokens/voltagent/design.tokens.dark.json +0 -612
  448. package/data/harnesses/code/skills/design/data/design-tokens/voltagent/design.tokens.json +0 -1282
  449. package/data/harnesses/code/skills/design/data/design-tokens/warp/design.resolver.json +0 -20
  450. package/data/harnesses/code/skills/design/data/design-tokens/warp/design.tokens.json +0 -1287
  451. package/data/harnesses/code/skills/design/data/design-tokens/webflow/design.resolver.json +0 -20
  452. package/data/harnesses/code/skills/design/data/design-tokens/webflow/design.tokens.json +0 -1268
  453. package/data/harnesses/code/skills/design/data/design-tokens/wired/design.resolver.json +0 -20
  454. package/data/harnesses/code/skills/design/data/design-tokens/wired/design.tokens.json +0 -1276
  455. package/data/harnesses/code/skills/design/data/design-tokens/wise/design.resolver.json +0 -20
  456. package/data/harnesses/code/skills/design/data/design-tokens/wise/design.tokens.json +0 -1273
  457. package/data/harnesses/code/skills/design/data/design-tokens/x-ai/design.resolver.json +0 -20
  458. package/data/harnesses/code/skills/design/data/design-tokens/x-ai/design.tokens.json +0 -1296
  459. package/data/harnesses/code/skills/design/data/design-tokens/zapier/design.resolver.json +0 -20
  460. package/data/harnesses/code/skills/design/data/design-tokens/zapier/design.tokens.json +0 -1286
  461. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/command-center.tsx +0 -249
  462. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/create-edit.tsx +0 -249
  463. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/dashboard.tsx +0 -225
  464. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/entity-detail.tsx +0 -249
  465. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/list-detail.tsx +0 -224
  466. package/data/harnesses/code/skills/design/data/operator-pack/exemplars/log-stream.tsx +0 -249
  467. package/data/harnesses/code/skills/design/data/operator-pack/fixtures.md +0 -88
  468. package/data/harnesses/code/skills/design/data/operator-pack/surface-catalog.md +0 -132
  469. package/data/harnesses/code/skills/design/data/operator-pack/trust-rubric.md +0 -76
  470. package/data/harnesses/code/skills/design/references/create.md +0 -173
  471. package/data/harnesses/code/skills/design/references/diagnosis.md +0 -108
  472. package/data/harnesses/code/skills/design/references/hard-rules.md +0 -177
  473. package/data/harnesses/code/skills/design/references/improve.md +0 -116
  474. package/data/harnesses/code/skills/design/references/interaction.md +0 -77
  475. package/data/harnesses/code/skills/design/references/introspect.md +0 -100
  476. package/data/harnesses/code/skills/design/references/lifecycle.md +0 -73
  477. package/data/harnesses/code/skills/design/references/personality.md +0 -575
  478. package/data/harnesses/code/skills/design/references/structure.md +0 -159
  479. package/data/harnesses/code/skills/design/scripts/convert-design-md.mjs +0 -1312
  480. package/data/harnesses/code/skills/design/scripts/derive-personality.mjs +0 -1498
  481. package/data/harnesses/code/skills/design/scripts/generate-fixtures.mjs +0 -551
  482. package/data/harnesses/code/skills/design/scripts/lib/checks.mjs +0 -1092
  483. package/data/harnesses/code/skills/design/scripts/lib/golden.mjs +0 -26
  484. package/data/harnesses/code/skills/design/scripts/lib/vocabulary.mjs +0 -65
  485. package/data/harnesses/code/skills/design/scripts/phase-gate.mjs +0 -538
  486. package/data/harnesses/code/skills/design/scripts/preship-sweep.mjs +0 -312
  487. package/data/harnesses/code/skills/design/scripts/render-rung.mjs +0 -890
  488. package/data/harnesses/code/skills/design/scripts/scaffold.mjs +0 -769
  489. package/data/harnesses/code/skills/design/scripts/self-integrity.mjs +0 -675
  490. package/data/harnesses/code/skills/design/scripts/snapshot-goldens.mjs +0 -164
  491. package/data/harnesses/code/skills/design/scripts/validate-combinations.mjs +0 -439
@@ -1,151 +0,0 @@
1
- ---
2
- schema: design-md/v1
3
- product: Airtable
4
- provenance: library
5
- sourced: 2026-07-04
6
- ---
7
-
8
- # Airtable — operator reading
9
-
10
- A sober, editorial operator design: white canvas, dark-ink type, hairline separation, and a
11
- distinctive move at its center — the primary action is **near-black**, not a color. Black *is* the
12
- brand action here; blue is only the link and the focus ring. This entry is the operator reading of
13
- Airtable's marketing brand: the temperature, the ink-primary discipline, the moderate radii and the
14
- never-bold type voice carry; the hero-scale display sizes, the full-bleed signature cards, and the
15
- 96px marketing section rhythm stay behind.
16
-
17
- ## 1 Visual Theme
18
-
19
- Light by default; dark is opt-in. Flat and editorial: hierarchy is carried by hairline `border`
20
- (`#dddddd`), type weight, and whitespace — the brand is emphatically shadow-light, color-block first.
21
- A single brand action, `primary`, is near-black ink (`#181d26`, a cool navy-black) reserved for the
22
- one action that matters on a surface; it reads confident and final, never decorative. The neutral ramp
23
- is a cool near-white, and the one chromatic interactive signal is a link blue (`#1b61c9`) that appears
24
- only as links and the focus `ring`. The anchor surface is a white content canvas beside a faintly cool
25
- `sidebar`. Density is `standard` and leans editorial-roomy — calm, not cramped, and never terminal-dense.
26
-
27
- ## 2 Color Roles
28
-
29
- Light values first. One brand action — `primary` (near-black) is the only fill that means "act"; the
30
- blue is functional (links, focus) and status hues speak only status. The warm signature palette
31
- (coral, forest, cream, peach, mint, mustard) is marketing chrome — it survives here only as chart
32
- categoricals, never as UI chrome or a second accent.
33
-
34
- | Role | Value | Allowed where |
35
- | --- | --- | --- |
36
- | `background` / `card` / `popover` | white `#ffffff` | page, cards, overlays — the dominant surface |
37
- | `foreground` | near-black ink `#181d26` | all primary ink |
38
- | `muted` / `secondary` | cool near-white `#f8fafc` | hover rows, subtle fills, secondary buttons |
39
- | `muted-foreground` | mid slate `#41454d` | labels, captions, secondary text |
40
- | `border` / `input` | hairline `#dddddd` | every separator, grid line, and field edge |
41
- | `primary` | near-black `#181d26` | the one primary action; filled, white text — never the link blue |
42
- | `accent` | pale blue tint `#eef3fb` | selected/hovered rows and active nav, on-accent surfaces only |
43
- | `ring` | link blue `#1b61c9` | the focus outline — blue by brand rule, unmistakable, keyboard-first |
44
- | `destructive` | warm red `#c0301c` | destructive actions and error state only |
45
- | `success` / `warning` | green `#006400` / amber `#b45309` | status signalling only, never chrome |
46
-
47
- The blue is the link and focus color, not the brand action; the most common misread is treating
48
- link-blue as `primary`. Reserve `primary` for near-black.
49
-
50
- ## 3 Typography
51
-
52
- One sans, one mono. `font-sans` is Inter — the open substitute the licensed Haas Grotesk resolves to;
53
- the UI, body, and headings all ride it, with weight and size (never a second family) carrying the
54
- display voice. `font-mono` is IBM Plex Mono for record IDs, keys, timestamps, and log lines. Numeric
55
- columns render `tabular-nums` so figures align down a column.
56
-
57
- | Step | Role | Size · line | Weight · tracking |
58
- | --- | --- | --- | --- |
59
- | h1 | page title | 24px / 1.35 | `font-weight-strong` · `heading-tracking` |
60
- | h2 | section head | 18px / 1.4 | `font-weight-strong` · `heading-tracking` |
61
- | h3 | card / group head | 16px / 1.4 | `font-weight-strong` · `heading-tracking` |
62
- | body | UI + prose | 14px / 1.45 | `font-weight-normal` |
63
- | small | labels, meta, dense table | 13px / 1.4 | `font-weight-normal` |
64
- | caption | uppercase eyebrow | 12px / 1.2 | `font-weight-strong`, `+0.02em`, uppercase |
65
-
66
- The Airtable trait: never bold for its own sake. Emphasis bumps weight one step to `font-weight-strong`
67
- (500) — never 600/700 in the running UI. True bold is reserved, as in the brand, for legal surfaces.
68
- Bump weight to emphasize; never change size.
69
-
70
- ## 4 Component Stylings
71
-
72
- Every recurring operator component composes from the primitives — no literal values.
73
-
74
- - **Button** — `primary`: filled near-black `primary` on `primary-foreground`, `radius`, no pill.
75
- Secondary: `secondary` fill, 1px `border`, `foreground` — the white-outline pair to the near-black CTA.
76
- Ghost: transparent, `accent` on hover.
77
- - **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the blue `ring`
78
- at 2px, no glow.
79
- - **Card** — `card` surface, 1px `border`, `radius`, shadow only when lifted (`shadow-intensity`);
80
- inset by `density-inset`.
81
- - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on
82
- numeric columns; row selection tints `accent`.
83
- - **Side panel** — detail and edit open in the side panel (`side-panel-width`, `side-panel-width-rich`
84
- for content-heavy), beside the work, not over it.
85
- - **Badge** — hairline `border`, `muted`/status fill, uppercase caption; status badges take
86
- `success` / `warning` / `destructive`, never `primary`.
87
-
88
- ## 5 Layout
89
-
90
- Base spacing unit 4px; the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64` (the marketing
91
- 96px section rhythm stays behind). Shell dimensions map one-to-one to the layout primitives: sidebar
92
- `sidebar-width-expanded` (240px, the brand's filter-rail width) / `sidebar-width-collapsed`, topbar
93
- `topbar-height` (64px, the brand nav height), side panel `side-panel-width` / `side-panel-width-rich`,
94
- modal cap `modal-width-max`, forms `form-max-width`, tables full-width. Rows are a roomy 44px — the
95
- editorial reading, not a dense grid. Density is governed globally by `density-tier` and stepped per
96
- archetype by the surface catalog, never by absolute overrides.
97
-
98
- ## 6 Depth
99
-
100
- Flat — color-block first, shadow second. Hierarchy comes from the surface ladder and hairlines:
101
-
102
- - **0 — canvas** `background`, no border.
103
- - **1 — panel / card** `card` on a 1px `border`; shadow only when it must lift off the canvas.
104
- - **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a soft `md`
105
- shadow. No level stacks a heavier shadow to signal rank; rank is border and position.
106
-
107
- Focus is a 2px blue `ring` outline (never a glow), visible on every interactive element. Three
108
- z-levels: content, sticky chrome, overlay.
109
-
110
- ## 7 Do's & Don'ts
111
-
112
- - **Do** keep `primary` near-black. The brand action is `#181d26`, not the link blue — mixing them
113
- turns a confident surface into a confused one.
114
- - **Do** reserve `primary` for the single most important action on a surface; everything else is
115
- neutral or status.
116
- - **Do** carry hierarchy with hairlines, weight, and whitespace — the brand is predominantly flat.
117
- - **Do** apply `tabular-nums` to numeric columns and `font-mono` to IDs, keys, and timestamps.
118
- - **Don't** bold the UI. Emphasis tops out at `font-weight-strong` (500); 600/700 read as a template.
119
- - **Don't** promote a second chromatic accent. The signature warm palette (coral/forest/cream/mustard)
120
- is marketing chrome; here it lives only in `chart-*`.
121
- - **Don't** pill the CTA or reach for a radius outside `radius-scale`; the marketing pill is a pricing
122
- sub-system signal, not an operator option.
123
- - **Don't** open detail or edit in a modal when the side panel fits — modals are for confirmations.
124
-
125
- ## 8 Responsive
126
-
127
- The operator sweep is 375 / 768 / 1024 / 1440.
128
-
129
- | Breakpoint | What changes |
130
- | --- | --- |
131
- | 375 | sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; density holds |
132
- | 768 | sidebar collapses to the icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
133
- | 1024 | sidebar expands; two-pane list+detail holds side by side |
134
- | 1440 | forms cap at `form-max-width`; tables and dashboards use the full width, capped with outer margin |
135
-
136
- ## 9 Agent Prompt Guide
137
-
138
- Directives the emitting agent follows verbatim:
139
-
140
- - Lead every list surface with its table; lead every entity with its primary read, not its chrome.
141
- - Accent only the primary action, and make it near-black `primary` — never the blue. Blue is links and
142
- the focus `ring` only. If two things want the accent, one is not primary.
143
- - Keep type modest: `font-weight-strong` is 500, never 600/700 in the UI; emphasize by weight, not size.
144
- - Detail and edit go in the side panel; a modal is a confirmation, not a workspace.
145
- - Every numeric column is `tabular-nums`; every ID / key / timestamp is `font-mono`.
146
- - Every workflow completes from the keyboard; the blue `ring` outline is always visible.
147
- - Stay flat and editorial — hairline and whitespace before shadow. A single near-black band is the
148
- brand's one voltage moment; use it sparingly for a summary or hero card, never as routine chrome.
149
- - The warm signature palette (coral, forest, cream, peach, mint, mustard) stays behind as marketing;
150
- it survives only as chart categoricals. Hero-scale display type (48/40/32) and the 96px section
151
- rhythm are marketing — do not carry them into operator surfaces.
@@ -1,139 +0,0 @@
1
- ---
2
- schema: design-md/v1
3
- product: Claude
4
- provenance: library
5
- sourced: 2026-07-04
6
- ---
7
-
8
- # Claude — the warm editorial operator design
9
-
10
- The operator reading of Anthropic's Claude brand. Claude's own surfaces are marketing-editorial —
11
- hero-scale slab-serif display, full-bleed coral callout bands, a cream-to-dark pacing rhythm. This
12
- entry keeps what survives at operator scale: the warm cream canvas, the single coral accent, the
13
- warm-neutral temperature, the moderate radius, the editorial type voice. The 64px display, the coral
14
- bands, and the 96px rhythm stay behind. The result is unmistakably Claude — warm where every other
15
- tool is cool — but it earns its density and reserves its one accent.
16
-
17
- ## 1 Visual Theme
18
-
19
- Warm by default; dark is opt-in. The canvas is Claude's tinted cream `background` (`#faf9f5`) — a
20
- deliberate warm off-white, never the cool gray-white the category defaults to (it reads light, so the
21
- light-default floor holds — it is simply warm). Flat: hierarchy comes from warm hairline `border`,
22
- type weight, and the cream surface ladder, never heavy shadow. A single accent — Claude coral
23
- `primary` (`#cc785c`) — is reserved for the one action that matters; ink is warm near-black
24
- `foreground` (`#141413`). The type voice is editorial — a serif carries the page-title voice over a
25
- humanist sans body. Density is `standard`; the anchor surface is a cream canvas beside a softer cream `sidebar`.
26
-
27
- ## 2 Color Roles
28
-
29
- Light values. One accent: `primary` is the only chromatic hue that carries meaning; teal and amber
30
- are chart/status graces, status speaks status.
31
-
32
- | Role | Value | Allowed where |
33
- | --- | --- | --- |
34
- | `background` / `card` / `popover` | warm cream `#faf9f5` | page, cards, and overlays — the dominant surface, differentiated by border not brightness |
35
- | `foreground` | warm near-black `#141413` | all primary ink and headlines |
36
- | `muted` | soft cream `#f5f0e8` | hover rows, subtle fills, quiet panel bands |
37
- | `secondary` | cream card `#efe9de` | secondary button fill, one step darker than canvas |
38
- | `muted-foreground` | warm gray `#6c6a64` | labels, captions, secondary text |
39
- | `border` / `input` | warm hairline `#e6dfd8` | every separator, grid line, and field edge — one elevation step, not an ink line |
40
- | `primary` | Claude coral `#cc785c` | the one primary action; active nav; the coral text-link |
41
- | `accent` | strong cream `#e8e0d2` | selected/hovered rows and nav — selection warms the cream, it does not colour it |
42
- | `ring` | `primary` coral | the focus outline — unmistakable, because keyboard-first |
43
- | `destructive` | warm red `#c64545` | destructive actions and error state only |
44
- | `success` / `warning` | green `#5db872` / gold `#d4a017` | status signalling only, never chrome |
45
-
46
- The dark navy `#181715` is not a page surface here — it is the inlay for code, log, and terminal
47
- panels (see §6). Coral stays scarce; teal and amber live only in charts and status.
48
-
49
- ## 3 Typography
50
-
51
- Two families carry Claude's voice. `font-sans` is the humanist sans (Styrene B, Inter fallback) — the
52
- body, UI, table, and label workhorse. Page titles wear the editorial **serif** (Copernicus / Tiempos
53
- Headline; Cormorant Garamond at `-0.02em` the open substitute) at operator heading scale — the 64px
54
- display stays behind, but the serif voice is the brand's irreducible signature and carries. `font-mono`
55
- is JetBrains Mono for IDs, codes, timestamps, log lines; numeric columns render `tabular-nums`.
56
- Emphasis is weight 500 or a larger serif — the brand **never bolds** (serif at 400; sans to 500).
57
-
58
- | Step | Role | Family | Size · line | Weight · tracking |
59
- | --- | --- | --- | --- | --- |
60
- | h1 | page title | serif | 28px / 1.2 | 400 · `heading-tracking` |
61
- | h2 | section head | serif | 22px / 1.3 | 400 · -0.01em |
62
- | h3 | card / group head | sans | 16px / 1.4 | `font-weight-strong` · 0 |
63
- | body | UI + prose | sans | 14px / 1.55 | `font-weight-normal` |
64
- | small | labels, meta, dense table | sans | 13px / 1.4 | `font-weight-normal` |
65
- | caption | uppercase eyebrow | sans | 12px / 1.4 | `font-weight-strong`, +0.12em, uppercase |
66
- | code | IDs, logs, amounts | mono | 13px / 1.5 | `font-weight-normal` |
67
-
68
- Negative tracking on the serif is non-negotiable; it is what reads as Claude.
69
-
70
- ## 4 Component Stylings
71
-
72
- Every recurring operator component composes from the primitives — no literal values.
73
- - **Button** — `primary`: filled coral on `primary-foreground`, `radius` (8px), no pill. Secondary:
74
- `secondary` cream fill, 1px `border`, `foreground`. Ghost: transparent, `accent` on hover.
75
- - **Input** — `background` fill, 1px `border` (`border-weight`), `radius`; focus draws the coral `ring` at 2px, no glow.
76
- - **Card** — `card` surface on a 1px `border`; panels read by their hairline, not brightness (nothing sits lighter than cream but off-brand white); shadow only when lifted.
77
- - **Table row** — height `table-row-height`; `border` grid lines; `muted` on hover; `tabular-nums` on numeric columns; row selection warms to `accent`.
78
- - **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.
79
- - **Badge** — pill radius, `muted`/status fill, uppercase caption; status badges take `success` / `warning` / `destructive`, never `primary`.
80
-
81
- ## 5 Layout
82
-
83
- Base spacing unit 4px; the on-scale ramp is `2 · 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64` (the marketing
84
- 96px rhythm stays behind). Shell dimensions map one-to-one to the layout primitives: sidebar
85
- `sidebar-width-expanded` (256px) / `sidebar-width-collapsed` (56px), topbar `topbar-height` (56px),
86
- side panel `side-panel-width` (440px) / `side-panel-width-rich` (640px), modal `modal-width-max`, forms
87
- `form-max-width`, tables full-width — a hair more generous than a dense console. Density is governed
88
- globally by `density-tier` and stepped per archetype by the surface catalog.
89
-
90
- ## 6 Depth
91
-
92
- Flat, color-block-first. Hierarchy comes from the cream ladder and warm hairlines, not shadow:
93
-
94
- - **0 — canvas** `background` (`#faf9f5`), no border.
95
- - **1 — panel / card** `card` on a 1px `border`; shadow only when it must lift off the canvas.
96
- - **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a soft `md` shadow. Rank is border and position, never a heavier shadow.
97
- - **inlay — code / log / terminal** dark navy `#181715` with cream `on-dark` text and `font-mono` — Claude's product-chrome carried in even a light UI (echoes Claude Code's editor chrome).
98
-
99
- Focus is a coral `ring` outline (never a glow), visible on every interactive element. Three z-levels:
100
- content, sticky chrome, overlay.
101
-
102
- ## 7 Do's & Don'ts
103
-
104
- - **Do** anchor on the warm cream canvas — pure white reads as any-other-AI-tool; the tint is the brand.
105
- - **Do** reserve coral `primary` for the single most important action; everything else is neutral or status.
106
- - **Do** wear the editorial serif with negative tracking on page titles; keep body, tables, and labels on the humanist sans.
107
- - **Do** dress code, log, and terminal panels in the dark navy inlay (`#181715`, `font-mono`).
108
- - **Don't** bold the serif — Copernicus at 700 reads bombastic; emphasise by weight 500 or a larger size.
109
- - **Don't** promote a second chromatic accent — teal and amber are chart/status graces, not UI accents.
110
- - **Don't** pill the primary CTA (buttons are 8px `radius`); pill radius is for badges only.
111
- - **Don't** signal elevation with heavy drop shadows, or open detail in a modal when the panel fits.
112
-
113
- ## 8 Responsive
114
-
115
- The operator sweep is 375 / 768 / 1024 / 1440.
116
-
117
- | Breakpoint | What changes |
118
- | --- | --- |
119
- | 375 | sidebar → off-canvas drawer; two-pane list+detail stacks; side panel → full sheet; density holds |
120
- | 768 | sidebar collapses to the icon rail (`sidebar-width-collapsed`); tables scroll their overflow |
121
- | 1024 | sidebar expands; two-pane queue+detail holds side by side |
122
- | 1440 | forms cap at `form-max-width`; tables and dashboards use the full width; breathing widens |
123
-
124
- Code and log inlays keep mono legibility at every breakpoint by scrolling horizontally, not wrapping.
125
-
126
- ## 9 Agent Prompt Guide
127
-
128
- Directives the emitting agent follows verbatim:
129
-
130
- - Reach for the warm cream canvas first — never pure white; the warm tint is Claude.
131
- - Accent only the primary action in coral. If two things want the accent, one of them is not primary.
132
- - Page titles wear the editorial serif at reduced scale with negative tracking; everything else is the
133
- humanist sans. Never bold — emphasise by weight 500 or a larger serif.
134
- - Dress code, log, and terminal panels in the dark navy inlay (`#181715`) — show real product chrome,
135
- never a light mockup of it.
136
- - Every numeric column is `tabular-nums`; every ID / code / timestamp is `font-mono`.
137
- - Every workflow completes from the keyboard; the coral `ring` focus outline is always visible.
138
- - Stay flat — warm hairline and the cream ladder before shadow; reach past a hairline only for a real
139
- overlay. Leave behind the hero display, the coral callout bands, and the 96px rhythm.
@@ -1,139 +0,0 @@
1
- ---
2
- schema: design-md/v1
3
- product: Apple
4
- provenance: library
5
- sourced: 2026-07-04
6
- ---
7
-
8
- # Apple — the reverent, photography-first operator reading
9
-
10
- An operator translation of Apple's web design language. The marketing theatre stays behind:
11
- full-bleed product tiles, hero display type, and photography carrying the one drop-shadow in the
12
- system. What carries is the quiet chassis underneath — a parchment canvas with white cards that lift
13
- by surface change rather than shadow, near-black ink that reads photographic, a single Action Blue
14
- accent doing every "click me" job, SF Pro's tight-tracked voice, and the 17px reading pace.
15
-
16
- ## 1 Visual Theme
17
-
18
- Light by default; dark is opt-in. Flat, but not gray-flat — elevation comes from a surface ladder
19
- (parchment `background` → white `card` → near-black chrome), never from a shadow on chrome. A single
20
- accent, Action Blue `primary` (#0066cc), is the only chromatic hue that carries meaning; status hues
21
- speak only status. Ink is near-black `foreground` (#1d1d1f), chosen over pure black so the page reads
22
- photographic rather than printed. The anchor surface is a white content canvas resting on the signature
23
- Apple parchment. Density is `spacious` on purpose: Apple runs airier than contemporary SaaS, and the
24
- operator reading keeps that pace.
25
-
26
- ## 2 Color Roles
27
-
28
- Light values first. One accent — Action Blue is reserved for interactive; a second chromatic accent never appears.
29
-
30
- | Role | Value | Allowed where |
31
- | --- | --- | --- |
32
- | `background` | parchment `#f5f5f7` | the page canvas — the signature Apple off-white |
33
- | `card` / `popover` | white `#ffffff` | cards and overlays lift off parchment by surface change alone |
34
- | `foreground` | near-black ink `#1d1d1f` | all primary ink — photographic, never pure black |
35
- | `muted` | `#f0f0f0` (Apple divider-soft) | hover rows, subtle fills |
36
- | `muted-foreground` | mid gray `#6e6e73` | labels, captions, secondary text |
37
- | `border` / `input` | hairline `#e0e0e0` / control gray `#d2d2d7` | separators and card edges; fields take the firmer `input` tone |
38
- | `primary` | Action Blue `#0066cc` | the one primary action; links; active interactive detail |
39
- | `ring` | Focus Blue `#0071e3` | the 2px solid focus outline — Apple's exact ring hue |
40
- | `accent` | Action-Blue tint `#e8f1fb` | selected / hovered rows and nav on light surfaces |
41
- | `destructive` | `#d70015` | destructive actions and error state only |
42
- | `success` / `warning` | `#248a3d` / `#b25000` | status signalling only, never chrome |
43
-
44
- Sky Link Blue `#2997ff` is the dark-surface-only sibling of Action Blue: it carries links and actives on
45
- the near-black sidebar, where Action Blue would disappear. It never appears on light.
46
-
47
- ## 3 Typography
48
-
49
- One sans, one mono. `font-sans` leads with `-apple-system` / `system-ui` so it resolves to real SF Pro on
50
- Apple platforms and falls back to Inter elsewhere (the corpus's own substitution). Hero display sizes
51
- (56 / 40px) stay behind; the operator ramp keeps SF Pro's voice — negative tracking, the 17px body — at
52
- working sizes. `font-mono` is SF Mono for IDs, codes, and timestamps; numeric columns render `tabular-nums`.
53
-
54
- | Step | Role | Size · line | Weight · tracking |
55
- | --- | --- | --- | --- |
56
- | h1 | page title | 28px / 1.14 | `font-weight-strong` · `heading-tracking` |
57
- | h2 | section head | 21px / 1.2 | `font-weight-strong` · `heading-tracking` |
58
- | h3 | card / group head | 17px / 1.24 | `font-weight-strong` · `heading-tracking` |
59
- | body | UI + prose | 17px / 1.47 | `font-weight-normal` |
60
- | small | labels, meta, dense table | 14px / 1.43 | `font-weight-normal` |
61
- | caption | eyebrow / nav | 12px / 1.3 | `font-weight-normal` · `-0.01em` |
62
-
63
- The weight ladder is 300 / 400 / 600 / 700 — **500 is deliberately absent**; headings sit at 600, not
64
- 700. Body runs at 17px, not 16px: the extra pixel is the brand's reading pace. Emphasise by weight, never size.
65
-
66
- ## 4 Component Stylings
67
-
68
- Every recurring operator component composes from the primitives — no literal values.
69
-
70
- - **Button** — `primary`: filled Action Blue on `primary-foreground`, `radius` (soft rect), no pill by
71
- default; press is `transform: scale(0.95)`. Secondary: `secondary` fill, `border`. Ghost: `muted` on hover.
72
- - **Input** — `background` fill, 1px `border` (`input` tone), `radius`; focus draws the `ring` as a full
73
- 2px solid outline, no glow.
74
- - **Card** — white `card` on the parchment `background`, 1px `border` hairline, `radius`; elevation is the
75
- surface change, not a shadow. Inset by `density-inset`.
76
- - **Table row** — `table-row-height`; hairline `border` grid lines; `muted` on hover; selection tints
77
- `accent`; `tabular-nums` on numeric columns.
78
- - **Side panel** — detail and edit open in the side panel (`side-panel-width`, `side-panel-width-rich`),
79
- beside the work, never over it.
80
- - **Badge** — hairline `border`, `muted` / status fill, uppercase caption; status badges take
81
- `success` / `warning` / `destructive`, never `primary`.
82
-
83
- ## 5 Layout
84
-
85
- Base spacing unit 8px (Apple's grid); the on-scale ramp is `4 · 8 · 12 · 17 · 24 · 32 · 48 · 80` — note
86
- the signature 17px step and the generous 80px section rhythm. Shell dimensions map one-to-one to the
87
- layout primitives: sidebar `sidebar-width-expanded` / `sidebar-width-collapsed`, topbar `topbar-height`,
88
- side panel `side-panel-width` / `side-panel-width-rich`, modal `modal-width-max`, forms `form-max-width`,
89
- tables full-width. Density is `spacious`, governed globally by `density-tier` and stepped per archetype.
90
-
91
- ## 6 Depth
92
-
93
- Flat. Hierarchy comes from the surface ladder and hairlines, not shadow:
94
-
95
- - **0 — canvas** parchment `background`, no border.
96
- - **1 — panel / card** white `card` lifting off parchment by surface change alone; 1px `border` hairline.
97
- - **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns the faintest `md` lift, or a backdrop-blur floats sticky chrome.
98
-
99
- Apple puts **exactly one** shadow in its whole system, and it belongs to product photography — never a
100
- card, button, or text. Operator chrome has no imagery, so it carries zero shadow; only true overlays lift.
101
- Focus is a 2px solid `ring` outline (Focus Blue), never a glow. Three z-levels: content, chrome, overlay.
102
-
103
- ## 7 Do's & Don'ts
104
-
105
- - **Do** reserve Action Blue (`primary`) for the single most important action and every link; the one
106
- accent is non-negotiable.
107
- - **Do** elevate by surface change — parchment ↔ white ↔ near-black — before a shadow; the color change is the divider.
108
- - **Do** keep ink near-black (`foreground` #1d1d1f), never pure black text.
109
- - **Do** run body at 17px, `tabular-nums` on numeric columns, `font-mono` on IDs / codes / timestamps.
110
- - **Do** use `transform: scale(0.95)` as the press state, system-wide.
111
- - **Don't** introduce a second chromatic accent; every "click me" signal is Action Blue.
112
- - **Don't** put a shadow on a card, button, or text — shadow is reserved for imagery this UI does not have.
113
- - **Don't** use weight 500; the ladder is 300 / 400 / 600 / 700, and headings are 600, not 700.
114
- - **Don't** pill every control — the full pill is a marketing-hero signal; operator controls take the soft
115
- `radius` rect, the pill (`9999`) reserved for at most one hero action.
116
- - **Don't** use Sky Link Blue (#2997ff) on a light surface — it is the dark-surface-only variant.
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; h1 steps 28 → 24 |
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 | forms cap at `form-max-width`; tables and dashboards use the full width |
128
-
129
- ## 9 Agent Prompt Guide
130
-
131
- - **Carries:** the parchment `background` + white `card` surface ladder; near-black ink; the single
132
- Action Blue accent; SF Pro's voice (via `-apple-system` → Inter fallback) with tight tracking; the 17px
133
- reading pace; soft radii; surface-change elevation; the `scale(0.95)` press.
134
- - **Stays behind:** hero display type (56 / 40px); full-bleed marketing tiles; product photography and
135
- its lone drop-shadow; the pill-everything CTA grammar; the museum-gallery whitespace.
136
- - Lead every surface with its content — the table on a list, the primary read on an entity — not chrome.
137
- - Accent only the primary action; if two things want Action Blue, one of them is not primary.
138
- - Keep the sidebar recessive and near-black, with Sky Link Blue actives; the light canvas does the talking.
139
- - Every workflow completes from the keyboard; the 2px Focus Blue `ring` is always visible.
@@ -1,140 +0,0 @@
1
- ---
2
- schema: design-md/v1
3
- product: Binance
4
- provenance: library
5
- sourced: 2026-07-04
6
- ---
7
-
8
- # Binance — the operator reading
9
-
10
- A confident financial-platform look reduced to one idea: a single electric accent doing all the
11
- brand voltage against a calm neutral field. This entry is a deliberate operator reading of Binance —
12
- the trading-terminal density and the black-on-yellow signature carried onto internal tools (a
13
- markets console, a queue, a settlement dashboard), with the marketing skin left behind.
14
-
15
- ## 1 Visual Theme
16
-
17
- One accent. Yellow `primary` (#FCD535) carries every primary action and nothing else — its scarcity
18
- is the brand. Binance ships two native themes and picks by surface intent. **Light is the default
19
- here** — the transactional surface Binance wears on forms, buy/deposit dialogs, and conversion tables:
20
- white `background`, ink type, gray-blue hairlines. **Dark is the more iconic read** — a near-black
21
- trading console (`canvas-dark` #0B0E11, never pure black) where `card` steps carry elevation. Depth is
22
- flat throughout: color-block contrast and 1px hairlines, never heavy shadow. Density is `dense` — this
23
- reads like a markets terminal, not a consumer app. Reach for dark on a markets/dashboard/trading
24
- surface, light for forms and CRM; the black-on-yellow button is identical in both.
25
-
26
- ## 2 Color Roles
27
-
28
- One accent — `primary` is the only chromatic hue that carries brand meaning; trading green/red and
29
- info-blue speak status and direction only. Turquoise #2DBDB6 was a single-product experiment, not a
30
- system color, and survives here only as a chart hue. Light values first; the dark-console value is
31
- noted where it defines the identity.
32
-
33
- | Role | Value | Allowed where |
34
- | --- | --- | --- |
35
- | `primary` | yellow #FCD535 (press #F0B90B, disabled #3A3A1F) | the one primary action, active nav, the wordmark — nowhere else |
36
- | `primary-foreground` | black #181A20 | text/icon on the yellow fill — never white on yellow |
37
- | `background` / `card` / `popover` | white #FFFFFF (dark: #0B0E11 canvas, #1E2329 card) | page, cards, overlays |
38
- | `foreground` | ink #181A20 (dark: #EAECEF) | primary text — the dark body is a deliberate cool gray, not pure white |
39
- | `muted` | #FAFAFA (dark: #1E2329) | subtle fills, hover rows |
40
- | `muted-foreground` | slate #707A8A (#929AA5 emphasized) | captions, column headers, breadcrumbs — reads on both themes |
41
- | `border` / `input` | gray-blue #EAECEF (dark: #2B3139) | every hairline, grid line, field edge — the highest-frequency token |
42
- | `accent` | #F5F5F5 (dark: #2B3139) | selected/hovered rows and nav — a neutral tint, never a yellow wash |
43
- | `ring` | info blue #3B82F6 | the focus outline |
44
- | `success` | trading green #0ECB81 | up-moves and success status |
45
- | `destructive` | trading red #F6465D on white text | down-moves, destructive actions, error state |
46
- | `warning` | amber #D97706 | caution — deliberately not brand-yellow |
47
-
48
- ## 3 Typography
49
-
50
- Two families, split by function. `font-sans` is BinanceNova (Inter is the corpus-named substitute) —
51
- UI, body, headings. `font-mono` is BinancePlex (JetBrains Mono substitute) — the "trustworthy number"
52
- voice for prices, volumes, IDs, timestamps, and every numeric column; a sans price ticker loses the
53
- trading-platform character. Numeric columns render `tabular-nums`. Strong weight runs 600 (a step
54
- heavier than typical marketing, so figures read at a glance); the 64/48px hero display and its 700
55
- weight stay behind.
56
-
57
- | Step | Role | Size · line | Weight · tracking |
58
- | --- | --- | --- | --- |
59
- | h1 | page title | 24px / 1.3 | `font-weight-strong` · `heading-tracking` |
60
- | h2 | section head | 20px / 1.35 | `font-weight-strong` |
61
- | h3 | card / group head | 16px / 1.4 | `font-weight-strong` |
62
- | body | UI + prose | 14px / 1.5 | `font-weight-normal` |
63
- | small | labels, dense table | 13px / 1.5 | `font-weight-normal` |
64
- | caption | uppercase eyebrow | 12px / 1.4 | `font-weight-strong` |
65
- | number | table figures | 16px / 1.4 · 500 | `font-mono` (13-14px in dense rows) |
66
-
67
- ## 4 Component Stylings
68
-
69
- - **Button** — `primary`: filled `primary` on `primary-foreground` (black on yellow), `radius`, no
70
- pill; press darkens to the active yellow. Secondary: `secondary` fill, 1px `border`, `foreground`.
71
- - **Input / Card** — `background` / `card` fill, 1px `border` (`border-weight`), `radius` (cards one
72
- step up from control radius); input focus draws the `ring` at 2px, no glow; cards shadow only when
73
- lifted off imagery.
74
- - **Table row** — `table-row-height`; `border` grid lines; `muted` on hover; `accent` on selection;
75
- `tabular-nums` + `font-mono` on price/amount cells; direction cells take `success` / `destructive`
76
- as text color, never a fill.
77
- - **Side panel** — detail and edit open in the side panel (`side-panel-width`,
78
- `side-panel-width-rich`), beside the work, not over it.
79
- - **Badge** — hairline `border`, `muted` / status fill, uppercase caption; status badges take
80
- `success` / `warning` / `destructive`, never `primary`.
81
-
82
- ## 5 Layout
83
-
84
- Base unit 4px; the on-scale ramp is `4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 · 80` (80px is a marketing
85
- band — operator surfaces pack tighter). Shell dimensions map one-to-one to the layout primitives: top
86
- bar `topbar-height` (64px, Binance's native nav height), sidebar `sidebar-width-expanded` /
87
- `sidebar-width-collapsed`, side panel `side-panel-width` / `side-panel-width-rich`, modal cap
88
- `modal-width-max`, forms `form-max-width`, tables full-width. Density is governed globally by
89
- `density-tier` and stepped per archetype — never by absolute overrides.
90
-
91
- ## 6 Depth
92
-
93
- Flat, by conviction. Hierarchy comes from the surface ladder and hairlines, not shadow:
94
-
95
- - **0 — canvas** `background`, no border.
96
- - **1 — panel / card** `card` on a 1px `border`; on dark, the `card` step off `canvas-dark` is a clear
97
- ~12-step lightness jump that reads as elevation with no shadow at all.
98
- - **2 — overlay** `popover` / side panel / modal — the one place `shadow-intensity` earns a single
99
- soft `sm` shadow.
100
-
101
- Focus is a 2px `ring` outline at 50% alpha, never a glow; three z-levels (content, sticky chrome,
102
- overlay); no atmospheric gradients, no glassmorphism.
103
-
104
- ## 7 Do's & Don'ts
105
-
106
- - **Do** reserve `primary` (yellow) for the single most important action, active nav, and the
107
- wordmark — nowhere else; its scarcity is what makes it powerful. Keep black `primary-foreground` on
108
- the fill; the black-on-yellow is the signature.
109
- - **Do** carry every figure in `font-mono` with `tabular-nums`, and pick the theme by surface intent:
110
- dark for markets/dashboards/trading, light for forms and transactional work.
111
- - **Don't** introduce a second brand accent — turquoise, info-blue, and the trading hues are
112
- status / chart roles, not brand colors; and don't use yellow for body text, large fills, or a
113
- selected-row wash (accent selection with the neutral `accent` tint).
114
- - **Don't** fill a card with `success` / `destructive` — direction is text color, not a surface (on a
115
- surface showing live price direction, keep red for down-moves and treat generic errors distinctly);
116
- don't pill the CTA outside a hero moment; don't signal rank with heavy shadow — stay flat.
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; markets table → horizontally-scrollable rows; 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 | forms cap at `form-max-width`; tables and dashboards use the full width |
128
-
129
- ## 9 Agent Prompt Guide
130
-
131
- - One accent, always. Yellow `primary` marks THE action and active nav; black on yellow, never white.
132
- Choose the theme by surface: dark console for markets / dashboards / trading, light for forms and
133
- CRM — both native, the primary button identical in both.
134
- - Numbers are `font-mono` + `tabular-nums`; direction and status ride `success` / `destructive` as
135
- text color, never a card fill.
136
- - Stay flat — surface ladder and 1px hairlines before any shadow; radii tight (control radius for
137
- buttons, one step up for cards); no pill outside a hero.
138
- - Leave the marketing skin behind: 64/48px hero display, yellow→dark gradients, pill hero CTAs,
139
- coin-stack illustrations, the light-footer inversion, 80px editorial bands. What carries: the
140
- palette, its cool temperature, the tight radius character, the tabular number voice, and flat depth.