@nurix/etna 0.19.49 → 0.19.51
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/data/harness-index.json +1 -1
- package/data/harnesses/apollo/harness.json +2 -2
- package/data/harnesses/apollo/hooks/hooks.json +3 -1
- package/data/harnesses/apollo/skills/design/SKILL.md +55 -29
- package/data/harnesses/apollo/skills/design/references/compose.md +8 -4
- package/data/harnesses/apollo/skills/design/references/content.md +5 -5
- package/data/harnesses/apollo/skills/design/references/existing-apps.md +1 -1
- package/data/harnesses/apollo/skills/design/references/intake.md +11 -7
- package/data/harnesses/apollo/skills/design/references/object-pass.md +1 -1
- package/data/harnesses/apollo/skills/design/references/ship-gate.md +3 -3
- package/data/harnesses/apollo/skills/design/scripts/select-chart.mjs +26 -6
- package/data/harnesses/code/harness.json +2 -2
- package/data/harnesses/code/hooks/hooks.json +3 -1
- package/data/harnesses/code/skills/design/SKILL.md +55 -29
- package/data/harnesses/code/skills/design/references/compose.md +8 -4
- package/data/harnesses/code/skills/design/references/content.md +5 -5
- package/data/harnesses/code/skills/design/references/existing-apps.md +1 -1
- package/data/harnesses/code/skills/design/references/intake.md +11 -7
- package/data/harnesses/code/skills/design/references/object-pass.md +1 -1
- package/data/harnesses/code/skills/design/references/ship-gate.md +3 -3
- package/data/harnesses/code/skills/design/scripts/select-chart.mjs +26 -6
- package/package.json +2 -2
- package/data/harnesses/apollo/skills/design/data/blueprints/browse.md +0 -38
- package/data/harnesses/apollo/skills/design/data/blueprints/creation-flow.md +0 -38
- package/data/harnesses/apollo/skills/design/data/blueprints/dashboard.md +0 -38
- package/data/harnesses/apollo/skills/design/data/blueprints/grid.md +0 -38
- package/data/harnesses/apollo/skills/design/data/blueprints/queue.md +0 -38
- package/data/harnesses/apollo/skills/design/data/blueprints/record-detail.md +0 -38
- package/data/harnesses/apollo/skills/design/data/blueprints/settings.md +0 -38
- package/data/harnesses/apollo/skills/design/data/chart-styling/Readme.md +0 -33
- package/data/harnesses/apollo/skills/design/data/chart-styling/carbon-accessible-alert-semantic.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/carbon-monochrome-sequential-trend.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/datadog-classic-six-aligned.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/datawrapper-tiered-gray-hierarchy.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/econ-red-rule-horizontal.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/financial-diverging-threshold-overlay.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/ft-vocabulary-ranked-muted.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/grafana-dark-threshold-bands.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/material-rounded-explicit-label.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/nyt-ghost-grid-direct-label.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/plot-currentcolor-inherit.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/saas-gradient-glow-area.md +0 -19
- package/data/harnesses/apollo/skills/design/data/chart-styling/shadcn-composable-css-vars.md +0 -19
- package/data/harnesses/apollo/skills/design/data/charts/census.csv +0 -58
- package/data/harnesses/apollo/skills/design/data/checklists/browse.md +0 -21
- package/data/harnesses/apollo/skills/design/data/checklists/creation-flow.md +0 -20
- package/data/harnesses/apollo/skills/design/data/checklists/dashboard.md +0 -21
- package/data/harnesses/apollo/skills/design/data/checklists/grid.md +0 -21
- package/data/harnesses/apollo/skills/design/data/checklists/queue.md +0 -21
- package/data/harnesses/apollo/skills/design/data/checklists/record-detail.md +0 -21
- package/data/harnesses/apollo/skills/design/data/checklists/settings.md +0 -21
- package/data/harnesses/apollo/skills/design/data/chrome/board-column.md +0 -68
- package/data/harnesses/apollo/skills/design/data/chrome/data-table.md +0 -63
- package/data/harnesses/apollo/skills/design/data/chrome/side-panel.md +0 -60
- package/data/harnesses/apollo/skills/design/data/chrome/sidebar.md +0 -78
- package/data/harnesses/apollo/skills/design/data/chrome/stat-cards.md +0 -62
- package/data/harnesses/apollo/skills/design/data/chrome/topbar.md +0 -65
- package/data/harnesses/apollo/skills/design/data/color/accent-presets.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/aesop-earth-mute.md +0 -91
- package/data/harnesses/apollo/skills/design/data/color/arc-peach-play.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/attio-hunter-teal.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/carbon-cyan-signal.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/clay-parchment.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/duolingo-feather.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/geist-mono-signal.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/linear-graphite-violet.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/mercury-onyx-cobalt.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/notion-paper-ink.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/radix-slate-iris.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/raycast-void-spectrum.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/spectrum-celery-fuchsia.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/stripe-blurple-ruby.md +0 -90
- package/data/harnesses/apollo/skills/design/data/color/superhuman-cod-picton.md +0 -89
- package/data/harnesses/apollo/skills/design/data/corpora/operations-review/companies.csv +0 -15
- package/data/harnesses/apollo/skills/design/data/corpora/operations-review/corpus.md +0 -87
- package/data/harnesses/apollo/skills/design/data/corpora/operations-review/people.csv +0 -25
- package/data/harnesses/apollo/skills/design/data/corpora/procurement-approvals/companies.csv +0 -15
- package/data/harnesses/apollo/skills/design/data/corpora/procurement-approvals/corpus.md +0 -83
- package/data/harnesses/apollo/skills/design/data/corpora/procurement-approvals/people.csv +0 -25
- package/data/harnesses/apollo/skills/design/data/corpora/revenue-analytics/companies.csv +0 -15
- package/data/harnesses/apollo/skills/design/data/corpora/revenue-analytics/corpus.md +0 -89
- package/data/harnesses/apollo/skills/design/data/corpora/revenue-analytics/people.csv +0 -25
- package/data/harnesses/apollo/skills/design/data/elevation/ant-design-directional-shadow.md +0 -19
- package/data/harnesses/apollo/skills/design/data/elevation/apple-liquid-glass-material.md +0 -18
- package/data/harnesses/apollo/skills/design/data/elevation/atlassian-surface-shadow-pairing.md +0 -20
- package/data/harnesses/apollo/skills/design/data/elevation/fluent-2-key-ambient-ramp.md +0 -20
- package/data/harnesses/apollo/skills/design/data/elevation/github-primer-sparing-shadow.md +0 -19
- package/data/harnesses/apollo/skills/design/data/elevation/ibm-carbon-layer-and-border.md +0 -19
- package/data/harnesses/apollo/skills/design/data/elevation/linear-dark-surface-ladder.md +0 -17
- package/data/harnesses/apollo/skills/design/data/elevation/material-2-key-ambient-dp-ramp.md +0 -19
- package/data/harnesses/apollo/skills/design/data/elevation/material-3-tonal-elevation.md +0 -21
- package/data/harnesses/apollo/skills/design/data/elevation/neobrutalist-hard-offset.md +0 -19
- package/data/harnesses/apollo/skills/design/data/elevation/neumorphic-soft-dual-shadow.md +0 -18
- package/data/harnesses/apollo/skills/design/data/elevation/notion-warm-minimal-hairline.md +0 -17
- package/data/harnesses/apollo/skills/design/data/elevation/polaris-elevation-inset-bevel.md +0 -21
- package/data/harnesses/apollo/skills/design/data/elevation/radix-themes-alpha-ring-scale.md +0 -19
- package/data/harnesses/apollo/skills/design/data/elevation/shadcn-neutral-derived-radius.md +0 -19
- package/data/harnesses/apollo/skills/design/data/elevation/stripe-brand-tinted-dual-shadow.md +0 -18
- package/data/harnesses/apollo/skills/design/data/elevation/tailwind-default-utility-scale.md +0 -19
- package/data/harnesses/apollo/skills/design/data/elevation/vercel-geist-shadow-as-border.md +0 -20
- package/data/harnesses/apollo/skills/design/data/gradients/amber-attention-fill.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/cloud-shadow-wash.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/confident-lavender-wash.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/ember-ship-flare.md +0 -18
- package/data/harnesses/apollo/skills/design/data/gradients/full-metal-wash.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/indigo-ruby-cta-band.md +0 -18
- package/data/harnesses/apollo/skills/design/data/gradients/linear-graphite-wash.md +0 -18
- package/data/harnesses/apollo/skills/design/data/gradients/marble-quartz-wash.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/midnight-aurora-panel.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/neutral-volume-fill.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/revenue-uptrend-fill.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/risk-decline-fill.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/signal-blue-develop.md +0 -18
- package/data/harnesses/apollo/skills/design/data/gradients/slate-mist-wash.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/stripe-atmosphere-mesh.md +0 -18
- package/data/harnesses/apollo/skills/design/data/gradients/teal-signal-accent.md +0 -16
- package/data/harnesses/apollo/skills/design/data/gradients/violet-magenta-promo.md +0 -16
- package/data/harnesses/apollo/skills/design/data/iconography.md +0 -199
- package/data/harnesses/apollo/skills/design/data/motion/accordion-expand.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/destructive-hold-confirm.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/drag-dismiss-momentum.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/empty-state-arrive.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/hover-lift.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/modal-center-arrive.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/number-ticker-roll.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/onboarding-bounce.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/panel-slide.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/press-feedback.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/progress-linear-loop.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/route-crossfade.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/rubber-band-overscroll.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/skeleton-shimmer.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/stagger-arrive.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/toast-enter-stack.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/tooltip-chain-instant.md +0 -18
- package/data/harnesses/apollo/skills/design/data/motion/trigger-anchored-reveal.md +0 -18
- package/data/harnesses/apollo/skills/design/data/tells.csv +0 -34
- package/data/harnesses/apollo/skills/design/data/typography/anton-work-sans.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/archivo-black-archivo.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/bitter-karla.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/dm-serif-dm-sans.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/fraunces-inter.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/geist-geist-mono.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/hubot-sans-mona-sans.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/ibm-plex-sans-operator-single-family.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/instrument-serif-instrument-sans.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/inter-operator-single-family.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/libre-baskerville-libre-franklin.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/newsreader-inter.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/playfair-display-source-sans.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/public-sans-operator-single-family.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/sohne-inter-fintech.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/source-serif-source-sans.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/space-grotesk-work-sans-space-mono.md +0 -17
- package/data/harnesses/apollo/skills/design/data/typography/spectral-manrope.md +0 -17
- package/data/harnesses/apollo/skills/design/data/voices/bright-collaborator.md +0 -29
- package/data/harnesses/apollo/skills/design/data/voices/direct-operator.md +0 -29
- package/data/harnesses/apollo/skills/design/data/voices/earnest-helper.md +0 -29
- package/data/harnesses/apollo/skills/design/data/voices/editorial-composed.md +0 -29
- package/data/harnesses/apollo/skills/design/data/voices/quiet-concierge.md +0 -29
- package/data/harnesses/apollo/skills/design/data/voices/warm-guide.md +0 -29
- package/data/harnesses/apollo/skills/design/design-md/SCHEMA.md +0 -179
- package/data/harnesses/apollo/skills/design/design-md/index.csv +0 -67
- package/data/harnesses/apollo/skills/design/design-md/library/airbnb.md +0 -207
- package/data/harnesses/apollo/skills/design/design-md/library/airtable.md +0 -205
- package/data/harnesses/apollo/skills/design/design-md/library/anthropic-claude.md +0 -203
- package/data/harnesses/apollo/skills/design/design-md/library/apple.md +0 -206
- package/data/harnesses/apollo/skills/design/design-md/library/binance.md +0 -210
- package/data/harnesses/apollo/skills/design/design-md/library/bmw.md +0 -210
- package/data/harnesses/apollo/skills/design/design-md/library/cal.md +0 -209
- package/data/harnesses/apollo/skills/design/design-md/library/clay.md +0 -204
- package/data/harnesses/apollo/skills/design/design-md/library/clickhouse.md +0 -205
- package/data/harnesses/apollo/skills/design/design-md/library/cohere.md +0 -205
- package/data/harnesses/apollo/skills/design/design-md/library/coinbase.md +0 -198
- package/data/harnesses/apollo/skills/design/design-md/library/composio.md +0 -198
- package/data/harnesses/apollo/skills/design/design-md/library/cursor.md +0 -197
- package/data/harnesses/apollo/skills/design/design-md/library/elevenlabs.md +0 -199
- package/data/harnesses/apollo/skills/design/design-md/library/expo.md +0 -200
- package/data/harnesses/apollo/skills/design/design-md/library/figma.md +0 -199
- package/data/harnesses/apollo/skills/design/design-md/library/framer.md +0 -202
- package/data/harnesses/apollo/skills/design/design-md/library/hashicorp.md +0 -205
- package/data/harnesses/apollo/skills/design/design-md/library/ibm.md +0 -205
- package/data/harnesses/apollo/skills/design/design-md/library/intercom.md +0 -204
- package/data/harnesses/apollo/skills/design/design-md/library/kraken.md +0 -200
- package/data/harnesses/apollo/skills/design/design-md/library/linear-app.md +0 -198
- package/data/harnesses/apollo/skills/design/design-md/library/lovable.md +0 -199
- package/data/harnesses/apollo/skills/design/design-md/library/meta.md +0 -204
- package/data/harnesses/apollo/skills/design/design-md/library/minimax.md +0 -204
- package/data/harnesses/apollo/skills/design/design-md/library/mintlify.md +0 -210
- package/data/harnesses/apollo/skills/design/design-md/library/miro.md +0 -209
- package/data/harnesses/apollo/skills/design/design-md/library/mistral-ai.md +0 -201
- package/data/harnesses/apollo/skills/design/design-md/library/mongodb.md +0 -201
- package/data/harnesses/apollo/skills/design/design-md/library/notion.md +0 -204
- package/data/harnesses/apollo/skills/design/design-md/library/nvidia.md +0 -215
- package/data/harnesses/apollo/skills/design/design-md/library/ollama.md +0 -213
- package/data/harnesses/apollo/skills/design/design-md/library/opencode-ai.md +0 -216
- package/data/harnesses/apollo/skills/design/design-md/library/posthog.md +0 -218
- package/data/harnesses/apollo/skills/design/design-md/library/raycast.md +0 -214
- package/data/harnesses/apollo/skills/design/design-md/library/replicate.md +0 -202
- package/data/harnesses/apollo/skills/design/design-md/library/resend.md +0 -203
- package/data/harnesses/apollo/skills/design/design-md/library/revolut.md +0 -203
- package/data/harnesses/apollo/skills/design/design-md/library/runwayml.md +0 -203
- package/data/harnesses/apollo/skills/design/design-md/library/sanity.md +0 -200
- package/data/harnesses/apollo/skills/design/design-md/library/sentry.md +0 -201
- package/data/harnesses/apollo/skills/design/design-md/library/shopify.md +0 -202
- package/data/harnesses/apollo/skills/design/design-md/library/slack.md +0 -202
- package/data/harnesses/apollo/skills/design/design-md/library/spacex.md +0 -206
- package/data/harnesses/apollo/skills/design/design-md/library/spotify.md +0 -206
- package/data/harnesses/apollo/skills/design/design-md/library/stripe.md +0 -196
- package/data/harnesses/apollo/skills/design/design-md/library/supabase.md +0 -196
- package/data/harnesses/apollo/skills/design/design-md/library/superhuman.md +0 -194
- package/data/harnesses/apollo/skills/design/design-md/library/tesla.md +0 -198
- package/data/harnesses/apollo/skills/design/design-md/library/theverge.md +0 -199
- package/data/harnesses/apollo/skills/design/design-md/library/together-ai.md +0 -193
- package/data/harnesses/apollo/skills/design/design-md/library/uber.md +0 -195
- package/data/harnesses/apollo/skills/design/design-md/library/vercel.md +0 -195
- package/data/harnesses/apollo/skills/design/design-md/library/voltagent.md +0 -197
- package/data/harnesses/apollo/skills/design/design-md/library/warp.md +0 -196
- package/data/harnesses/apollo/skills/design/design-md/library/webflow.md +0 -197
- package/data/harnesses/apollo/skills/design/design-md/library/wired.md +0 -197
- package/data/harnesses/apollo/skills/design/design-md/library/wise.md +0 -198
- package/data/harnesses/apollo/skills/design/design-md/library/x-ai.md +0 -199
- package/data/harnesses/apollo/skills/design/design-md/library/zapier.md +0 -198
- package/data/harnesses/apollo/skills/design/design-md/nurix.md +0 -214
- package/data/harnesses/apollo/skills/design/design-md/variants/editorial-luxury.md +0 -184
- package/data/harnesses/apollo/skills/design/design-md/variants/expressive-saas.md +0 -216
- package/data/harnesses/apollo/skills/design/design-md/variants/quiet-premium.md +0 -211
- package/data/harnesses/apollo/skills/design/design-md/variants/terse-dense-operator.md +0 -212
- package/data/harnesses/apollo/skills/design/design-md/variants/warm-approachable.md +0 -216
- package/data/harnesses/code/skills/design/data/blueprints/browse.md +0 -38
- package/data/harnesses/code/skills/design/data/blueprints/creation-flow.md +0 -38
- package/data/harnesses/code/skills/design/data/blueprints/dashboard.md +0 -38
- package/data/harnesses/code/skills/design/data/blueprints/grid.md +0 -38
- package/data/harnesses/code/skills/design/data/blueprints/queue.md +0 -38
- package/data/harnesses/code/skills/design/data/blueprints/record-detail.md +0 -38
- package/data/harnesses/code/skills/design/data/blueprints/settings.md +0 -38
- package/data/harnesses/code/skills/design/data/chart-styling/Readme.md +0 -33
- package/data/harnesses/code/skills/design/data/chart-styling/carbon-accessible-alert-semantic.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/carbon-monochrome-sequential-trend.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/datadog-classic-six-aligned.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/datawrapper-tiered-gray-hierarchy.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/econ-red-rule-horizontal.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/financial-diverging-threshold-overlay.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/ft-vocabulary-ranked-muted.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/grafana-dark-threshold-bands.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/material-rounded-explicit-label.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/nyt-ghost-grid-direct-label.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/plot-currentcolor-inherit.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/saas-gradient-glow-area.md +0 -19
- package/data/harnesses/code/skills/design/data/chart-styling/shadcn-composable-css-vars.md +0 -19
- package/data/harnesses/code/skills/design/data/charts/census.csv +0 -58
- package/data/harnesses/code/skills/design/data/checklists/browse.md +0 -21
- package/data/harnesses/code/skills/design/data/checklists/creation-flow.md +0 -20
- package/data/harnesses/code/skills/design/data/checklists/dashboard.md +0 -21
- package/data/harnesses/code/skills/design/data/checklists/grid.md +0 -21
- package/data/harnesses/code/skills/design/data/checklists/queue.md +0 -21
- package/data/harnesses/code/skills/design/data/checklists/record-detail.md +0 -21
- package/data/harnesses/code/skills/design/data/checklists/settings.md +0 -21
- package/data/harnesses/code/skills/design/data/chrome/board-column.md +0 -68
- package/data/harnesses/code/skills/design/data/chrome/data-table.md +0 -63
- package/data/harnesses/code/skills/design/data/chrome/side-panel.md +0 -60
- package/data/harnesses/code/skills/design/data/chrome/sidebar.md +0 -78
- package/data/harnesses/code/skills/design/data/chrome/stat-cards.md +0 -62
- package/data/harnesses/code/skills/design/data/chrome/topbar.md +0 -65
- package/data/harnesses/code/skills/design/data/color/accent-presets.md +0 -90
- package/data/harnesses/code/skills/design/data/color/aesop-earth-mute.md +0 -91
- package/data/harnesses/code/skills/design/data/color/arc-peach-play.md +0 -90
- package/data/harnesses/code/skills/design/data/color/attio-hunter-teal.md +0 -90
- package/data/harnesses/code/skills/design/data/color/carbon-cyan-signal.md +0 -90
- package/data/harnesses/code/skills/design/data/color/clay-parchment.md +0 -90
- package/data/harnesses/code/skills/design/data/color/duolingo-feather.md +0 -90
- package/data/harnesses/code/skills/design/data/color/geist-mono-signal.md +0 -90
- package/data/harnesses/code/skills/design/data/color/linear-graphite-violet.md +0 -90
- package/data/harnesses/code/skills/design/data/color/mercury-onyx-cobalt.md +0 -90
- package/data/harnesses/code/skills/design/data/color/notion-paper-ink.md +0 -90
- package/data/harnesses/code/skills/design/data/color/radix-slate-iris.md +0 -90
- package/data/harnesses/code/skills/design/data/color/raycast-void-spectrum.md +0 -90
- package/data/harnesses/code/skills/design/data/color/spectrum-celery-fuchsia.md +0 -90
- package/data/harnesses/code/skills/design/data/color/stripe-blurple-ruby.md +0 -90
- package/data/harnesses/code/skills/design/data/color/superhuman-cod-picton.md +0 -89
- package/data/harnesses/code/skills/design/data/corpora/operations-review/companies.csv +0 -15
- package/data/harnesses/code/skills/design/data/corpora/operations-review/corpus.md +0 -87
- package/data/harnesses/code/skills/design/data/corpora/operations-review/people.csv +0 -25
- package/data/harnesses/code/skills/design/data/corpora/procurement-approvals/companies.csv +0 -15
- package/data/harnesses/code/skills/design/data/corpora/procurement-approvals/corpus.md +0 -83
- package/data/harnesses/code/skills/design/data/corpora/procurement-approvals/people.csv +0 -25
- package/data/harnesses/code/skills/design/data/corpora/revenue-analytics/companies.csv +0 -15
- package/data/harnesses/code/skills/design/data/corpora/revenue-analytics/corpus.md +0 -89
- package/data/harnesses/code/skills/design/data/corpora/revenue-analytics/people.csv +0 -25
- package/data/harnesses/code/skills/design/data/elevation/ant-design-directional-shadow.md +0 -19
- package/data/harnesses/code/skills/design/data/elevation/apple-liquid-glass-material.md +0 -18
- package/data/harnesses/code/skills/design/data/elevation/atlassian-surface-shadow-pairing.md +0 -20
- package/data/harnesses/code/skills/design/data/elevation/fluent-2-key-ambient-ramp.md +0 -20
- package/data/harnesses/code/skills/design/data/elevation/github-primer-sparing-shadow.md +0 -19
- package/data/harnesses/code/skills/design/data/elevation/ibm-carbon-layer-and-border.md +0 -19
- package/data/harnesses/code/skills/design/data/elevation/linear-dark-surface-ladder.md +0 -17
- package/data/harnesses/code/skills/design/data/elevation/material-2-key-ambient-dp-ramp.md +0 -19
- package/data/harnesses/code/skills/design/data/elevation/material-3-tonal-elevation.md +0 -21
- package/data/harnesses/code/skills/design/data/elevation/neobrutalist-hard-offset.md +0 -19
- package/data/harnesses/code/skills/design/data/elevation/neumorphic-soft-dual-shadow.md +0 -18
- package/data/harnesses/code/skills/design/data/elevation/notion-warm-minimal-hairline.md +0 -17
- package/data/harnesses/code/skills/design/data/elevation/polaris-elevation-inset-bevel.md +0 -21
- package/data/harnesses/code/skills/design/data/elevation/radix-themes-alpha-ring-scale.md +0 -19
- package/data/harnesses/code/skills/design/data/elevation/shadcn-neutral-derived-radius.md +0 -19
- package/data/harnesses/code/skills/design/data/elevation/stripe-brand-tinted-dual-shadow.md +0 -18
- package/data/harnesses/code/skills/design/data/elevation/tailwind-default-utility-scale.md +0 -19
- package/data/harnesses/code/skills/design/data/elevation/vercel-geist-shadow-as-border.md +0 -20
- package/data/harnesses/code/skills/design/data/gradients/amber-attention-fill.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/cloud-shadow-wash.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/confident-lavender-wash.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/ember-ship-flare.md +0 -18
- package/data/harnesses/code/skills/design/data/gradients/full-metal-wash.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/indigo-ruby-cta-band.md +0 -18
- package/data/harnesses/code/skills/design/data/gradients/linear-graphite-wash.md +0 -18
- package/data/harnesses/code/skills/design/data/gradients/marble-quartz-wash.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/midnight-aurora-panel.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/neutral-volume-fill.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/revenue-uptrend-fill.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/risk-decline-fill.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/signal-blue-develop.md +0 -18
- package/data/harnesses/code/skills/design/data/gradients/slate-mist-wash.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/stripe-atmosphere-mesh.md +0 -18
- package/data/harnesses/code/skills/design/data/gradients/teal-signal-accent.md +0 -16
- package/data/harnesses/code/skills/design/data/gradients/violet-magenta-promo.md +0 -16
- package/data/harnesses/code/skills/design/data/iconography.md +0 -199
- package/data/harnesses/code/skills/design/data/motion/accordion-expand.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/destructive-hold-confirm.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/drag-dismiss-momentum.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/empty-state-arrive.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/hover-lift.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/modal-center-arrive.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/number-ticker-roll.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/onboarding-bounce.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/panel-slide.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/press-feedback.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/progress-linear-loop.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/route-crossfade.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/rubber-band-overscroll.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/skeleton-shimmer.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/stagger-arrive.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/toast-enter-stack.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/tooltip-chain-instant.md +0 -18
- package/data/harnesses/code/skills/design/data/motion/trigger-anchored-reveal.md +0 -18
- package/data/harnesses/code/skills/design/data/tells.csv +0 -34
- package/data/harnesses/code/skills/design/data/typography/anton-work-sans.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/archivo-black-archivo.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/bitter-karla.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/dm-serif-dm-sans.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/fraunces-inter.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/geist-geist-mono.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/hubot-sans-mona-sans.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/ibm-plex-sans-operator-single-family.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/instrument-serif-instrument-sans.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/inter-operator-single-family.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/libre-baskerville-libre-franklin.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/newsreader-inter.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/playfair-display-source-sans.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/public-sans-operator-single-family.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/sohne-inter-fintech.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/source-serif-source-sans.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/space-grotesk-work-sans-space-mono.md +0 -17
- package/data/harnesses/code/skills/design/data/typography/spectral-manrope.md +0 -17
- package/data/harnesses/code/skills/design/data/voices/bright-collaborator.md +0 -29
- package/data/harnesses/code/skills/design/data/voices/direct-operator.md +0 -29
- package/data/harnesses/code/skills/design/data/voices/earnest-helper.md +0 -29
- package/data/harnesses/code/skills/design/data/voices/editorial-composed.md +0 -29
- package/data/harnesses/code/skills/design/data/voices/quiet-concierge.md +0 -29
- package/data/harnesses/code/skills/design/data/voices/warm-guide.md +0 -29
- package/data/harnesses/code/skills/design/design-md/SCHEMA.md +0 -179
- package/data/harnesses/code/skills/design/design-md/index.csv +0 -67
- package/data/harnesses/code/skills/design/design-md/library/airbnb.md +0 -207
- package/data/harnesses/code/skills/design/design-md/library/airtable.md +0 -205
- package/data/harnesses/code/skills/design/design-md/library/anthropic-claude.md +0 -203
- package/data/harnesses/code/skills/design/design-md/library/apple.md +0 -206
- package/data/harnesses/code/skills/design/design-md/library/binance.md +0 -210
- package/data/harnesses/code/skills/design/design-md/library/bmw.md +0 -210
- package/data/harnesses/code/skills/design/design-md/library/cal.md +0 -209
- package/data/harnesses/code/skills/design/design-md/library/clay.md +0 -204
- package/data/harnesses/code/skills/design/design-md/library/clickhouse.md +0 -205
- package/data/harnesses/code/skills/design/design-md/library/cohere.md +0 -205
- package/data/harnesses/code/skills/design/design-md/library/coinbase.md +0 -198
- package/data/harnesses/code/skills/design/design-md/library/composio.md +0 -198
- package/data/harnesses/code/skills/design/design-md/library/cursor.md +0 -197
- package/data/harnesses/code/skills/design/design-md/library/elevenlabs.md +0 -199
- package/data/harnesses/code/skills/design/design-md/library/expo.md +0 -200
- package/data/harnesses/code/skills/design/design-md/library/figma.md +0 -199
- package/data/harnesses/code/skills/design/design-md/library/framer.md +0 -202
- package/data/harnesses/code/skills/design/design-md/library/hashicorp.md +0 -205
- package/data/harnesses/code/skills/design/design-md/library/ibm.md +0 -205
- package/data/harnesses/code/skills/design/design-md/library/intercom.md +0 -204
- package/data/harnesses/code/skills/design/design-md/library/kraken.md +0 -200
- package/data/harnesses/code/skills/design/design-md/library/linear-app.md +0 -198
- package/data/harnesses/code/skills/design/design-md/library/lovable.md +0 -199
- package/data/harnesses/code/skills/design/design-md/library/meta.md +0 -204
- package/data/harnesses/code/skills/design/design-md/library/minimax.md +0 -204
- package/data/harnesses/code/skills/design/design-md/library/mintlify.md +0 -210
- package/data/harnesses/code/skills/design/design-md/library/miro.md +0 -209
- package/data/harnesses/code/skills/design/design-md/library/mistral-ai.md +0 -201
- package/data/harnesses/code/skills/design/design-md/library/mongodb.md +0 -201
- package/data/harnesses/code/skills/design/design-md/library/notion.md +0 -204
- package/data/harnesses/code/skills/design/design-md/library/nvidia.md +0 -215
- package/data/harnesses/code/skills/design/design-md/library/ollama.md +0 -213
- package/data/harnesses/code/skills/design/design-md/library/opencode-ai.md +0 -216
- package/data/harnesses/code/skills/design/design-md/library/posthog.md +0 -218
- package/data/harnesses/code/skills/design/design-md/library/raycast.md +0 -214
- package/data/harnesses/code/skills/design/design-md/library/replicate.md +0 -202
- package/data/harnesses/code/skills/design/design-md/library/resend.md +0 -203
- package/data/harnesses/code/skills/design/design-md/library/revolut.md +0 -203
- package/data/harnesses/code/skills/design/design-md/library/runwayml.md +0 -203
- package/data/harnesses/code/skills/design/design-md/library/sanity.md +0 -200
- package/data/harnesses/code/skills/design/design-md/library/sentry.md +0 -201
- package/data/harnesses/code/skills/design/design-md/library/shopify.md +0 -202
- package/data/harnesses/code/skills/design/design-md/library/slack.md +0 -202
- package/data/harnesses/code/skills/design/design-md/library/spacex.md +0 -206
- package/data/harnesses/code/skills/design/design-md/library/spotify.md +0 -206
- package/data/harnesses/code/skills/design/design-md/library/stripe.md +0 -196
- package/data/harnesses/code/skills/design/design-md/library/supabase.md +0 -196
- package/data/harnesses/code/skills/design/design-md/library/superhuman.md +0 -194
- package/data/harnesses/code/skills/design/design-md/library/tesla.md +0 -198
- package/data/harnesses/code/skills/design/design-md/library/theverge.md +0 -199
- package/data/harnesses/code/skills/design/design-md/library/together-ai.md +0 -193
- package/data/harnesses/code/skills/design/design-md/library/uber.md +0 -195
- package/data/harnesses/code/skills/design/design-md/library/vercel.md +0 -195
- package/data/harnesses/code/skills/design/design-md/library/voltagent.md +0 -197
- package/data/harnesses/code/skills/design/design-md/library/warp.md +0 -196
- package/data/harnesses/code/skills/design/design-md/library/webflow.md +0 -197
- package/data/harnesses/code/skills/design/design-md/library/wired.md +0 -197
- package/data/harnesses/code/skills/design/design-md/library/wise.md +0 -198
- package/data/harnesses/code/skills/design/design-md/library/x-ai.md +0 -199
- package/data/harnesses/code/skills/design/design-md/library/zapier.md +0 -198
- package/data/harnesses/code/skills/design/design-md/nurix.md +0 -214
- package/data/harnesses/code/skills/design/design-md/variants/editorial-luxury.md +0 -184
- package/data/harnesses/code/skills/design/design-md/variants/expressive-saas.md +0 -216
- package/data/harnesses/code/skills/design/design-md/variants/quiet-premium.md +0 -211
- package/data/harnesses/code/skills/design/design-md/variants/terse-dense-operator.md +0 -212
- package/data/harnesses/code/skills/design/design-md/variants/warm-approachable.md +0 -216
|
@@ -1,198 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
schema: design-md/v2
|
|
3
|
-
id: tesla
|
|
4
|
-
tier: brand
|
|
5
|
-
segments: [automotive, hardware, consumer-tech]
|
|
6
|
-
keywords: [minimal, white, electric-blue, grayscale, flat, square, zero-tracking]
|
|
7
|
-
sourced: 2026-07-12
|
|
8
|
-
sources: "design-md/v1 library entry (2026-07-04); 2026-07-12 brand re-audit; Universal Sans Text → Inter Variable substitution (v1-documented), JetBrains Mono for the derived mono"
|
|
9
|
-
license: open
|
|
10
|
-
---
|
|
11
|
-
|
|
12
|
-
# tesla — a bright showroom floor, one electric-blue switch
|
|
13
|
-
|
|
14
|
-
## 1 Visual Theme
|
|
15
|
-
A bright showroom floor swept clean: white space, a rich grayscale ink ramp, near-zero
|
|
16
|
-
decoration, and one Electric Blue switch on the action that matters. Light default; the
|
|
17
|
-
dark theme is an authored cool ladder. Categorically flat and shadowless — a grayscale
|
|
18
|
-
surface ladder and type weight carry hierarchy. The geometry is the identity: barely-
|
|
19
|
-
rounded 4px corners on every control. The whisper of cool tint on each neutral is the
|
|
20
|
-
Carbon undertone, beneath perception; the full-viewport photography stays behind.
|
|
21
|
-
|
|
22
|
-
## 2 Color Roles
|
|
23
|
-
Carbon-dark `foreground` on white `background` — a warm blue-undertoned near-black
|
|
24
|
-
stepping down a documented ramp. `primary` Electric Blue is the only chromatic hue,
|
|
25
|
-
reserved for the one action and active nav, held by the focus `ring`. `accent` is a
|
|
26
|
-
faint blue wash for selection. Status hues (`destructive`, `success`, `warning`) speak
|
|
27
|
-
only status, never the blue. The `sidebar` runs a Light Ash panel a half-step off the
|
|
28
|
-
white canvas.
|
|
29
|
-
|
|
30
|
-
## 3 Typography
|
|
31
|
-
Inter (chrome and display, substituting Universal Sans Text) / JetBrains Mono (data).
|
|
32
|
-
Register scope: the sans runs every title, control, cell, and byline at two weights
|
|
33
|
-
only — 500 for heads and UI, 400 for body, no bold and no light — with **zero
|
|
34
|
-
letter-spacing** at every level, the Tesla signature, and **no uppercase transforms**,
|
|
35
|
-
captions sentence-case. The mono owns IDs, codes, and timestamps; numerals are always
|
|
36
|
-
`tabular-nums`; emphasize by weight, never size.
|
|
37
|
-
|
|
38
|
-
## 4 Component Stylings
|
|
39
|
-
Buttons `radius-sm` (4px, no pill), Electric Blue `primary` fill, hover a color-only
|
|
40
|
-
darkening never a transform; inputs on the firmer `input` edge, the blue `ring` at 2px
|
|
41
|
-
without glow; cards flat on an optional hairline, no shadow at rest; table rows `muted`
|
|
42
|
-
hover, faint-blue `accent` selection; detail opens in the side panel; badges square at
|
|
43
|
-
`radius-sm`, sentence-case captions, status fills only.
|
|
44
|
-
|
|
45
|
-
## 5 Layout
|
|
46
|
-
8px base; sidebar 248/56px; topbar 56px; side panel 420/640px; content max 1383px —
|
|
47
|
-
Tesla's container; density standard and engineered-uniform, the whitespace-as-luxury
|
|
48
|
-
rhythm left behind.
|
|
49
|
-
|
|
50
|
-
## 6 Depth
|
|
51
|
-
Flat and essentially shadowless. Light: the surface ladder, hairlines, and z-position
|
|
52
|
-
carry rank; a whisper cool-tinted shadow lifts a true overlay only, sticky chrome
|
|
53
|
-
floats by a frosted backdrop and position. Dark: the authored ladder does the depth —
|
|
54
|
-
`background` 0.20 L, `surface-raised` +0.05, `surface-overlay` +0.10, cool hue held
|
|
55
|
-
at 264.
|
|
56
|
-
|
|
57
|
-
## 7 Motion
|
|
58
|
-
Color-only, calm. Named moments: `panel-slide` (side panel, 330ms, interruptible),
|
|
59
|
-
`fade-arrive` (page content, 200ms), `tint-press` (primary press, 130ms) — a
|
|
60
|
-
background-and-border transition, never a scale or translate. Physicality granted only
|
|
61
|
-
to auth; tables and keyboard actions are instant.
|
|
62
|
-
|
|
63
|
-
## 8 Iconography & Charts
|
|
64
|
-
Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default. Charts: hairline axes,
|
|
65
|
-
no gridline fills; the monochrome-plus-blue ramp — Electric Blue against the grayscale
|
|
66
|
-
steps categorical (`chart-1..5`); monochrome sequential canvas→blue; tooltips on
|
|
67
|
-
`surface-overlay` with mono numerals.
|
|
68
|
-
|
|
69
|
-
## 9 Voice
|
|
70
|
-
Plain and declarative, sentence case throughout: no exclamation, exact numbers. "Order"
|
|
71
|
-
· "Nothing scheduled — the next service window opens Monday" · "This action cancels the
|
|
72
|
-
reservation and cannot be undone."
|
|
73
|
-
|
|
74
|
-
## 10 Do's & Don'ts
|
|
75
|
-
Do reserve Electric Blue for the single most important action, never decoration. Do
|
|
76
|
-
keep every corner barely rounded at 4px. Do hold type at 400/500, zero letter-spacing,
|
|
77
|
-
sentence case. Don't promote a second chromatic accent, drop a shadow, uppercase a
|
|
78
|
-
label, or animate with scale or translate — interactions are color-only.
|
|
79
|
-
|
|
80
|
-
## 11 Responsive
|
|
81
|
-
375: sidebar → off-canvas drawer, side panel → full sheet, list+detail stacks. 768:
|
|
82
|
-
sidebar → icon rail; tables scroll overflow. 1024/1440: two-pane queue+detail holds;
|
|
83
|
-
content caps at 1383px, forms cap tighter, dashboards use full width.
|
|
84
|
-
|
|
85
|
-
## 12 Agent Prompt Guide
|
|
86
|
-
Accent only the primary action in Electric Blue — if two things want it, one is not
|
|
87
|
-
primary. Keep every corner 4px, every weight 400 or 500, every tracking zero, every
|
|
88
|
-
label sentence-case. Motion is color-only. Dark is the authored cool ladder — consult
|
|
89
|
-
the block, never derive.
|
|
90
|
-
|
|
91
|
-
```yaml design-values
|
|
92
|
-
color:
|
|
93
|
-
light:
|
|
94
|
-
background: oklch(1 0 264)
|
|
95
|
-
foreground: oklch(0.217 0.013 264.3)
|
|
96
|
-
card: oklch(1 0 264)
|
|
97
|
-
card-foreground: oklch(0.217 0.013 264.3)
|
|
98
|
-
popover: oklch(1 0 264)
|
|
99
|
-
popover-foreground: oklch(0.217 0.013 264.3)
|
|
100
|
-
primary: oklch(0.561 0.188 265.4)
|
|
101
|
-
primary-foreground: oklch(1 0 265.4)
|
|
102
|
-
secondary: oklch(0.967 0.005 264)
|
|
103
|
-
secondary-foreground: oklch(0.355 0.01 260.7)
|
|
104
|
-
muted: oklch(0.967 0.005 264)
|
|
105
|
-
muted-foreground: oklch(0.482 0.007 264.5)
|
|
106
|
-
accent: oklch(0.958 0.015 270)
|
|
107
|
-
accent-foreground: oklch(0.35 0.05 265)
|
|
108
|
-
destructive: oklch(0.577 0.215 27.3)
|
|
109
|
-
destructive-foreground: oklch(0.985 0.01 27.3)
|
|
110
|
-
success: oklch(0.627 0.17 149.2)
|
|
111
|
-
warning: oklch(0.666 0.157 58.3)
|
|
112
|
-
border: oklch(0.949 0.005 264)
|
|
113
|
-
input: oklch(0.86 0.006 264)
|
|
114
|
-
ring: oklch(0.561 0.188 265.4)
|
|
115
|
-
surface-raised: oklch(1 0 264)
|
|
116
|
-
surface-overlay: oklch(1 0 264)
|
|
117
|
-
chart-1: oklch(0.561 0.188 265.4)
|
|
118
|
-
chart-2: oklch(0.4 0.01 264)
|
|
119
|
-
chart-3: oklch(0.6 0.01 264)
|
|
120
|
-
chart-4: oklch(0.7 0.15 265)
|
|
121
|
-
chart-5: oklch(0.75 0.01 264)
|
|
122
|
-
sidebar: oklch(0.967 0.005 264)
|
|
123
|
-
sidebar-foreground: oklch(0.24 0.01 264)
|
|
124
|
-
sidebar-primary: oklch(0.561 0.188 265.4)
|
|
125
|
-
sidebar-primary-foreground: oklch(1 0 265.4)
|
|
126
|
-
sidebar-accent: oklch(0.958 0.015 270)
|
|
127
|
-
sidebar-accent-foreground: oklch(0.35 0.05 265)
|
|
128
|
-
sidebar-border: oklch(0.94 0.005 264)
|
|
129
|
-
sidebar-ring: oklch(0.561 0.188 265.4)
|
|
130
|
-
dark:
|
|
131
|
-
background: oklch(0.2 0.008 264)
|
|
132
|
-
foreground: oklch(0.94 0.005 264)
|
|
133
|
-
card: oklch(0.23 0.008 264)
|
|
134
|
-
card-foreground: oklch(0.94 0.005 264)
|
|
135
|
-
popover: oklch(0.28 0.008 264)
|
|
136
|
-
popover-foreground: oklch(0.94 0.005 264)
|
|
137
|
-
primary: oklch(0.62 0.18 265)
|
|
138
|
-
primary-foreground: oklch(0.99 0.01 265)
|
|
139
|
-
secondary: oklch(0.25 0.008 264)
|
|
140
|
-
secondary-foreground: oklch(0.9 0.005 264)
|
|
141
|
-
muted: oklch(0.24 0.008 264)
|
|
142
|
-
muted-foreground: oklch(0.68 0.008 264)
|
|
143
|
-
accent: oklch(0.3 0.03 265)
|
|
144
|
-
accent-foreground: oklch(0.9 0.02 265)
|
|
145
|
-
destructive: oklch(0.64 0.21 27.3)
|
|
146
|
-
destructive-foreground: oklch(0.14 0.02 27.3)
|
|
147
|
-
success: oklch(0.68 0.16 149.2)
|
|
148
|
-
warning: oklch(0.75 0.15 58.3)
|
|
149
|
-
border: oklch(0.28 0.008 264)
|
|
150
|
-
input: oklch(0.28 0.008 264)
|
|
151
|
-
ring: oklch(0.62 0.18 265)
|
|
152
|
-
surface-raised: oklch(0.25 0.008 264)
|
|
153
|
-
surface-overlay: oklch(0.3 0.008 264)
|
|
154
|
-
chart-1: oklch(0.62 0.18 265)
|
|
155
|
-
chart-2: oklch(0.5 0.01 264)
|
|
156
|
-
chart-3: oklch(0.7 0.01 264)
|
|
157
|
-
chart-4: oklch(0.75 0.14 265)
|
|
158
|
-
chart-5: oklch(0.82 0.01 264)
|
|
159
|
-
sidebar: oklch(0.17 0.008 264)
|
|
160
|
-
sidebar-foreground: oklch(0.9 0.005 264)
|
|
161
|
-
sidebar-primary: oklch(0.62 0.18 265)
|
|
162
|
-
sidebar-primary-foreground: oklch(0.99 0.01 265)
|
|
163
|
-
sidebar-accent: oklch(0.25 0.03 265)
|
|
164
|
-
sidebar-accent-foreground: oklch(0.9 0.02 265)
|
|
165
|
-
sidebar-border: oklch(0.22 0.008 264)
|
|
166
|
-
sidebar-ring: oklch(0.62 0.18 265)
|
|
167
|
-
typography:
|
|
168
|
-
display: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400, 500] }
|
|
169
|
-
sans: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400, 500] }
|
|
170
|
-
mono: { family: "JetBrains Mono", fallback: "ui-monospace, monospace", weights: [400] }
|
|
171
|
-
ramp:
|
|
172
|
-
display: { size: 28px, line: 34px, weight: 500, family: display, tracking: 0 }
|
|
173
|
-
h1: { size: 24px, line: 30px, weight: 500, family: sans, tracking: 0 }
|
|
174
|
-
h2: { size: 18px, line: 24px, weight: 500, family: sans, tracking: 0 }
|
|
175
|
-
body: { size: 14px, line: 20px, weight: 400, family: sans }
|
|
176
|
-
small: { size: 13px, line: 18px, weight: 400, family: sans }
|
|
177
|
-
caption: { size: 12px, line: 16px, weight: 500, family: sans }
|
|
178
|
-
data: { size: 13px, line: 20px, weight: 400, family: mono, features: [tnum] }
|
|
179
|
-
register-scope: { display: [page-title, empty-state], sans: [chrome, controls, body, headings], mono: [data, ids, timestamps] }
|
|
180
|
-
elevation:
|
|
181
|
-
radius: { sm: 4px, md: 8px, lg: 12px }
|
|
182
|
-
hairline: border
|
|
183
|
-
shadow:
|
|
184
|
-
overlay: "0 2px 12px oklch(0.217 0.013 264 / 0.1)"
|
|
185
|
-
popover: "0 1px 4px oklch(0.217 0.013 264 / 0.08)"
|
|
186
|
-
dark-ladder: { background: 0.2, raised: 0.25, overlay: 0.3, hue-held: 264 }
|
|
187
|
-
motion:
|
|
188
|
-
duration: { press: 130ms, fade: 200ms, panel: 330ms }
|
|
189
|
-
easing: { standard: "cubic-bezier(0.2, 0, 0, 1)", exit: "cubic-bezier(0.4, 0, 1, 1)" }
|
|
190
|
-
entrance-never: ease-in
|
|
191
|
-
identity-moments: [auth]
|
|
192
|
-
iconography: { set: lucide, stroke: 1.5px, grid: [16px, 20px] }
|
|
193
|
-
charts:
|
|
194
|
-
categorical: [chart-1, chart-2, chart-3, chart-4, chart-5]
|
|
195
|
-
sequential: { from: background, to: chart-1 }
|
|
196
|
-
diverging: { negative: destructive, mid: muted, positive: success }
|
|
197
|
-
layout: { base: 8px, sidebar: [248px, 56px], topbar: 56px, side-panel: [420px, 640px], content-max: 1383px }
|
|
198
|
-
```
|
|
@@ -1,199 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
schema: design-md/v2
|
|
3
|
-
id: theverge
|
|
4
|
-
tier: brand
|
|
5
|
-
segments: [media, editorial, publishing]
|
|
6
|
-
keywords: [dark, near-black, mint, mono-uppercase, editorial, flat, rounded]
|
|
7
|
-
sourced: 2026-07-12
|
|
8
|
-
sources: "design-md/v1 library entry (2026-07-04); 2026-07-12 brand re-audit; PolySans → Space Grotesk Variable and PolySans Mono → Space Mono substitutions (v1-documented); the saturated brand hazards carried only into charts"
|
|
9
|
-
license: open
|
|
10
|
-
---
|
|
11
|
-
|
|
12
|
-
# theverge — a developer console lit by club-night color
|
|
13
|
-
|
|
14
|
-
## 1 Visual Theme
|
|
15
|
-
A developer console run at night under hazard-tape color: a near-black canvas warm
|
|
16
|
-
enough to read as printed-newsprint negative rather than an OLED void, one acid-mint
|
|
17
|
-
lamp treated like safety paint, and mono-uppercase labels stamped across the chrome.
|
|
18
|
-
Dark is the product — the `#131313` canvas fills the primary theme; a restrained
|
|
19
|
-
daytime counterpart is authored beside it. Flat: hairlines and saturated color are the
|
|
20
|
-
elevation, never a shadow — color is depth here, and nothing rounds to a square.
|
|
21
|
-
|
|
22
|
-
## 2 Color Roles
|
|
23
|
-
Hazard-white `foreground` on the near-black `background`, the neutral ramp carrying a
|
|
24
|
-
faint warmth. `primary` acid-mint is the one chromatic accent — the single action and
|
|
25
|
-
the active-nav underline, worn as a fill with black `primary-foreground`, the only
|
|
26
|
-
place black appears, never as small text or a wash. The focus `ring` is a dedicated
|
|
27
|
-
Focus Cyan, shown nowhere else. `accent` is a neutral slate step for selection. Status
|
|
28
|
-
hues speak status; ultraviolet, yellow, and pink live only in charts.
|
|
29
|
-
|
|
30
|
-
## 3 Typography
|
|
31
|
-
Space Grotesk (chrome and display, substituting PolySans) / Space Mono (labels and
|
|
32
|
-
data, substituting PolySans Mono). Register scope: the sans runs every title, control,
|
|
33
|
-
and byline, emphasis the punchy jump from 400 to 700; the mono owns every ALL-CAPS
|
|
34
|
-
label — kickers, timestamps, tags, IDs, log lines — always with positive letter-spacing,
|
|
35
|
-
the irreducible Verge signature. Numerals are always `tabular-nums`.
|
|
36
|
-
|
|
37
|
-
## 4 Component Stylings
|
|
38
|
-
Buttons `radius-md` (rounded, never square, never pill), acid-mint `primary` fill with
|
|
39
|
-
black text, hover inverting to a translucent surface; inputs on a hairline `border`,
|
|
40
|
-
the Focus Cyan `ring` at 2px without glow; a focused card firms its hairline to mint or
|
|
41
|
-
white — the border escalates, the surface never lifts; table rows `muted` hover,
|
|
42
|
-
`accent` selection, mono-uppercase timestamps; detail opens in the side panel; badges
|
|
43
|
-
pill with mono-uppercase captions, status fills only.
|
|
44
|
-
|
|
45
|
-
## 5 Layout
|
|
46
|
-
4px base; sidebar 248/56px; topbar 56px; side panel 420/640px; content max 1280px;
|
|
47
|
-
density standard, the marketing shout left behind.
|
|
48
|
-
|
|
49
|
-
## 6 Depth
|
|
50
|
-
Flat, color-as-elevation. Dark: the near-black surface ladder and hairlines carry rank —
|
|
51
|
-
`background` 0.187 L, `surface-raised` +0.05, `surface-overlay` +0.10, warm hue held at
|
|
52
|
-
70; a focused card firms its hairline to mint or white, and on the dark canvas a shadow
|
|
53
|
-
barely registers, so overlays separate by border and position. Light: hairlines carry
|
|
54
|
-
structure, the near-black masthead sidebar holding in both themes. No gradients, no glows.
|
|
55
|
-
|
|
56
|
-
## 7 Motion
|
|
57
|
-
Nearly none — the hazard-tape aesthetic breaks if anything fades. Named moments:
|
|
58
|
-
`panel-slide` (side panel, 200ms, interruptible), `mint-underline` (active-nav mark,
|
|
59
|
-
140ms), `press` (button press, 90ms). Physicality granted only to auth; tables, nav,
|
|
60
|
-
and keyboard flows are instant.
|
|
61
|
-
|
|
62
|
-
## 8 Iconography & Charts
|
|
63
|
-
Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default. Charts: hairline axes,
|
|
64
|
-
square legends; the brand hazards return only here — mint, ultraviolet, yellow, pink,
|
|
65
|
-
cyan categorical (`chart-1..5`); monochrome sequential canvas→mint; tooltips on
|
|
66
|
-
`surface-overlay` with mono-uppercase numerals.
|
|
67
|
-
|
|
68
|
-
## 9 Voice
|
|
69
|
-
Punchy and declarative, labels in mono caps: present tense, no hedging. "Publish now" ·
|
|
70
|
-
"Nothing in the queue — the last story shipped 12m ago" · "This post has 2 unresolved
|
|
71
|
-
fact-checks; publishing is locked."
|
|
72
|
-
|
|
73
|
-
## 10 Do's & Don'ts
|
|
74
|
-
Do anchor every view on the near-black canvas and spend mint once — one action or the
|
|
75
|
-
active-nav underline, black text on the fill. Do stamp every label, tag, and timestamp
|
|
76
|
-
in mono uppercase with positive tracking — missing tracking is missing voice. Don't use
|
|
77
|
-
mint as small text or a wash, promote a second chromatic accent, square a corner, or
|
|
78
|
-
drop a shadow — escalate the hairline instead.
|
|
79
|
-
|
|
80
|
-
## 11 Responsive
|
|
81
|
-
375: sidebar → off-canvas drawer, side panel → full sheet, mono labels pinned at 11–12px,
|
|
82
|
-
list+detail stacks. 768: sidebar → icon rail; tables scroll overflow. 1024/1440: two-pane
|
|
83
|
-
queue+detail holds; forms cap, dashboards use full width; saturated hues reflow, never fade.
|
|
84
|
-
|
|
85
|
-
## 12 Agent Prompt Guide
|
|
86
|
-
Reach for the near-black canvas first — dark is the brand, the light theme its daytime
|
|
87
|
-
counterpart. Accent only the primary action in mint, black text on the fill, or the
|
|
88
|
-
active-nav underline. Carry the mono-uppercase label voice everywhere, positive tracking
|
|
89
|
-
on every all-caps run. Escalate a border before reaching for elevation. Dark is authored
|
|
90
|
-
— consult the block, never invert.
|
|
91
|
-
|
|
92
|
-
```yaml design-values
|
|
93
|
-
color:
|
|
94
|
-
light:
|
|
95
|
-
background: oklch(0.99 0.005 70)
|
|
96
|
-
foreground: oklch(0.2 0.006 70)
|
|
97
|
-
card: oklch(0.995 0.004 70)
|
|
98
|
-
card-foreground: oklch(0.2 0.006 70)
|
|
99
|
-
popover: oklch(0.995 0.004 70)
|
|
100
|
-
popover-foreground: oklch(0.2 0.006 70)
|
|
101
|
-
primary: oklch(0.85 0.16 171.8)
|
|
102
|
-
primary-foreground: oklch(0 0 0)
|
|
103
|
-
secondary: oklch(0.96 0.006 70)
|
|
104
|
-
secondary-foreground: oklch(0.28 0.006 70)
|
|
105
|
-
muted: oklch(0.96 0.006 70)
|
|
106
|
-
muted-foreground: oklch(0.5 0.008 70)
|
|
107
|
-
accent: oklch(0.945 0.006 70)
|
|
108
|
-
accent-foreground: oklch(0.26 0.006 70)
|
|
109
|
-
destructive: oklch(0.58 0.23 17.5)
|
|
110
|
-
destructive-foreground: oklch(0.99 0.01 17.5)
|
|
111
|
-
success: oklch(0.6 0.19 149.6)
|
|
112
|
-
warning: oklch(0.8 0.16 91.2)
|
|
113
|
-
border: oklch(0.9 0.006 70)
|
|
114
|
-
input: oklch(0.9 0.006 70)
|
|
115
|
-
ring: oklch(0.6 0.13 225.9)
|
|
116
|
-
surface-raised: oklch(0.995 0.004 70)
|
|
117
|
-
surface-overlay: oklch(0.995 0.004 70)
|
|
118
|
-
chart-1: oklch(0.7 0.16 171.8)
|
|
119
|
-
chart-2: oklch(0.5 0.27 279)
|
|
120
|
-
chart-3: oklch(0.75 0.15 91.2)
|
|
121
|
-
chart-4: oklch(0.6 0.23 350)
|
|
122
|
-
chart-5: oklch(0.6 0.13 225.9)
|
|
123
|
-
sidebar: oklch(0.2 0.006 70)
|
|
124
|
-
sidebar-foreground: oklch(0.92 0.004 70)
|
|
125
|
-
sidebar-primary: oklch(0.85 0.16 171.8)
|
|
126
|
-
sidebar-primary-foreground: oklch(0 0 0)
|
|
127
|
-
sidebar-accent: oklch(0.27 0.006 70)
|
|
128
|
-
sidebar-accent-foreground: oklch(0.92 0.004 70)
|
|
129
|
-
sidebar-border: oklch(0.29 0.006 70)
|
|
130
|
-
sidebar-ring: oklch(0.6 0.13 225.9)
|
|
131
|
-
dark:
|
|
132
|
-
background: oklch(0.187 0.006 70)
|
|
133
|
-
foreground: oklch(0.98 0.004 70)
|
|
134
|
-
card: oklch(0.218 0.006 70)
|
|
135
|
-
card-foreground: oklch(0.98 0.004 70)
|
|
136
|
-
popover: oklch(0.29 0.006 70)
|
|
137
|
-
popover-foreground: oklch(0.98 0.004 70)
|
|
138
|
-
primary: oklch(0.896 0.163 171.8)
|
|
139
|
-
primary-foreground: oklch(0 0 0)
|
|
140
|
-
secondary: oklch(0.297 0.006 70)
|
|
141
|
-
secondary-foreground: oklch(0.92 0.004 70)
|
|
142
|
-
muted: oklch(0.26 0.006 70)
|
|
143
|
-
muted-foreground: oklch(0.667 0.006 70)
|
|
144
|
-
accent: oklch(0.297 0.006 70)
|
|
145
|
-
accent-foreground: oklch(0.92 0.004 70)
|
|
146
|
-
destructive: oklch(0.66 0.229 17.5)
|
|
147
|
-
destructive-foreground: oklch(0.98 0.01 17.5)
|
|
148
|
-
success: oklch(0.723 0.192 149.6)
|
|
149
|
-
warning: oklch(0.879 0.163 91.2)
|
|
150
|
-
border: oklch(0.313 0.006 70)
|
|
151
|
-
input: oklch(0.313 0.006 70)
|
|
152
|
-
ring: oklch(0.701 0.128 225.9)
|
|
153
|
-
surface-raised: oklch(0.24 0.006 70)
|
|
154
|
-
surface-overlay: oklch(0.29 0.006 70)
|
|
155
|
-
chart-1: oklch(0.8 0.16 171.8)
|
|
156
|
-
chart-2: oklch(0.55 0.25 279)
|
|
157
|
-
chart-3: oklch(0.85 0.16 91.2)
|
|
158
|
-
chart-4: oklch(0.66 0.23 350)
|
|
159
|
-
chart-5: oklch(0.701 0.128 225.9)
|
|
160
|
-
sidebar: oklch(0.16 0.006 70)
|
|
161
|
-
sidebar-foreground: oklch(0.92 0.004 70)
|
|
162
|
-
sidebar-primary: oklch(0.896 0.163 171.8)
|
|
163
|
-
sidebar-primary-foreground: oklch(0 0 0)
|
|
164
|
-
sidebar-accent: oklch(0.24 0.006 70)
|
|
165
|
-
sidebar-accent-foreground: oklch(0.92 0.004 70)
|
|
166
|
-
sidebar-border: oklch(0.24 0.006 70)
|
|
167
|
-
sidebar-ring: oklch(0.701 0.128 225.9)
|
|
168
|
-
typography:
|
|
169
|
-
display: { family: "Space Grotesk Variable", fallback: "system-ui, sans-serif", weights: [400, 700] }
|
|
170
|
-
sans: { family: "Space Grotesk Variable", fallback: "system-ui, sans-serif", weights: [400, 700] }
|
|
171
|
-
mono: { family: "Space Mono", fallback: "ui-monospace, monospace", weights: [400, 700] }
|
|
172
|
-
ramp:
|
|
173
|
-
display: { size: 28px, line: 31px, weight: 700, family: display, tracking: -0.01em }
|
|
174
|
-
h1: { size: 24px, line: 26px, weight: 700, family: sans, tracking: -0.01em }
|
|
175
|
-
h2: { size: 20px, line: 24px, weight: 700, family: sans }
|
|
176
|
-
body: { size: 14px, line: 21px, weight: 400, family: sans }
|
|
177
|
-
small: { size: 13px, line: 18px, weight: 400, family: sans }
|
|
178
|
-
caption: { size: 12px, line: 15px, weight: 700, family: mono, tracking: 0.12em, transform: uppercase }
|
|
179
|
-
data: { size: 13px, line: 20px, weight: 400, family: mono, features: [tnum] }
|
|
180
|
-
register-scope: { display: [page-title, section-head, empty-state], sans: [chrome, controls, body], mono: [data, ids, timestamps, labels, tags] }
|
|
181
|
-
elevation:
|
|
182
|
-
radius: { sm: 6px, md: 8px, lg: 12px }
|
|
183
|
-
hairline: border
|
|
184
|
-
shadow:
|
|
185
|
-
overlay: "0 8px 30px oklch(0.12 0.015 70 / 0.5)"
|
|
186
|
-
popover: "0 4px 16px oklch(0.12 0.015 70 / 0.4)"
|
|
187
|
-
dark-ladder: { background: 0.187, raised: 0.24, overlay: 0.29, hue-held: 70 }
|
|
188
|
-
motion:
|
|
189
|
-
duration: { press: 90ms, fade: 140ms, panel: 200ms }
|
|
190
|
-
easing: { standard: "cubic-bezier(0.2, 0, 0, 1)", exit: "cubic-bezier(0.4, 0, 1, 1)" }
|
|
191
|
-
entrance-never: ease-in
|
|
192
|
-
identity-moments: [auth]
|
|
193
|
-
iconography: { set: lucide, stroke: 1.5px, grid: [16px, 20px] }
|
|
194
|
-
charts:
|
|
195
|
-
categorical: [chart-1, chart-2, chart-3, chart-4, chart-5]
|
|
196
|
-
sequential: { from: background, to: chart-1 }
|
|
197
|
-
diverging: { negative: destructive, mid: muted, positive: success }
|
|
198
|
-
layout: { base: 4px, sidebar: [248px, 56px], topbar: 56px, side-panel: [420px, 640px], content-max: 1280px }
|
|
199
|
-
```
|
|
@@ -1,193 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
schema: design-md/v2
|
|
3
|
-
id: together-ai
|
|
4
|
-
tier: brand
|
|
5
|
-
segments: [ai-platform, dev-tools, api-console]
|
|
6
|
-
keywords: [stark, mono-caps, white, black-cta, periwinkle, technical, flat]
|
|
7
|
-
sourced: 2026-07-12
|
|
8
|
-
sources: "design-md/v1 library entry (2026-07-04); 2026-07-12 brand re-audit; The Future → Inter Variable and PP Neue Montreal Mono → JetBrains Mono Variable substitutions"
|
|
9
|
-
license: open
|
|
10
|
-
---
|
|
11
|
-
|
|
12
|
-
# together-ai — a GPU cleanroom's white spec bench
|
|
13
|
-
|
|
14
|
-
## 1 Visual Theme
|
|
15
|
-
A research lab's white cleanroom bench: matte white worktop, black-stenciled part
|
|
16
|
-
labels in machine caps, one periwinkle wire-tie marking the live line. Light default;
|
|
17
|
-
stark black ink on white is the voice, the black CTA a monochrome stamp. Dark is the
|
|
18
|
-
brand's own near-black navy band (`#010120` family) made a whole room, not an
|
|
19
|
-
inversion. Flat, hairline-led; the three-stop gradient stays in charts.
|
|
20
|
-
|
|
21
|
-
## 2 Color Roles
|
|
22
|
-
Ink-black `foreground` on the white canvas; `primary` is black — a neutral doing the
|
|
23
|
-
one conversion job, never a hue. Periwinkle-indigo `accent-foreground`/`ring` is the
|
|
24
|
-
single chromatic accent: links, selection, focus — never fills or large areas. The
|
|
25
|
-
persistent nav rail wears the near-black navy `sidebar` in both themes. Status hues
|
|
26
|
-
(`destructive`, `success`, `warning`) speak only on chips and inline validation.
|
|
27
|
-
|
|
28
|
-
## 3 Typography
|
|
29
|
-
Inter (text, substituting the brand's The Future) / JetBrains Mono (labels + data,
|
|
30
|
-
substituting PP Neue Montreal Mono). Register scope: the mono owns every uppercase
|
|
31
|
-
moment — eyebrows, button labels, table-header cells, tags — at positive tracking;
|
|
32
|
-
the sans stays sentence-case and never bolds past 600. Numerals are always mono
|
|
33
|
-
`tabular-nums`; the mono never carries a paragraph.
|
|
34
|
-
|
|
35
|
-
## 4 Component Stylings
|
|
36
|
-
Buttons `radius-md` (4px, never pill), black `primary` fill, uppercase mono label;
|
|
37
|
-
inputs hairline `border` with the periwinkle `ring` focus; cards white-on-white read
|
|
38
|
-
by hairline, never brightness; table rows sheet-dense with `secondary` header rails
|
|
39
|
-
and mono-caps header cells, `muted` hover, `accent` selection; detail opens in the
|
|
40
|
-
side panel; badges alone may pill, mono-caps captions.
|
|
41
|
-
|
|
42
|
-
## 5 Layout
|
|
43
|
-
4px base; sidebar 256/56px; topbar 56px; side panel 440/640px; content max 1440px;
|
|
44
|
-
rows 40px sheet-tight; the 80px band rhythm survives only between page regions.
|
|
45
|
-
|
|
46
|
-
## 6 Depth
|
|
47
|
-
Light: flat — hairlines and the dark rail carry all structure; shadows only on true
|
|
48
|
-
overlays, navy-tinted, never black. Dark: the authored ladder — `background` 0.15 L,
|
|
49
|
-
`surface-raised` +0.05, `surface-overlay` +0.10, hue held at 270; the rail drops a
|
|
50
|
-
step below the canvas.
|
|
51
|
-
|
|
52
|
-
## 7 Motion
|
|
53
|
-
Terse, engineered. Named moments: `panel-slide` (side panel, 220ms, interruptible),
|
|
54
|
-
`row-settle` (table load, 140ms fade), `stamp` (primary-action press, 100ms).
|
|
55
|
-
Physicality granted only to auth and first-run empty states; nothing animates in
|
|
56
|
-
tables or keyboard-initiated actions.
|
|
57
|
-
|
|
58
|
-
## 8 Iconography & Charts
|
|
59
|
-
Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default. Charts are where the
|
|
60
|
-
brand gradient lives: periwinkle → magenta → orange → mint categorical ramp
|
|
61
|
-
(`chart-1..5`), hairline axes, no gridline fills, tooltips on `surface-overlay` with
|
|
62
|
-
mono numerals.
|
|
63
|
-
|
|
64
|
-
## 9 Voice
|
|
65
|
-
Spec-sheet flat: verbs in machine caps on controls, plain sentences elsewhere.
|
|
66
|
-
"DEPLOY MODEL" · "No jobs queued — capacity opens at 14:00 UTC" · "This endpoint
|
|
67
|
-
exceeds the org rate limit; raise it in Billing."
|
|
68
|
-
|
|
69
|
-
## 10 Do's & Don'ts
|
|
70
|
-
Do keep the canvas white and the ink stark — the black-on-white severity is the
|
|
71
|
-
brand. Do set every eyebrow, button label, and header cell in uppercase mono. Don't
|
|
72
|
-
let the gradient into chrome — charts only. Don't pill the CTA. Don't let the mono
|
|
73
|
-
carry a paragraph or the sans go past 600.
|
|
74
|
-
|
|
75
|
-
## 11 Responsive
|
|
76
|
-
375: rail → off-canvas drawer, side panel → full sheet, table rows stack label-over-
|
|
77
|
-
value in mono. 768: rail collapses to the near-black icon strip. 1024/1440: two-pane
|
|
78
|
-
queue+detail holds; content caps at 1440px, band rhythm widens.
|
|
79
|
-
|
|
80
|
-
## 12 Agent Prompt Guide
|
|
81
|
-
Lead every surface with its table or primary read on the white canvas. Spend black
|
|
82
|
-
once (the CTA), periwinkle only on links, selection, and focus. Every uppercase
|
|
83
|
-
moment is the mono. Dark is the navy band authored as a room — consult the block,
|
|
84
|
-
never invert.
|
|
85
|
-
|
|
86
|
-
```yaml design-values
|
|
87
|
-
color:
|
|
88
|
-
light:
|
|
89
|
-
background: oklch(0.99 0.005 277)
|
|
90
|
-
foreground: oklch(0.15 0.01 277)
|
|
91
|
-
card: oklch(0.995 0.005 277)
|
|
92
|
-
card-foreground: oklch(0.15 0.01 277)
|
|
93
|
-
popover: oklch(0.995 0.005 277)
|
|
94
|
-
popover-foreground: oklch(0.15 0.01 277)
|
|
95
|
-
primary: oklch(0.15 0.01 277)
|
|
96
|
-
primary-foreground: oklch(0.985 0.005 277)
|
|
97
|
-
secondary: oklch(0.93 0.006 277)
|
|
98
|
-
secondary-foreground: oklch(0.25 0.012 277)
|
|
99
|
-
muted: oklch(0.965 0.006 277)
|
|
100
|
-
muted-foreground: oklch(0.46 0.012 277)
|
|
101
|
-
accent: oklch(0.952 0.021 289)
|
|
102
|
-
accent-foreground: oklch(0.45 0.21 277)
|
|
103
|
-
destructive: oklch(0.55 0.21 27)
|
|
104
|
-
destructive-foreground: oklch(0.985 0.008 27)
|
|
105
|
-
success: oklch(0.55 0.15 150)
|
|
106
|
-
warning: oklch(0.62 0.15 58)
|
|
107
|
-
border: oklch(0.925 0.006 277)
|
|
108
|
-
input: oklch(0.925 0.006 277)
|
|
109
|
-
ring: oklch(0.498 0.223 277)
|
|
110
|
-
surface-raised: oklch(0.985 0.005 277)
|
|
111
|
-
surface-overlay: oklch(0.995 0.005 277)
|
|
112
|
-
chart-1: oklch(0.55 0.21 277)
|
|
113
|
-
chart-2: oklch(0.6 0.22 350)
|
|
114
|
-
chart-3: oklch(0.68 0.17 45)
|
|
115
|
-
chart-4: oklch(0.7 0.12 168)
|
|
116
|
-
chart-5: oklch(0.38 0.08 270)
|
|
117
|
-
sidebar: oklch(0.15 0.055 268)
|
|
118
|
-
sidebar-foreground: oklch(0.93 0.012 277)
|
|
119
|
-
sidebar-primary: oklch(0.7 0.15 277)
|
|
120
|
-
sidebar-primary-foreground: oklch(0.13 0.04 270)
|
|
121
|
-
sidebar-accent: oklch(0.22 0.055 270)
|
|
122
|
-
sidebar-accent-foreground: oklch(0.9 0.015 277)
|
|
123
|
-
sidebar-border: oklch(0.24 0.05 270)
|
|
124
|
-
sidebar-ring: oklch(0.7 0.15 277)
|
|
125
|
-
dark:
|
|
126
|
-
background: oklch(0.15 0.03 270)
|
|
127
|
-
foreground: oklch(0.95 0.008 277)
|
|
128
|
-
card: oklch(0.18 0.032 270)
|
|
129
|
-
card-foreground: oklch(0.95 0.008 277)
|
|
130
|
-
popover: oklch(0.25 0.035 270)
|
|
131
|
-
popover-foreground: oklch(0.95 0.008 277)
|
|
132
|
-
primary: oklch(0.95 0.008 277)
|
|
133
|
-
primary-foreground: oklch(0.17 0.03 270)
|
|
134
|
-
secondary: oklch(0.23 0.033 270)
|
|
135
|
-
secondary-foreground: oklch(0.9 0.01 277)
|
|
136
|
-
muted: oklch(0.22 0.03 270)
|
|
137
|
-
muted-foreground: oklch(0.7 0.02 277)
|
|
138
|
-
accent: oklch(0.28 0.06 277)
|
|
139
|
-
accent-foreground: oklch(0.82 0.09 277)
|
|
140
|
-
destructive: oklch(0.62 0.19 25)
|
|
141
|
-
destructive-foreground: oklch(0.12 0.02 25)
|
|
142
|
-
success: oklch(0.7 0.15 162)
|
|
143
|
-
warning: oklch(0.75 0.15 65)
|
|
144
|
-
border: oklch(0.26 0.032 270)
|
|
145
|
-
input: oklch(0.26 0.032 270)
|
|
146
|
-
ring: oklch(0.64 0.19 277)
|
|
147
|
-
surface-raised: oklch(0.2 0.033 270)
|
|
148
|
-
surface-overlay: oklch(0.25 0.035 270)
|
|
149
|
-
chart-1: oklch(0.66 0.18 277)
|
|
150
|
-
chart-2: oklch(0.68 0.2 350)
|
|
151
|
-
chart-3: oklch(0.74 0.16 45)
|
|
152
|
-
chart-4: oklch(0.78 0.12 168)
|
|
153
|
-
chart-5: oklch(0.55 0.1 270)
|
|
154
|
-
sidebar: oklch(0.12 0.028 270)
|
|
155
|
-
sidebar-foreground: oklch(0.92 0.01 277)
|
|
156
|
-
sidebar-primary: oklch(0.7 0.15 277)
|
|
157
|
-
sidebar-primary-foreground: oklch(0.12 0.03 270)
|
|
158
|
-
sidebar-accent: oklch(0.19 0.035 270)
|
|
159
|
-
sidebar-accent-foreground: oklch(0.9 0.012 277)
|
|
160
|
-
sidebar-border: oklch(0.21 0.032 270)
|
|
161
|
-
sidebar-ring: oklch(0.7 0.15 277)
|
|
162
|
-
typography:
|
|
163
|
-
display: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [500, 600] }
|
|
164
|
-
sans: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400, 500, 600] }
|
|
165
|
-
mono: { family: "JetBrains Mono Variable", fallback: "ui-monospace, monospace", weights: [400, 600] }
|
|
166
|
-
ramp:
|
|
167
|
-
display: { size: 28px, line: 34px, weight: 600, family: sans, tracking: -0.02em }
|
|
168
|
-
h1: { size: 24px, line: 30px, weight: 600, family: sans, tracking: -0.015em }
|
|
169
|
-
h2: { size: 20px, line: 26px, weight: 600, family: sans, tracking: -0.015em }
|
|
170
|
-
body: { size: 14px, line: 20px, weight: 400, family: sans }
|
|
171
|
-
small: { size: 13px, line: 18px, weight: 400, family: sans }
|
|
172
|
-
caption: { size: 11px, line: 15px, weight: 600, family: mono, tracking: 0.05em, transform: uppercase }
|
|
173
|
-
data: { size: 13px, line: 20px, weight: 400, family: mono, features: [tnum] }
|
|
174
|
-
register-scope: { display: [page-title, empty-state, auth], sans: [chrome, controls, body], mono: [data, ids, timestamps, eyebrows, button-labels, table-headers] }
|
|
175
|
-
elevation:
|
|
176
|
-
radius: { sm: 2px, md: 4px, lg: 8px }
|
|
177
|
-
hairline: border
|
|
178
|
-
shadow:
|
|
179
|
-
overlay: "0 8px 30px oklch(0.12 0.07 268 / 0.12)"
|
|
180
|
-
popover: "0 4px 16px oklch(0.12 0.07 268 / 0.10)"
|
|
181
|
-
dark-ladder: { background: 0.15, raised: 0.20, overlay: 0.25, hue-held: 270 }
|
|
182
|
-
motion:
|
|
183
|
-
duration: { press: 100ms, fade: 140ms, panel: 220ms }
|
|
184
|
-
easing: { standard: "cubic-bezier(0.2, 0, 0, 1)", exit: "cubic-bezier(0.4, 0, 1, 1)" }
|
|
185
|
-
entrance-never: ease-in
|
|
186
|
-
identity-moments: [auth, first-run-empty]
|
|
187
|
-
iconography: { set: lucide, stroke: 1.5px, grid: [16px, 20px] }
|
|
188
|
-
charts:
|
|
189
|
-
categorical: [chart-1, chart-2, chart-3, chart-4, chart-5]
|
|
190
|
-
sequential: { from: background, to: chart-1 }
|
|
191
|
-
diverging: { negative: destructive, mid: muted, positive: chart-4 }
|
|
192
|
-
layout: { base: 4px, sidebar: [256px, 56px], topbar: 56px, side-panel: [440px, 640px], content-max: 1440px }
|
|
193
|
-
```
|