@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,203 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
schema: design-md/v2
|
|
3
|
-
id: revolut
|
|
4
|
-
tier: brand
|
|
5
|
-
segments: [fintech, finance, business-tools]
|
|
6
|
-
keywords: [fintech, cobalt, black-sidebar, precise, rounded, catalogue]
|
|
7
|
-
sourced: 2026-07-12
|
|
8
|
-
sources: "design-md/v1 revolut entry (2026-07-04); 2026-07-12 re-audit of Revolut public brand; Schibsted Grotesk substitutes the licensed Aeonik Pro display; Inter for body, JetBrains Mono for amounts; the persistent sidebar stays true black per brand; a cobalt-tinted dark theme authored from the storytelling mode"
|
|
9
|
-
license: open
|
|
10
|
-
---
|
|
11
|
-
|
|
12
|
-
# revolut — a white catalogue desk against one true-black rail
|
|
13
|
-
|
|
14
|
-
## 1 Visual Theme
|
|
15
|
-
A fintech catalogue desk: the work sits on a white comparison-table canvas, and beside
|
|
16
|
-
it stands one true-black sidebar — Revolut's nav is pure black, so the persistent
|
|
17
|
-
operator chrome carries the brand's dark identity while the work stays bright. Light by
|
|
18
|
-
default; flat, with no drop-shadow language — hierarchy comes from surface-luminance
|
|
19
|
-
and hairlines. One cobalt-violet accent, ink kept a warm near-black, not pure. The dark
|
|
20
|
-
theme is the storytelling mode made habitable, cobalt held. Hero-scale Aeonik and the
|
|
21
|
-
white-pill-on-black CTA stay behind.
|
|
22
|
-
|
|
23
|
-
## 2 Color Roles
|
|
24
|
-
Warm near-black `foreground` on a white `background`; `primary` cobalt violet is the one
|
|
25
|
-
chromatic stamp — the primary action, active nav, key detail. `accent` is a pale-cobalt
|
|
26
|
-
selection lift with a deep-cobalt label. The persistent `sidebar` runs true black in
|
|
27
|
-
both themes, its own dark ladder. The eight illustration hues live only in `chart-*`;
|
|
28
|
-
status hues speak only status.
|
|
29
|
-
|
|
30
|
-
## 3 Typography
|
|
31
|
-
Schibsted Grotesk (the open substitute for the licensed Aeonik Pro) over Inter for
|
|
32
|
-
body, labels, and tables, and JetBrains Mono for amounts, IDs, and timestamps. Heads
|
|
33
|
-
carry the grotesk's tight negative tracking; body rides Inter with a faint positive
|
|
34
|
-
tracking that reads mechanical and fintech-precise. Register scope: the display register
|
|
35
|
-
speaks in page titles, section heads, empty states, and auth; mono owns data, amounts,
|
|
36
|
-
IDs, and timestamps. Numerals are always `tabular-nums`; emphasis bumps weight, never
|
|
37
|
-
size.
|
|
38
|
-
|
|
39
|
-
## 4 Component Stylings
|
|
40
|
-
Buttons `radius-md` (12px, rounded, never the marketing pill), cobalt `primary` fill
|
|
41
|
-
with a white label; secondary is `secondary` on a hairline. Inputs sit on `background`
|
|
42
|
-
with a comfortable height, echoing Revolut's tall fields; focus draws the cobalt `ring`
|
|
43
|
-
at 2px, no glow. Cards take the larger `radius-lg` (20px, Revolut's card corner),
|
|
44
|
-
hairline-edged, never shadowed. Table rows carry `border` grid lines, `muted` hover,
|
|
45
|
-
`accent` selection. Detail opens in the side panel; badges alone pill.
|
|
46
|
-
|
|
47
|
-
## 5 Layout
|
|
48
|
-
4px base; sidebar 256/56px; topbar 64px (the brand's nav-bar height); side panel
|
|
49
|
-
440/640px; content max 1320px. Revolut's 6px and 14px off-grid comfort steps are kept;
|
|
50
|
-
the density is comfortable, the way its tall inputs feel.
|
|
51
|
-
|
|
52
|
-
## 6 Depth
|
|
53
|
-
Flat — Revolut has no traditional drop-shadow language; hierarchy is surface-luminance
|
|
54
|
-
shifts and hairlines. To lift off a band, the band steps to `muted` rather than casting
|
|
55
|
-
a shadow; overlays take the one low tinted lift. The black `sidebar` runs its own dark
|
|
56
|
-
ladder. Dark theme: the surface ladder does depth — `background` 0.16 L,
|
|
57
|
-
`surface-raised` +0.05, `surface-overlay` +0.09, hue held at 274. Focus is always the
|
|
58
|
-
2px cobalt `ring`, keyboard-first.
|
|
59
|
-
|
|
60
|
-
## 7 Motion
|
|
61
|
-
Reserved and precise. Named moments: `panel-slide` (side panel, 240ms, interruptible),
|
|
62
|
-
`fade-arrive` (page content, 160ms), `press` (primary-action press, 120ms). Physicality
|
|
63
|
-
is granted only to auth and first-run empty states; nothing animates in tables, the
|
|
64
|
-
balance grid, or keyboard-initiated actions.
|
|
65
|
-
|
|
66
|
-
## 8 Iconography & Charts
|
|
67
|
-
Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default. Charts: hairline axes,
|
|
68
|
-
no gridline fills; the categorical ramp is Revolut's illustration set — cobalt, teal,
|
|
69
|
-
pink, green, yellow (`chart-1..5`); tooltips on `surface-overlay` with mono numerals.
|
|
70
|
-
|
|
71
|
-
## 9 Voice
|
|
72
|
-
Precise and calm, a fintech register: short declaratives, numbers exact, no cheer. "Add
|
|
73
|
-
money" · "No transactions today — the last one cleared yesterday" · "This transfer
|
|
74
|
-
exceeds your daily limit; raise it in settings or send a smaller amount."
|
|
75
|
-
|
|
76
|
-
## 10 Do's & Don'ts
|
|
77
|
-
Do reserve cobalt for the single primary action — a stamp, not a theme. Do keep the
|
|
78
|
-
`sidebar` true black in both themes; the black rail is the persistent chrome. Do keep
|
|
79
|
-
body ink a warm near-black, not pure. Don't full-pill buttons — the marketing pill stays
|
|
80
|
-
behind; only badges pill. Don't add drop shadows to cards; surface-luminance carries
|
|
81
|
-
elevation. Don't promote an illustration hue into chrome — they are chart-only.
|
|
82
|
-
|
|
83
|
-
## 11 Responsive
|
|
84
|
-
375: black sidebar → off-canvas drawer; side panel → full sheet; tables → card rows
|
|
85
|
-
with mono figures. 768: sidebar collapses to the black icon rail; tables scroll their
|
|
86
|
-
overflow. 1024: two-pane queue+detail holds. 1440: forms cap; tables and dashboards use
|
|
87
|
-
the full width.
|
|
88
|
-
|
|
89
|
-
## 12 Agent Prompt Guide
|
|
90
|
-
Lead every list with its table on the white canvas; the true-black sidebar is the
|
|
91
|
-
persistent left chrome in both themes. Spend cobalt once per surface; everything else is
|
|
92
|
-
neutral or status. Detail and edit go in the side panel, never a modal. Every numeric
|
|
93
|
-
column is `tabular-nums`; every amount, ID, and timestamp is mono. Dark is authored —
|
|
94
|
-
consult the block, never derive.
|
|
95
|
-
|
|
96
|
-
```yaml design-values
|
|
97
|
-
color:
|
|
98
|
-
light:
|
|
99
|
-
background: oklch(0.995 0.003 274)
|
|
100
|
-
foreground: oklch(0.23 0.008 250)
|
|
101
|
-
card: oklch(0.995 0.003 274)
|
|
102
|
-
card-foreground: oklch(0.23 0.008 250)
|
|
103
|
-
popover: oklch(0.995 0.003 274)
|
|
104
|
-
popover-foreground: oklch(0.23 0.008 250)
|
|
105
|
-
primary: oklch(0.515 0.214 274)
|
|
106
|
-
primary-foreground: oklch(0.98 0.01 274)
|
|
107
|
-
secondary: oklch(0.967 0.005 270)
|
|
108
|
-
secondary-foreground: oklch(0.28 0.01 260)
|
|
109
|
-
muted: oklch(0.967 0.005 270)
|
|
110
|
-
muted-foreground: oklch(0.47 0.02 250)
|
|
111
|
-
accent: oklch(0.952 0.019 283)
|
|
112
|
-
accent-foreground: oklch(0.457 0.201 273)
|
|
113
|
-
destructive: oklch(0.55 0.2 22)
|
|
114
|
-
destructive-foreground: oklch(0.98 0.01 22)
|
|
115
|
-
success: oklch(0.554 0.155 137)
|
|
116
|
-
warning: oklch(0.63 0.15 57)
|
|
117
|
-
border: oklch(0.914 0.007 286)
|
|
118
|
-
input: oklch(0.914 0.007 286)
|
|
119
|
-
ring: oklch(0.515 0.214 274)
|
|
120
|
-
surface-raised: oklch(0.985 0.006 274)
|
|
121
|
-
surface-overlay: oklch(0.995 0.003 274)
|
|
122
|
-
chart-1: oklch(0.55 0.2 274)
|
|
123
|
-
chart-2: oklch(0.65 0.12 195)
|
|
124
|
-
chart-3: oklch(0.68 0.17 350)
|
|
125
|
-
chart-4: oklch(0.68 0.14 150)
|
|
126
|
-
chart-5: oklch(0.8 0.14 90)
|
|
127
|
-
sidebar: oklch(0.02 0 0)
|
|
128
|
-
sidebar-foreground: oklch(0.95 0.005 270)
|
|
129
|
-
sidebar-primary: oklch(0.55 0.214 274)
|
|
130
|
-
sidebar-primary-foreground: oklch(0.98 0.01 274)
|
|
131
|
-
sidebar-accent: oklch(0.208 0.005 248)
|
|
132
|
-
sidebar-accent-foreground: oklch(0.95 0.005 270)
|
|
133
|
-
sidebar-border: oklch(0.28 0.006 260)
|
|
134
|
-
sidebar-ring: oklch(0.55 0.214 274)
|
|
135
|
-
dark:
|
|
136
|
-
background: oklch(0.16 0.01 274)
|
|
137
|
-
foreground: oklch(0.94 0.006 270)
|
|
138
|
-
card: oklch(0.2 0.01 274)
|
|
139
|
-
card-foreground: oklch(0.94 0.006 270)
|
|
140
|
-
popover: oklch(0.24 0.012 274)
|
|
141
|
-
popover-foreground: oklch(0.94 0.006 270)
|
|
142
|
-
primary: oklch(0.55 0.2 274)
|
|
143
|
-
primary-foreground: oklch(0.98 0.01 274)
|
|
144
|
-
secondary: oklch(0.22 0.01 274)
|
|
145
|
-
secondary-foreground: oklch(0.9 0.006 270)
|
|
146
|
-
muted: oklch(0.21 0.01 274)
|
|
147
|
-
muted-foreground: oklch(0.7 0.012 270)
|
|
148
|
-
accent: oklch(0.28 0.04 278)
|
|
149
|
-
accent-foreground: oklch(0.92 0.01 274)
|
|
150
|
-
destructive: oklch(0.62 0.2 22)
|
|
151
|
-
destructive-foreground: oklch(0.15 0.02 22)
|
|
152
|
-
success: oklch(0.68 0.14 137)
|
|
153
|
-
warning: oklch(0.74 0.14 57)
|
|
154
|
-
border: oklch(0.26 0.01 274)
|
|
155
|
-
input: oklch(0.26 0.01 274)
|
|
156
|
-
ring: oklch(0.6 0.2 274)
|
|
157
|
-
surface-raised: oklch(0.21 0.01 274)
|
|
158
|
-
surface-overlay: oklch(0.25 0.012 274)
|
|
159
|
-
chart-1: oklch(0.6 0.2 274)
|
|
160
|
-
chart-2: oklch(0.7 0.12 195)
|
|
161
|
-
chart-3: oklch(0.72 0.17 350)
|
|
162
|
-
chart-4: oklch(0.72 0.14 150)
|
|
163
|
-
chart-5: oklch(0.82 0.14 90)
|
|
164
|
-
sidebar: oklch(0.02 0 0)
|
|
165
|
-
sidebar-foreground: oklch(0.94 0.006 270)
|
|
166
|
-
sidebar-primary: oklch(0.55 0.2 274)
|
|
167
|
-
sidebar-primary-foreground: oklch(0.98 0.01 274)
|
|
168
|
-
sidebar-accent: oklch(0.2 0.008 270)
|
|
169
|
-
sidebar-accent-foreground: oklch(0.94 0.006 270)
|
|
170
|
-
sidebar-border: oklch(0.24 0.008 270)
|
|
171
|
-
sidebar-ring: oklch(0.6 0.2 274)
|
|
172
|
-
typography:
|
|
173
|
-
display: { family: "Schibsted Grotesk Variable", fallback: "system-ui, sans-serif", weights: [500, 600] }
|
|
174
|
-
sans: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400, 500, 600] }
|
|
175
|
-
mono: { family: "JetBrains Mono Variable", fallback: "ui-monospace, monospace", weights: [400] }
|
|
176
|
-
ramp:
|
|
177
|
-
display: { size: 32px, line: 38px, weight: 600, family: display, tracking: -0.02em }
|
|
178
|
-
h1: { size: 28px, line: 34px, weight: 600, family: display, tracking: -0.015em }
|
|
179
|
-
h2: { size: 22px, line: 29px, weight: 600, family: display, tracking: -0.01em }
|
|
180
|
-
body: { size: 15px, line: 23px, weight: 400, family: sans, tracking: 0.01em }
|
|
181
|
-
small: { size: 13px, line: 18px, weight: 400, family: sans }
|
|
182
|
-
caption: { size: 12px, line: 15px, weight: 600, family: sans, tracking: 0.02em, transform: uppercase }
|
|
183
|
-
data: { size: 13px, line: 20px, weight: 400, family: mono, features: [tnum] }
|
|
184
|
-
register-scope: { display: [page-title, section-head, empty-state, auth], sans: [chrome, controls, body], mono: [data, amounts, ids, timestamps] }
|
|
185
|
-
elevation:
|
|
186
|
-
radius: { sm: 8px, md: 12px, lg: 20px }
|
|
187
|
-
hairline: border
|
|
188
|
-
shadow:
|
|
189
|
-
overlay: "0 8px 30px oklch(0.16 0.012 274 / 0.3)"
|
|
190
|
-
popover: "0 4px 16px oklch(0.16 0.012 274 / 0.22)"
|
|
191
|
-
dark-ladder: { background: 0.16, raised: 0.21, overlay: 0.25, hue-held: 274 }
|
|
192
|
-
motion:
|
|
193
|
-
duration: { press: 120ms, fade: 160ms, panel: 240ms }
|
|
194
|
-
easing: { standard: "cubic-bezier(0.2, 0, 0, 1)", exit: "cubic-bezier(0.4, 0, 1, 1)" }
|
|
195
|
-
entrance-never: ease-in
|
|
196
|
-
identity-moments: [auth, first-run-empty]
|
|
197
|
-
iconography: { set: lucide, stroke: 1.5px, grid: [16px, 20px] }
|
|
198
|
-
charts:
|
|
199
|
-
categorical: [chart-1, chart-2, chart-3, chart-4, chart-5]
|
|
200
|
-
sequential: { from: background, to: chart-1 }
|
|
201
|
-
diverging: { negative: destructive, mid: muted, positive: chart-4 }
|
|
202
|
-
layout: { base: 4px, sidebar: [256px, 56px], topbar: 64px, side-panel: [440px, 640px], content-max: 1320px }
|
|
203
|
-
```
|
|
@@ -1,203 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
schema: design-md/v2
|
|
3
|
-
id: runwayml
|
|
4
|
-
tier: brand
|
|
5
|
-
segments: [ai, creative-tools, video]
|
|
6
|
-
keywords: [dark, cinematic, monochrome, cool-slate, austere, spacious]
|
|
7
|
-
sourced: 2026-07-12
|
|
8
|
-
sources: "design-md/v1 runwayml entry (2026-07-04); 2026-07-12 re-audit of Runway public brand; DM Sans substitutes the single-family abcNormal, Geist Mono derived for IDs and logs; the brand is categorically dark with zero chromatic accent — the primary is monochrome contrast; a light alternate authored alongside"
|
|
9
|
-
license: open
|
|
10
|
-
---
|
|
11
|
-
|
|
12
|
-
# runwayml — a cinema grading suite, black room and one white key
|
|
13
|
-
|
|
14
|
-
## 1 Visual Theme
|
|
15
|
-
A film-grade grading suite: a black room, cool blue-gray slate for every neutral, and
|
|
16
|
-
an interface that retreats so the work can lead. Dark by default — the brand is
|
|
17
|
-
categorically dark, and the operator reading keeps it; a light alternate is authored
|
|
18
|
-
for surfaces that need one. Flat to austerity: hierarchy is dark/light polarity,
|
|
19
|
-
hairlines, and type weight, never shadow — the brand casts zero. There is no chromatic
|
|
20
|
-
accent; the one accent is monochrome contrast — white on dark, near-black on light. The
|
|
21
|
-
full-bleed photography and 40px hero stay behind.
|
|
22
|
-
|
|
23
|
-
## 2 Color Roles
|
|
24
|
-
White `foreground` on a black `background`; `primary` is a monochrome contrast, not a
|
|
25
|
-
hue — white on dark, near-black on light — held for the single primary action. `accent`
|
|
26
|
-
is a neutral cool-slate lift for selection and hover only. Borders stay whisper-faint.
|
|
27
|
-
There is no brand accent hue: color belongs to content, and the `chart-*` ramp is the
|
|
28
|
-
only place hues appear; status hues speak only status.
|
|
29
|
-
|
|
30
|
-
## 3 Typography
|
|
31
|
-
DM Sans (the open substitute for the single-family abcNormal) carries everything —
|
|
32
|
-
variety comes from size, weight, case, and tracking, never a second family — with Geist
|
|
33
|
-
Mono derived for IDs, codes, timestamps, and logs. Heads run quiet: weight 400 with
|
|
34
|
-
tight negative tracking, the film-title density; the range is 400-600 and never reaches
|
|
35
|
-
700. Uppercase micro-labels take positive tracking as navigational signposts. Register
|
|
36
|
-
scope: the display register speaks in page titles, section heads, empty states, and
|
|
37
|
-
auth; mono owns data, IDs, timestamps, and logs. Numerals are always `tabular-nums`.
|
|
38
|
-
|
|
39
|
-
## 4 Component Stylings
|
|
40
|
-
Buttons `radius-sm` (6px, never pill), monochrome `primary` fill; secondary is
|
|
41
|
-
`secondary` on a whisper-faint hairline. Inputs sit on `background` with a hairline;
|
|
42
|
-
focus draws the monochrome `ring` at 2px, no glow. Cards are `card` a step above the
|
|
43
|
-
canvas on a hairline, `radius-lg` (16px), never shadowed. Table rows carry faint
|
|
44
|
-
`border` grid lines, `muted` hover, `accent` selection. Detail opens in the side panel;
|
|
45
|
-
badges take `muted` or status fills, never `primary`.
|
|
46
|
-
|
|
47
|
-
## 5 Layout
|
|
48
|
-
8px base; sidebar 256/56px; topbar 56px; side panel 440/680px; content max 1440px.
|
|
49
|
-
Density is spacious — the brand breathes at cinema scale, and the operator reading keeps
|
|
50
|
-
the air; the 1600px cinema container stays behind.
|
|
51
|
-
|
|
52
|
-
## 6 Depth
|
|
53
|
-
Flat, emphatically — the brand uses zero shadows; depth is dark/light polarity and
|
|
54
|
-
hairlines. Dark: the surface ladder does depth — `background` 0.03 L, `surface-raised`
|
|
55
|
-
0.24, `surface-overlay` 0.29, hue held at 259; a hairline does most of the separating.
|
|
56
|
-
Light: the same austerity on a white floor, cool-silver hairlines carrying rank. The one
|
|
57
|
-
overlay shadow is a faint cool whisper. Focus is a monochrome `ring`, keyboard-first.
|
|
58
|
-
|
|
59
|
-
## 7 Motion
|
|
60
|
-
Unhurried but restrained. Named moments: `panel-slide` (side panel, 260ms,
|
|
61
|
-
interruptible), `fade-arrive` (page content, 200ms), `press` (primary-action press,
|
|
62
|
-
120ms). Physicality is granted only to auth and first-run empty states; nothing animates
|
|
63
|
-
in tables, the asset grid, or keyboard-initiated actions.
|
|
64
|
-
|
|
65
|
-
## 8 Iconography & Charts
|
|
66
|
-
Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default. Charts: hairline axes,
|
|
67
|
-
no gridline fills; the categorical ramp is a restrained cool-forward set — slate, blue,
|
|
68
|
-
teal, amber, violet (`chart-1..5`); sequential runs the monochrome canvas→ink; tooltips
|
|
69
|
-
on `surface-overlay` with mono numerals.
|
|
70
|
-
|
|
71
|
-
## 9 Voice
|
|
72
|
-
Cinematic-calm and spare: short declaratives, numbers plain, the interface never talks
|
|
73
|
-
over the work. "New generation" · "Nothing rendered yet — start from a prompt or an
|
|
74
|
-
image" · "This render exceeds your credits; add more or lower the resolution."
|
|
75
|
-
|
|
76
|
-
## 10 Do's & Don'ts
|
|
77
|
-
Do default to dark — the brand is categorically dark; light is the alternate, not the
|
|
78
|
-
base. Do reserve the monochrome `primary` for the single primary action. Do keep borders
|
|
79
|
-
whisper-faint and carry hierarchy with polarity and weight. Don't introduce a chromatic
|
|
80
|
-
accent — the interface is colorless by doctrine; color belongs to content. Don't use a
|
|
81
|
-
weight of 700+, a second typeface, or a pill. Don't signal elevation with shadow.
|
|
82
|
-
|
|
83
|
-
## 11 Responsive
|
|
84
|
-
375: sidebar → off-canvas drawer; side panel → full sheet; list+detail stacks. 768:
|
|
85
|
-
sidebar → icon rail; tables scroll their overflow. 1024: two-pane queue+detail holds.
|
|
86
|
-
1440: forms cap; tables and dashboards use the full width under the content cap.
|
|
87
|
-
|
|
88
|
-
## 12 Agent Prompt Guide
|
|
89
|
-
Default the shell to dark; the near-black room with cool-slate cards is the brand.
|
|
90
|
-
Carry hierarchy with dark/light polarity, hairlines, and weight — reach for shadow only
|
|
91
|
-
on a true overlay. The accent is monochrome contrast, not a hue; if two things want the
|
|
92
|
-
primary, one is not primary. Keep heads quiet at weight 400, tight negative tracking,
|
|
93
|
-
never past 600; uppercase micro-labels take positive tracking. Dark is authored —
|
|
94
|
-
consult the block, never derive.
|
|
95
|
-
|
|
96
|
-
```yaml design-values
|
|
97
|
-
color:
|
|
98
|
-
light:
|
|
99
|
-
background: oklch(0.995 0.002 259)
|
|
100
|
-
foreground: oklch(0.16 0.006 259)
|
|
101
|
-
card: oklch(0.995 0.002 259)
|
|
102
|
-
card-foreground: oklch(0.16 0.006 259)
|
|
103
|
-
popover: oklch(0.995 0.002 259)
|
|
104
|
-
popover-foreground: oklch(0.16 0.006 259)
|
|
105
|
-
primary: oklch(0.16 0.006 259)
|
|
106
|
-
primary-foreground: oklch(0.99 0.002 259)
|
|
107
|
-
secondary: oklch(0.943 0.009 264)
|
|
108
|
-
secondary-foreground: oklch(0.22 0.006 259)
|
|
109
|
-
muted: oklch(0.94 0.008 259)
|
|
110
|
-
muted-foreground: oklch(0.5 0.02 259)
|
|
111
|
-
accent: oklch(0.93 0.009 259)
|
|
112
|
-
accent-foreground: oklch(0.22 0.006 259)
|
|
113
|
-
destructive: oklch(0.544 0.186 26)
|
|
114
|
-
destructive-foreground: oklch(0.99 0.006 26)
|
|
115
|
-
success: oklch(0.553 0.107 158)
|
|
116
|
-
warning: oklch(0.626 0.125 70)
|
|
117
|
-
border: oklch(0.844 0.008 261)
|
|
118
|
-
input: oklch(0.844 0.008 261)
|
|
119
|
-
ring: oklch(0.16 0.006 259)
|
|
120
|
-
surface-raised: oklch(0.98 0.006 259)
|
|
121
|
-
surface-overlay: oklch(0.995 0.002 259)
|
|
122
|
-
chart-1: oklch(0.5 0.03 259)
|
|
123
|
-
chart-2: oklch(0.52 0.14 250)
|
|
124
|
-
chart-3: oklch(0.55 0.1 190)
|
|
125
|
-
chart-4: oklch(0.6 0.13 70)
|
|
126
|
-
chart-5: oklch(0.5 0.15 295)
|
|
127
|
-
sidebar: oklch(0.98 0.005 260)
|
|
128
|
-
sidebar-foreground: oklch(0.2 0.006 259)
|
|
129
|
-
sidebar-primary: oklch(0.16 0.006 259)
|
|
130
|
-
sidebar-primary-foreground: oklch(0.99 0.002 259)
|
|
131
|
-
sidebar-accent: oklch(0.93 0.009 259)
|
|
132
|
-
sidebar-accent-foreground: oklch(0.22 0.006 259)
|
|
133
|
-
sidebar-border: oklch(0.85 0.008 261)
|
|
134
|
-
sidebar-ring: oklch(0.16 0.006 259)
|
|
135
|
-
dark:
|
|
136
|
-
background: oklch(0.03 0.004 259)
|
|
137
|
-
foreground: oklch(0.98 0.002 259)
|
|
138
|
-
card: oklch(0.22 0.006 259)
|
|
139
|
-
card-foreground: oklch(0.98 0.002 259)
|
|
140
|
-
popover: oklch(0.25 0.006 259)
|
|
141
|
-
popover-foreground: oklch(0.98 0.002 259)
|
|
142
|
-
primary: oklch(0.98 0.002 259)
|
|
143
|
-
primary-foreground: oklch(0.05 0.006 259)
|
|
144
|
-
secondary: oklch(0.27 0.006 259)
|
|
145
|
-
secondary-foreground: oklch(0.95 0.004 259)
|
|
146
|
-
muted: oklch(0.27 0.006 259)
|
|
147
|
-
muted-foreground: oklch(0.72 0.016 259)
|
|
148
|
-
accent: oklch(0.28 0.006 259)
|
|
149
|
-
accent-foreground: oklch(0.95 0.004 259)
|
|
150
|
-
destructive: oklch(0.626 0.193 23)
|
|
151
|
-
destructive-foreground: oklch(0.15 0.02 23)
|
|
152
|
-
success: oklch(0.651 0.147 147)
|
|
153
|
-
warning: oklch(0.74 0.131 81)
|
|
154
|
-
border: oklch(0.27 0.006 259)
|
|
155
|
-
input: oklch(0.27 0.006 259)
|
|
156
|
-
ring: oklch(0.98 0.002 259)
|
|
157
|
-
surface-raised: oklch(0.24 0.006 259)
|
|
158
|
-
surface-overlay: oklch(0.29 0.006 259)
|
|
159
|
-
chart-1: oklch(0.72 0.03 259)
|
|
160
|
-
chart-2: oklch(0.62 0.14 250)
|
|
161
|
-
chart-3: oklch(0.68 0.1 190)
|
|
162
|
-
chart-4: oklch(0.72 0.13 70)
|
|
163
|
-
chart-5: oklch(0.6 0.15 295)
|
|
164
|
-
sidebar: oklch(0.05 0.004 259)
|
|
165
|
-
sidebar-foreground: oklch(0.95 0.004 259)
|
|
166
|
-
sidebar-primary: oklch(0.98 0.002 259)
|
|
167
|
-
sidebar-primary-foreground: oklch(0.05 0.006 259)
|
|
168
|
-
sidebar-accent: oklch(0.24 0.006 259)
|
|
169
|
-
sidebar-accent-foreground: oklch(0.95 0.004 259)
|
|
170
|
-
sidebar-border: oklch(0.22 0.006 259)
|
|
171
|
-
sidebar-ring: oklch(0.98 0.002 259)
|
|
172
|
-
typography:
|
|
173
|
-
display: { family: "DM Sans Variable", fallback: "system-ui, sans-serif", weights: [400, 500] }
|
|
174
|
-
sans: { family: "DM Sans Variable", fallback: "system-ui, sans-serif", weights: [400, 500, 600] }
|
|
175
|
-
mono: { family: "Geist Mono Variable", fallback: "ui-monospace, monospace", weights: [400] }
|
|
176
|
-
ramp:
|
|
177
|
-
display: { size: 40px, line: 42px, weight: 400, family: display, tracking: -0.02em }
|
|
178
|
-
h1: { size: 28px, line: 32px, weight: 400, family: display, tracking: -0.02em }
|
|
179
|
-
h2: { size: 22px, line: 27px, weight: 400, family: display, tracking: -0.015em }
|
|
180
|
-
body: { size: 16px, line: 23px, weight: 400, family: sans, tracking: -0.005em }
|
|
181
|
-
small: { size: 13px, line: 18px, weight: 400, family: sans }
|
|
182
|
-
caption: { size: 13px, line: 17px, weight: 600, family: sans, tracking: 0.02em, transform: uppercase }
|
|
183
|
-
data: { size: 13px, line: 20px, weight: 400, family: mono, features: [tnum] }
|
|
184
|
-
register-scope: { display: [page-title, section-head, empty-state, auth], sans: [chrome, controls, body], mono: [data, ids, timestamps, logs] }
|
|
185
|
-
elevation:
|
|
186
|
-
radius: { sm: 6px, md: 10px, lg: 16px }
|
|
187
|
-
hairline: border
|
|
188
|
-
shadow:
|
|
189
|
-
overlay: "0 8px 30px oklch(0.06 0.012 259 / 0.5)"
|
|
190
|
-
popover: "0 4px 16px oklch(0.06 0.012 259 / 0.4)"
|
|
191
|
-
dark-ladder: { background: 0.03, raised: 0.24, overlay: 0.29, hue-held: 259 }
|
|
192
|
-
motion:
|
|
193
|
-
duration: { press: 120ms, fade: 200ms, panel: 260ms }
|
|
194
|
-
easing: { standard: "cubic-bezier(0.2, 0, 0, 1)", exit: "cubic-bezier(0.4, 0, 1, 1)" }
|
|
195
|
-
entrance-never: ease-in
|
|
196
|
-
identity-moments: [auth, first-run-empty]
|
|
197
|
-
iconography: { set: lucide, stroke: 1.5px, grid: [16px, 20px] }
|
|
198
|
-
charts:
|
|
199
|
-
categorical: [chart-1, chart-2, chart-3, chart-4, chart-5]
|
|
200
|
-
sequential: { from: background, to: foreground }
|
|
201
|
-
diverging: { negative: destructive, mid: muted, positive: chart-2 }
|
|
202
|
-
layout: { base: 8px, sidebar: [256px, 56px], topbar: 56px, side-panel: [440px, 680px], content-max: 1440px }
|
|
203
|
-
```
|
|
@@ -1,200 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
schema: design-md/v2
|
|
3
|
-
id: sanity
|
|
4
|
-
tier: brand
|
|
5
|
-
segments: [dev-tools, cms, content-ops]
|
|
6
|
-
keywords: [dark, near-black, achromatic, coral, electric-blue, mono, dense]
|
|
7
|
-
sourced: 2026-07-12
|
|
8
|
-
sources: "design-md/v1 library entry (2026-07-04); 2026-07-12 brand re-audit; waldenburgNormal → Space Grotesk Variable substitution (v1-documented geometric-condensed stand-in), IBM Plex Mono carried as the brand's real mono"
|
|
9
|
-
license: open
|
|
10
|
-
---
|
|
11
|
-
|
|
12
|
-
# sanity — a nocturnal content control room, signal lights on near-black
|
|
13
|
-
|
|
14
|
-
## 1 Visual Theme
|
|
15
|
-
A control room after the building has gone dark: near-black consoles, silver
|
|
16
|
-
readouts, a coral standby lamp resting on one panel while an electric-blue trace
|
|
17
|
-
runs the wires that are live. Dark is the primary identity — the `#0b0b0b` canvas
|
|
18
|
-
is the floor, not a mode toggle; a full near-white daytime theme is authored beside
|
|
19
|
-
it for completeness. Effectively achromatic: the whisper of cool tint on every
|
|
20
|
-
neutral is beneath perception, and hierarchy is a surface ladder, never a shadow.
|
|
21
|
-
|
|
22
|
-
## 2 Color Roles
|
|
23
|
-
Silver `foreground` on the near-black `background`. Two signals held to strict
|
|
24
|
-
roles: coral `primary` is the one resting call-to-action, electric-blue `ring` is
|
|
25
|
-
the activation trace — focus, and the sidebar's active-nav marker — and the two
|
|
26
|
-
never meet in one element. `accent` is a neutral colorimetric step for hover and
|
|
27
|
-
selection, never a hue wash. The `sidebar` runs the near-black control panel in
|
|
28
|
-
both themes. Status hues speak only status; the neon green and magenta survive as
|
|
29
|
-
chart voltage.
|
|
30
|
-
|
|
31
|
-
## 3 Typography
|
|
32
|
-
Space Grotesk (chrome and display, substituting waldenburgNormal) / IBM Plex Mono
|
|
33
|
-
(data). Register scope: the geometric sans carries every title, control, cell, and
|
|
34
|
-
byline at tight negative tracking, weight 500 the ceiling — the brand never bolds
|
|
35
|
-
past it; the mono owns IDs, codes, timestamps, log lines, and the uppercase tag
|
|
36
|
-
register. Numerals are always `tabular-nums`; emphasis bumps weight, never size.
|
|
37
|
-
|
|
38
|
-
## 4 Component Stylings
|
|
39
|
-
Buttons `radius-sm`, coral `primary` fill or a `secondary` step with a hairline,
|
|
40
|
-
never a pill; inputs on the `input` hairline with the electric-blue `ring` at 2px,
|
|
41
|
-
no glow; cards are the elevated surface lifted off the canvas on a hairline, never
|
|
42
|
-
shadowed; table rows `muted` hover, `accent` selection with a coral left-indicator;
|
|
43
|
-
detail opens in the side panel beside the work; badges pill with uppercase mono
|
|
44
|
-
captions, status fills only.
|
|
45
|
-
|
|
46
|
-
## 5 Layout
|
|
47
|
-
8px base; sidebar 248/56px; topbar 52px — the tight console band; side panel
|
|
48
|
-
420/640px; content max 1440px; density dense, the marketing rhythm left behind.
|
|
49
|
-
|
|
50
|
-
## 6 Depth
|
|
51
|
-
Flat and colorimetric. Dark: the ladder does the work — `background` 0.15 L,
|
|
52
|
-
`surface-raised` +0.06, `surface-overlay` +0.14, hue held at 265; hairlines carry
|
|
53
|
-
every edge, coral marks selection, the blue ring marks focus. A faint navy-tinted
|
|
54
|
-
ring lifts a true overlay only; no offset drop shadows. Light: hairlines carry
|
|
55
|
-
structure, the near-black sidebar the one dark region.
|
|
56
|
-
|
|
57
|
-
## 7 Motion
|
|
58
|
-
Reserved and mechanical. Named moments: `panel-slide` (side panel, 220ms,
|
|
59
|
-
interruptible), `fade-arrive` (page content, 150ms), `signal-press` (primary
|
|
60
|
-
press, 100ms). Physicality granted only to auth and first-run empty states; tables,
|
|
61
|
-
the log stream, and keyboard actions are instant.
|
|
62
|
-
|
|
63
|
-
## 8 Iconography & Charts
|
|
64
|
-
Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default. Charts: hairline
|
|
65
|
-
axes, no gridline fills; the signal palette returns here — coral, electric blue,
|
|
66
|
-
neon green, magenta, amber categorical (`chart-1..5`); monochrome sequential
|
|
67
|
-
canvas→blue; tooltips on `surface-overlay` with mono numerals.
|
|
68
|
-
|
|
69
|
-
## 9 Voice
|
|
70
|
-
System-readout terse: lowercase-plain sentences, exact counts, no exclamation.
|
|
71
|
-
"Publish" · "Queue clear — last document synced 4m ago" · "Draft failed schema
|
|
72
|
-
validation on 2 fields; publishing is blocked."
|
|
73
|
-
|
|
74
|
-
## 10 Do's & Don'ts
|
|
75
|
-
Do anchor every surface on the near-black canvas and keep the neutral ramp cool and
|
|
76
|
-
quiet. Do spend coral once — one resting action per surface — and let the blue ring
|
|
77
|
-
own activation. Don't mix the two signals in one element. Don't promote neon green
|
|
78
|
-
or magenta out of charts. Don't pill a control, bold past 500, or signal elevation
|
|
79
|
-
with a drop shadow.
|
|
80
|
-
|
|
81
|
-
## 11 Responsive
|
|
82
|
-
375: sidebar → off-canvas drawer, side panel → full sheet, list+detail stacks. 768:
|
|
83
|
-
sidebar → icon rail; tables scroll overflow. 1024/1440: two-pane queue+detail holds;
|
|
84
|
-
forms cap, log streams and dashboards run the full width.
|
|
85
|
-
|
|
86
|
-
## 12 Agent Prompt Guide
|
|
87
|
-
Anchor on the near-black canvas; the light theme is the daytime counterpart, never
|
|
88
|
-
the home. Two signals, strict roles: coral is the one resting action, blue is focus
|
|
89
|
-
and active-nav — if they meet, one is wrong. Every ID, code, and tag rides IBM Plex
|
|
90
|
-
Mono; the sans caps at weight 500. Depth is surface and hairline — consult the
|
|
91
|
-
block, never derive dark from light.
|
|
92
|
-
|
|
93
|
-
```yaml design-values
|
|
94
|
-
color:
|
|
95
|
-
light:
|
|
96
|
-
background: oklch(0.985 0.005 265)
|
|
97
|
-
foreground: oklch(0.22 0.006 265)
|
|
98
|
-
card: oklch(0.995 0.004 265)
|
|
99
|
-
card-foreground: oklch(0.22 0.006 265)
|
|
100
|
-
popover: oklch(0.995 0.004 265)
|
|
101
|
-
popover-foreground: oklch(0.22 0.006 265)
|
|
102
|
-
primary: oklch(0.66 0.183 27.5)
|
|
103
|
-
primary-foreground: oklch(1 0 27.5)
|
|
104
|
-
secondary: oklch(0.96 0.006 265)
|
|
105
|
-
secondary-foreground: oklch(0.28 0.006 265)
|
|
106
|
-
muted: oklch(0.96 0.006 265)
|
|
107
|
-
muted-foreground: oklch(0.5 0.008 265)
|
|
108
|
-
accent: oklch(0.945 0.006 265)
|
|
109
|
-
accent-foreground: oklch(0.26 0.006 265)
|
|
110
|
-
destructive: oklch(0.55 0.221 29.2)
|
|
111
|
-
destructive-foreground: oklch(0.985 0.012 29.2)
|
|
112
|
-
success: oklch(0.58 0.14 157)
|
|
113
|
-
warning: oklch(0.7 0.15 70.1)
|
|
114
|
-
border: oklch(0.9 0.006 265)
|
|
115
|
-
input: oklch(0.9 0.006 265)
|
|
116
|
-
ring: oklch(0.513 0.244 262.4)
|
|
117
|
-
surface-raised: oklch(0.99 0.004 265)
|
|
118
|
-
surface-overlay: oklch(0.995 0.004 265)
|
|
119
|
-
chart-1: oklch(0.6 0.19 27.5)
|
|
120
|
-
chart-2: oklch(0.513 0.244 262.4)
|
|
121
|
-
chart-3: oklch(0.6 0.19 142.1)
|
|
122
|
-
chart-4: oklch(0.6 0.27 326.2)
|
|
123
|
-
chart-5: oklch(0.65 0.16 70.1)
|
|
124
|
-
sidebar: oklch(0.2 0.006 265)
|
|
125
|
-
sidebar-foreground: oklch(0.9 0.005 265)
|
|
126
|
-
sidebar-primary: oklch(0.58 0.22 262.4)
|
|
127
|
-
sidebar-primary-foreground: oklch(0.98 0.01 262.4)
|
|
128
|
-
sidebar-accent: oklch(0.27 0.006 265)
|
|
129
|
-
sidebar-accent-foreground: oklch(0.9 0.005 265)
|
|
130
|
-
sidebar-border: oklch(0.29 0.006 265)
|
|
131
|
-
sidebar-ring: oklch(0.58 0.22 262.4)
|
|
132
|
-
dark:
|
|
133
|
-
background: oklch(0.15 0.006 265)
|
|
134
|
-
foreground: oklch(0.98 0.004 265)
|
|
135
|
-
card: oklch(0.248 0.006 265)
|
|
136
|
-
card-foreground: oklch(0.98 0.004 265)
|
|
137
|
-
popover: oklch(0.29 0.006 265)
|
|
138
|
-
popover-foreground: oklch(0.98 0.004 265)
|
|
139
|
-
primary: oklch(0.682 0.178 27.5)
|
|
140
|
-
primary-foreground: oklch(1 0 27.5)
|
|
141
|
-
secondary: oklch(0.248 0.006 265)
|
|
142
|
-
secondary-foreground: oklch(0.9 0.005 265)
|
|
143
|
-
muted: oklch(0.248 0.006 265)
|
|
144
|
-
muted-foreground: oklch(0.75 0.006 265)
|
|
145
|
-
accent: oklch(0.329 0.006 265)
|
|
146
|
-
accent-foreground: oklch(0.9 0.005 265)
|
|
147
|
-
destructive: oklch(0.6 0.221 29.2)
|
|
148
|
-
destructive-foreground: oklch(0.98 0.012 29.2)
|
|
149
|
-
success: oklch(0.754 0.163 156.9)
|
|
150
|
-
warning: oklch(0.769 0.165 70.1)
|
|
151
|
-
border: oklch(0.329 0.006 265)
|
|
152
|
-
input: oklch(0.329 0.006 265)
|
|
153
|
-
ring: oklch(0.58 0.22 262.4)
|
|
154
|
-
surface-raised: oklch(0.21 0.006 265)
|
|
155
|
-
surface-overlay: oklch(0.29 0.006 265)
|
|
156
|
-
chart-1: oklch(0.682 0.178 27.5)
|
|
157
|
-
chart-2: oklch(0.58 0.22 262.4)
|
|
158
|
-
chart-3: oklch(0.761 0.256 142.1)
|
|
159
|
-
chart-4: oklch(0.687 0.319 326.2)
|
|
160
|
-
chart-5: oklch(0.769 0.165 70.1)
|
|
161
|
-
sidebar: oklch(0.13 0.006 265)
|
|
162
|
-
sidebar-foreground: oklch(0.9 0.005 265)
|
|
163
|
-
sidebar-primary: oklch(0.58 0.22 262.4)
|
|
164
|
-
sidebar-primary-foreground: oklch(0.98 0.01 262.4)
|
|
165
|
-
sidebar-accent: oklch(0.2 0.006 265)
|
|
166
|
-
sidebar-accent-foreground: oklch(0.9 0.005 265)
|
|
167
|
-
sidebar-border: oklch(0.24 0.006 265)
|
|
168
|
-
sidebar-ring: oklch(0.58 0.22 262.4)
|
|
169
|
-
typography:
|
|
170
|
-
display: { family: "Space Grotesk Variable", fallback: "system-ui, sans-serif", weights: [400, 500] }
|
|
171
|
-
sans: { family: "Space Grotesk Variable", fallback: "system-ui, sans-serif", weights: [400, 500] }
|
|
172
|
-
mono: { family: "IBM Plex Mono", fallback: "ui-monospace, monospace", weights: [400, 500] }
|
|
173
|
-
ramp:
|
|
174
|
-
display: { size: 28px, line: 34px, weight: 500, family: display, tracking: -0.02em }
|
|
175
|
-
h1: { size: 24px, line: 30px, weight: 500, family: sans, tracking: -0.02em }
|
|
176
|
-
h2: { size: 20px, line: 26px, weight: 500, family: sans, tracking: -0.01em }
|
|
177
|
-
body: { size: 15px, line: 22px, weight: 400, family: sans }
|
|
178
|
-
small: { size: 13px, line: 18px, weight: 400, family: sans }
|
|
179
|
-
caption: { size: 12px, line: 16px, weight: 500, family: mono, tracking: 0.04em, transform: uppercase }
|
|
180
|
-
data: { size: 13px, line: 20px, weight: 400, family: mono, features: [tnum] }
|
|
181
|
-
register-scope: { display: [page-title, empty-state], sans: [chrome, controls, body, headings], mono: [data, ids, timestamps, tags] }
|
|
182
|
-
elevation:
|
|
183
|
-
radius: { sm: 6px, md: 8px, lg: 12px }
|
|
184
|
-
hairline: border
|
|
185
|
-
shadow:
|
|
186
|
-
overlay: "0 8px 30px oklch(0.12 0.02 265 / 0.5)"
|
|
187
|
-
popover: "0 4px 16px oklch(0.12 0.02 265 / 0.4)"
|
|
188
|
-
dark-ladder: { background: 0.15, raised: 0.21, overlay: 0.29, hue-held: 265 }
|
|
189
|
-
motion:
|
|
190
|
-
duration: { press: 100ms, fade: 150ms, panel: 220ms }
|
|
191
|
-
easing: { standard: "cubic-bezier(0.2, 0, 0, 1)", exit: "cubic-bezier(0.4, 0, 1, 1)" }
|
|
192
|
-
entrance-never: ease-in
|
|
193
|
-
identity-moments: [auth, first-run-empty]
|
|
194
|
-
iconography: { set: lucide, stroke: 1.5px, grid: [16px, 20px] }
|
|
195
|
-
charts:
|
|
196
|
-
categorical: [chart-1, chart-2, chart-3, chart-4, chart-5]
|
|
197
|
-
sequential: { from: background, to: chart-2 }
|
|
198
|
-
diverging: { negative: destructive, mid: muted, positive: success }
|
|
199
|
-
layout: { base: 8px, sidebar: [248px, 56px], topbar: 52px, side-panel: [420px, 640px], content-max: 1440px }
|
|
200
|
-
```
|