@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: wise
|
|
4
|
-
tier: brand
|
|
5
|
-
segments: [fintech, payments, remittance]
|
|
6
|
-
keywords: [lime, sage, friendly, rounded, forest, money]
|
|
7
|
-
sourced: 2026-07-12
|
|
8
|
-
sources: "design-md/v1 library entry (2026-07-04); 2026-07-12 brand re-audit; Wise Sans (proprietary display) stays behind per v1 — Inter Variable is the brand's own workhorse; JetBrains Mono Variable for data"
|
|
9
|
-
license: open
|
|
10
|
-
---
|
|
11
|
-
|
|
12
|
-
# wise — a Scandinavian bank lobby in spring
|
|
13
|
-
|
|
14
|
-
## 1 Visual Theme
|
|
15
|
-
A Scandinavian bank lobby in spring: sage-painted walls, blond wood counters, white
|
|
16
|
-
paper forms, and one lime-green door that is obviously the way in. Light default;
|
|
17
|
-
the defining move is the surface ladder — white cards lifting off the warm sage
|
|
18
|
-
canvas by contrast, not shadow. Dark is the same lobby after close: a deep
|
|
19
|
-
forest-green ladder with the lime door still lit. Friendly-rounded, honest density;
|
|
20
|
-
one accent, disciplined hard.
|
|
21
|
-
|
|
22
|
-
## 2 Color Roles
|
|
23
|
-
Near-black olive `foreground` on sage; white `card` is the elevation. Lime
|
|
24
|
-
`primary` is the one action, the active-nav mark, the brand mark — nowhere else,
|
|
25
|
-
and always with olive ink on it, never white. The `ring` is deep forest — lime is
|
|
26
|
-
too light to read as a ring. Two greens stay apart: lime acts, the truer `success`
|
|
27
|
-
green reports. `input` is deliberately ink — the bold-edged field is the form
|
|
28
|
-
signature. Orange and cyan are chart graces only.
|
|
29
|
-
|
|
30
|
-
## 3 Typography
|
|
31
|
-
Inter (text — the brand's real workhorse; the weight-900 Wise Sans display stays
|
|
32
|
-
behind) / JetBrains Mono (data). Register scope: the sans carries display through
|
|
33
|
-
label, semibold 600 the heading weight; the mono owns IDs, reference codes, and
|
|
34
|
-
timestamps. Body holds a generous 16px — money reading needs air; every amount and
|
|
35
|
-
numeric column is `tabular-nums`, non-negotiable in a money product.
|
|
36
|
-
|
|
37
|
-
## 4 Component Stylings
|
|
38
|
-
Buttons `radius-md` (12px, rounded but never the marketing pill), lime `primary`
|
|
39
|
-
with olive label; inputs white fill with the 1px ink `input` edge and forest `ring`
|
|
40
|
-
focus; cards white on sage by contrast, `radius-lg` for feature cards; table rows
|
|
41
|
-
sage hairline grid, `muted` hover, pale-green `accent` selection; detail in the
|
|
42
|
-
side panel; badges pill — the positive badge is pale-green `accent` fill with
|
|
43
|
-
forest text.
|
|
44
|
-
|
|
45
|
-
## 5 Layout
|
|
46
|
-
4px base; sidebar 256/56px; topbar 56px; side panel 440/640px; content max 1360px;
|
|
47
|
-
density standard — the brand breathes; amount columns right-aligned always.
|
|
48
|
-
|
|
49
|
-
## 6 Depth
|
|
50
|
-
Light: the sage/white ladder is the depth system — contrast, then hairline, shadow
|
|
51
|
-
only on true overlays, forest-tinted. Dark: the authored forest ladder —
|
|
52
|
-
`background` 0.18 L, `surface-raised` +0.05, `surface-overlay` +0.10, hue held at
|
|
53
|
-
135 — lime holding its exact chroma across both themes.
|
|
54
|
-
|
|
55
|
-
## 7 Motion
|
|
56
|
-
Warm and settled. Named moments: `panel-slide` (side panel, 240ms, interruptible),
|
|
57
|
-
`card-lift` (card arrive, 160ms fade), `press` (lime action, 110ms). Physicality
|
|
58
|
-
granted to auth and the first-run empty state — the one confetti-free celebration;
|
|
59
|
-
tables and amounts never animate.
|
|
60
|
-
|
|
61
|
-
## 8 Iconography & Charts
|
|
62
|
-
Lucide, 1.75px stroke — slightly warm-bold to match the rounded chrome — 16/20px
|
|
63
|
-
grid, `muted-foreground` default. Charts: hairline axes; categorical runs forest,
|
|
64
|
-
cyan, amber-orange, lime, warm gold (`chart-1..5`); sequential sage→forest;
|
|
65
|
-
diverging red→sage→green; tooltips on `surface-overlay` with mono amounts.
|
|
66
|
-
|
|
67
|
-
## 9 Voice
|
|
68
|
-
Plain-spoken money: no jargon, fees and dates stated exactly, warmth without
|
|
69
|
-
exclamation. "Send transfer" · "Nothing needs your attention — 2 transfers arrive
|
|
70
|
-
Tuesday" · "This payout exceeds the daily limit; it will complete tomorrow at
|
|
71
|
-
09:00."
|
|
72
|
-
|
|
73
|
-
## 10 Do's & Don'ts
|
|
74
|
-
Do anchor on the sage/white ladder — white cards on sage IS the elevation. Do keep
|
|
75
|
-
olive ink on every lime fill, and keep the two greens apart. Don't wash a selected
|
|
76
|
-
row in lime — selection is the pale-green `accent`. Don't pair lime with a green
|
|
77
|
-
surface — lime sits on neutral only. Don't sharpen corners, shadow cards, or reach
|
|
78
|
-
for the 900-weight display.
|
|
79
|
-
|
|
80
|
-
## 11 Responsive
|
|
81
|
-
375: sidebar → off-canvas drawer, side panel → full sheet, amount tables scroll
|
|
82
|
-
horizontally. 768: sidebar → icon rail; tables scroll overflow. 1024/1440: two-pane
|
|
83
|
-
queue+detail holds; forms cap, the sage canvas widens around the 1360px measure.
|
|
84
|
-
|
|
85
|
-
## 12 Agent Prompt Guide
|
|
86
|
-
Lead with the queue table on sage, white cards for what matters. Spend lime once —
|
|
87
|
-
if two things want it, one is not primary; the ring is always forest. Amounts in
|
|
88
|
-
`tabular-nums`, IDs in the mono, black-edged inputs. Dark is the forest lobby after
|
|
89
|
-
close — consult the block, never invert the sage.
|
|
90
|
-
|
|
91
|
-
```yaml design-values
|
|
92
|
-
color:
|
|
93
|
-
light:
|
|
94
|
-
background: oklch(0.936 0.007 132)
|
|
95
|
-
foreground: oklch(0.17 0.008 130)
|
|
96
|
-
card: oklch(0.99 0.005 132)
|
|
97
|
-
card-foreground: oklch(0.17 0.008 130)
|
|
98
|
-
popover: oklch(0.99 0.005 132)
|
|
99
|
-
popover-foreground: oklch(0.17 0.008 130)
|
|
100
|
-
primary: oklch(0.857 0.17 135)
|
|
101
|
-
primary-foreground: oklch(0.17 0.008 130)
|
|
102
|
-
secondary: oklch(0.905 0.01 132)
|
|
103
|
-
secondary-foreground: oklch(0.22 0.008 130)
|
|
104
|
-
muted: oklch(0.95 0.01 130)
|
|
105
|
-
muted-foreground: oklch(0.42 0.008 140)
|
|
106
|
-
accent: oklch(0.95 0.048 133)
|
|
107
|
-
accent-foreground: oklch(0.32 0.084 135)
|
|
108
|
-
destructive: oklch(0.55 0.19 24)
|
|
109
|
-
destructive-foreground: oklch(0.985 0.008 24)
|
|
110
|
-
success: oklch(0.6 0.16 147)
|
|
111
|
-
warning: oklch(0.59 0.14 61)
|
|
112
|
-
border: oklch(0.877 0.009 135)
|
|
113
|
-
input: oklch(0.17 0.008 130)
|
|
114
|
-
ring: oklch(0.29 0.084 135)
|
|
115
|
-
surface-raised: oklch(0.955 0.008 132)
|
|
116
|
-
surface-overlay: oklch(0.99 0.005 132)
|
|
117
|
-
chart-1: oklch(0.4 0.09 135)
|
|
118
|
-
chart-2: oklch(0.6 0.12 229)
|
|
119
|
-
chart-3: oklch(0.66 0.13 58)
|
|
120
|
-
chart-4: oklch(0.7 0.15 135)
|
|
121
|
-
chart-5: oklch(0.62 0.12 80)
|
|
122
|
-
sidebar: oklch(0.985 0.005 132)
|
|
123
|
-
sidebar-foreground: oklch(0.17 0.008 130)
|
|
124
|
-
sidebar-primary: oklch(0.857 0.17 135)
|
|
125
|
-
sidebar-primary-foreground: oklch(0.17 0.008 130)
|
|
126
|
-
sidebar-accent: oklch(0.94 0.03 133)
|
|
127
|
-
sidebar-accent-foreground: oklch(0.25 0.05 135)
|
|
128
|
-
sidebar-border: oklch(0.9 0.008 133)
|
|
129
|
-
sidebar-ring: oklch(0.29 0.084 135)
|
|
130
|
-
dark:
|
|
131
|
-
background: oklch(0.18 0.012 135)
|
|
132
|
-
foreground: oklch(0.93 0.01 130)
|
|
133
|
-
card: oklch(0.22 0.014 135)
|
|
134
|
-
card-foreground: oklch(0.93 0.01 130)
|
|
135
|
-
popover: oklch(0.28 0.016 135)
|
|
136
|
-
popover-foreground: oklch(0.93 0.01 130)
|
|
137
|
-
primary: oklch(0.857 0.17 135)
|
|
138
|
-
primary-foreground: oklch(0.17 0.012 135)
|
|
139
|
-
secondary: oklch(0.26 0.016 135)
|
|
140
|
-
secondary-foreground: oklch(0.9 0.01 130)
|
|
141
|
-
muted: oklch(0.25 0.015 135)
|
|
142
|
-
muted-foreground: oklch(0.7 0.015 135)
|
|
143
|
-
accent: oklch(0.3 0.04 135)
|
|
144
|
-
accent-foreground: oklch(0.88 0.06 133)
|
|
145
|
-
destructive: oklch(0.62 0.19 25)
|
|
146
|
-
destructive-foreground: oklch(0.12 0.02 25)
|
|
147
|
-
success: oklch(0.7 0.16 147)
|
|
148
|
-
warning: oklch(0.72 0.13 65)
|
|
149
|
-
border: oklch(0.29 0.016 135)
|
|
150
|
-
input: oklch(0.5 0.02 135)
|
|
151
|
-
ring: oklch(0.857 0.17 135)
|
|
152
|
-
surface-raised: oklch(0.23 0.014 135)
|
|
153
|
-
surface-overlay: oklch(0.28 0.016 135)
|
|
154
|
-
chart-1: oklch(0.66 0.11 135)
|
|
155
|
-
chart-2: oklch(0.72 0.13 229)
|
|
156
|
-
chart-3: oklch(0.75 0.13 58)
|
|
157
|
-
chart-4: oklch(0.857 0.17 135)
|
|
158
|
-
chart-5: oklch(0.74 0.12 80)
|
|
159
|
-
sidebar: oklch(0.16 0.012 135)
|
|
160
|
-
sidebar-foreground: oklch(0.91 0.01 130)
|
|
161
|
-
sidebar-primary: oklch(0.857 0.17 135)
|
|
162
|
-
sidebar-primary-foreground: oklch(0.16 0.012 135)
|
|
163
|
-
sidebar-accent: oklch(0.22 0.014 135)
|
|
164
|
-
sidebar-accent-foreground: oklch(0.9 0.01 130)
|
|
165
|
-
sidebar-border: oklch(0.23 0.014 135)
|
|
166
|
-
sidebar-ring: oklch(0.857 0.17 135)
|
|
167
|
-
typography:
|
|
168
|
-
display: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [600] }
|
|
169
|
-
sans: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400, 500, 600] }
|
|
170
|
-
mono: { family: "JetBrains Mono Variable", fallback: "ui-monospace, monospace", weights: [400] }
|
|
171
|
-
ramp:
|
|
172
|
-
display: { size: 32px, line: 38px, weight: 600, family: sans, tracking: -0.015em }
|
|
173
|
-
h1: { size: 28px, line: 34px, weight: 600, family: sans, tracking: -0.015em }
|
|
174
|
-
h2: { size: 22px, line: 29px, weight: 600, family: sans, tracking: -0.01em }
|
|
175
|
-
body: { size: 16px, line: 24px, weight: 400, family: sans }
|
|
176
|
-
small: { size: 14px, line: 20px, weight: 400, family: sans }
|
|
177
|
-
caption: { size: 12px, line: 16px, weight: 400, family: sans }
|
|
178
|
-
data: { size: 16px, line: 22px, weight: 400, family: mono, features: [tnum] }
|
|
179
|
-
register-scope: { display: [page-title, empty-state, auth], sans: [chrome, controls, body], mono: [data, ids, timestamps, amounts] }
|
|
180
|
-
elevation:
|
|
181
|
-
radius: { sm: 6px, md: 12px, lg: 16px }
|
|
182
|
-
hairline: border
|
|
183
|
-
shadow:
|
|
184
|
-
overlay: "0 8px 30px oklch(0.29 0.084 135 / 0.16)"
|
|
185
|
-
popover: "0 4px 16px oklch(0.29 0.084 135 / 0.12)"
|
|
186
|
-
dark-ladder: { background: 0.18, raised: 0.23, overlay: 0.28, hue-held: 135 }
|
|
187
|
-
motion:
|
|
188
|
-
duration: { press: 110ms, fade: 160ms, panel: 240ms }
|
|
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, first-run-empty]
|
|
192
|
-
iconography: { set: lucide, stroke: 1.75px, 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: background, positive: success }
|
|
197
|
-
layout: { base: 4px, sidebar: [256px, 56px], topbar: 56px, side-panel: [440px, 640px], content-max: 1360px }
|
|
198
|
-
```
|
|
@@ -1,199 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
schema: design-md/v2
|
|
3
|
-
id: x-ai
|
|
4
|
-
tier: brand
|
|
5
|
-
segments: [ai-platform, model-ops, research]
|
|
6
|
-
keywords: [dark, cosmic, sunset-orange, pill, sparse, mono-caps]
|
|
7
|
-
sourced: 2026-07-12
|
|
8
|
-
sources: "design-md/v1 library entry (2026-07-04); 2026-07-12 brand re-audit restoring the cosmic near-black as the primary mood (v1's light reading survives as the daytime theme); Universal Sans → Inter Variable substitution; Geist Mono is the brand's own eyebrow face, open on Google Fonts"
|
|
9
|
-
license: open
|
|
10
|
-
---
|
|
11
|
-
|
|
12
|
-
# x-ai — a launch-pad gantry before dawn
|
|
13
|
-
|
|
14
|
-
## 1 Visual Theme
|
|
15
|
-
A launch-pad gantry an hour before dawn: matte black steel, cold service lights,
|
|
16
|
-
and one sodium-orange floodlight marking the crew route. Dark by default — the
|
|
17
|
-
cosmic near-black canvas is the brand, authored as a cool ladder, confidently
|
|
18
|
-
sparse and unmarketed; the light theme is the same structure in morning overcast.
|
|
19
|
-
Near-monochrome discipline: one sunset-orange accent held scarce, the pill on every
|
|
20
|
-
interactive control, the display at weight 400 with negative tracking — never bold.
|
|
21
|
-
|
|
22
|
-
## 2 Color Roles
|
|
23
|
-
Cool off-white `foreground` on the cosmic canvas. Sunset-orange `primary` is the
|
|
24
|
-
one chroma — the primary action, the `ring`, the active-nav mark — with near-black
|
|
25
|
-
ink on it, and its scarcity is the voltage. `accent` is a neutral cool lift for
|
|
26
|
-
selection, never orange. The amber-gold `warning` stays visibly distinct from the
|
|
27
|
-
sunset primary; the dusk/twilight/breeze cosmic hues live only in charts. The
|
|
28
|
-
`sidebar` rail stays near-black in both themes — the cosmic inlay.
|
|
29
|
-
|
|
30
|
-
## 3 Typography
|
|
31
|
-
Inter (text, substituting the proprietary Universal Sans) / Geist Mono (the brand's
|
|
32
|
-
own eyebrow face — open). Register scope: the display sits at weight 400 with
|
|
33
|
-
aggressive negative tracking, never bold — size and gathering do the emphasis;
|
|
34
|
-
component heads earn 500 at most; the mono owns the uppercase tracked eyebrow above
|
|
35
|
-
every section head, plus IDs, codes, timestamps, log lines, and metric counters.
|
|
36
|
-
Numerals are always `tabular-nums`.
|
|
37
|
-
|
|
38
|
-
## 4 Component Stylings
|
|
39
|
-
Buttons pill (`radius-lg` 9999) — sunset `primary` fill with near-black label,
|
|
40
|
-
secondary a hairline pill; inputs `radius-md` (8px, never pilled) with the 1px
|
|
41
|
-
sunset `ring` — high-chroma reads even at 1px; cards hairline-edged at 8px, the
|
|
42
|
-
surface step doing the lift; table rows `muted` hover, `accent` selection, mono-
|
|
43
|
-
caps column headers; detail in the side panel; badges pill with mono-caps captions.
|
|
44
|
-
|
|
45
|
-
## 5 Layout
|
|
46
|
-
4px base; sidebar 240/56px; topbar 52px — the lean nav; side panel 420/640px;
|
|
47
|
-
content max 1400px; engineered-tight, not editorial-loose.
|
|
48
|
-
|
|
49
|
-
## 6 Depth
|
|
50
|
-
No shadows — the brand uses none. Dark first: the authored ladder — `background`
|
|
51
|
-
0.15 L, `surface-raised` +0.04, `surface-overlay` +0.09, cool hue held at 265 —
|
|
52
|
-
with hairlines and the surface step carrying every cue. Light: cool near-white
|
|
53
|
-
canvas, white cards read by hairline; the near-black returns as the sidebar rail
|
|
54
|
-
and terminal/metric inlays.
|
|
55
|
-
|
|
56
|
-
## 7 Motion
|
|
57
|
-
Sparse, exact. Named moments: `panel-slide` (side panel, 200ms, interruptible),
|
|
58
|
-
`telemetry-fade` (metric update, 120ms), `press` (pill press, 90ms). Physicality
|
|
59
|
-
granted only to auth; logs and counters tick without easing theatrics; nothing
|
|
60
|
-
animates on keyboard-initiated actions.
|
|
61
|
-
|
|
62
|
-
## 8 Iconography & Charts
|
|
63
|
-
Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default. Charts: hairline
|
|
64
|
-
axes, no gridline fills; categorical runs sunset, dusk violet, twilight blue,
|
|
65
|
-
breeze teal, gold (`chart-1..5`); sequential canvas→sunset; tooltips on
|
|
66
|
-
`surface-overlay` with Geist Mono numerals.
|
|
67
|
-
|
|
68
|
-
## 9 Voice
|
|
69
|
-
Flight-test laconic: short, exact, uppercase only in the mono eyebrow. "Run eval" ·
|
|
70
|
-
"NO ACTIVE RUNS — cluster idle 14m" · "Checkpoint 412 failed integrity; the
|
|
71
|
-
previous checkpoint remains live."
|
|
72
|
-
|
|
73
|
-
## 10 Do's & Don'ts
|
|
74
|
-
Do stay near-monochrome — hairlines and weight before any color; restraint is the
|
|
75
|
-
brand. Do pill buttons, chips, and badges; cards and inputs hold 8px. Don't bold
|
|
76
|
-
the display — weight 400 is the whole scale. Don't promote a second chroma — the
|
|
77
|
-
cosmic hues are chart series; keep amber-gold warning distinct from sunset. Don't
|
|
78
|
-
shadow anything.
|
|
79
|
-
|
|
80
|
-
## 11 Responsive
|
|
81
|
-
375: the near-black rail → off-canvas drawer, side panel → full sheet, list+detail
|
|
82
|
-
stacks. 768: rail → icon strip; tables and log panes scroll horizontally, never
|
|
83
|
-
wrap. 1024/1440: two-pane queue+detail holds; forms cap, dashboards full width.
|
|
84
|
-
|
|
85
|
-
## 12 Agent Prompt Guide
|
|
86
|
-
Wear the cosmic canvas as the default; light is the overcast morning of the same
|
|
87
|
-
gantry, its rail still near-black. Spend sunset once per surface — if two things
|
|
88
|
-
want the orange, one is not primary. Every section head carries a Geist Mono
|
|
89
|
-
uppercase eyebrow; the display never bolds. Depth is the ladder and hairlines —
|
|
90
|
-
consult the block, never derive.
|
|
91
|
-
|
|
92
|
-
```yaml design-values
|
|
93
|
-
color:
|
|
94
|
-
light:
|
|
95
|
-
background: oklch(0.988 0.005 265)
|
|
96
|
-
foreground: oklch(0.15 0.006 265)
|
|
97
|
-
card: oklch(0.995 0.005 265)
|
|
98
|
-
card-foreground: oklch(0.15 0.006 265)
|
|
99
|
-
popover: oklch(0.995 0.005 265)
|
|
100
|
-
popover-foreground: oklch(0.15 0.006 265)
|
|
101
|
-
primary: oklch(0.68 0.19 45)
|
|
102
|
-
primary-foreground: oklch(0.13 0.006 265)
|
|
103
|
-
secondary: oklch(0.96 0.005 265)
|
|
104
|
-
secondary-foreground: oklch(0.25 0.008 265)
|
|
105
|
-
muted: oklch(0.96 0.005 265)
|
|
106
|
-
muted-foreground: oklch(0.46 0.01 258)
|
|
107
|
-
accent: oklch(0.948 0.005 258)
|
|
108
|
-
accent-foreground: oklch(0.25 0.008 265)
|
|
109
|
-
destructive: oklch(0.55 0.19 25)
|
|
110
|
-
destructive-foreground: oklch(0.985 0.008 25)
|
|
111
|
-
success: oklch(0.58 0.13 158)
|
|
112
|
-
warning: oklch(0.63 0.14 71)
|
|
113
|
-
border: oklch(0.928 0.005 268)
|
|
114
|
-
input: oklch(0.928 0.005 268)
|
|
115
|
-
ring: oklch(0.68 0.19 45)
|
|
116
|
-
surface-raised: oklch(0.98 0.005 265)
|
|
117
|
-
surface-overlay: oklch(0.995 0.005 265)
|
|
118
|
-
chart-1: oklch(0.68 0.19 45)
|
|
119
|
-
chart-2: oklch(0.55 0.15 300)
|
|
120
|
-
chart-3: oklch(0.55 0.14 265)
|
|
121
|
-
chart-4: oklch(0.62 0.11 200)
|
|
122
|
-
chart-5: oklch(0.66 0.14 71)
|
|
123
|
-
sidebar: oklch(0.15 0.006 265)
|
|
124
|
-
sidebar-foreground: oklch(0.9 0.006 265)
|
|
125
|
-
sidebar-primary: oklch(0.72 0.187 49)
|
|
126
|
-
sidebar-primary-foreground: oklch(0.13 0.006 265)
|
|
127
|
-
sidebar-accent: oklch(0.21 0.007 265)
|
|
128
|
-
sidebar-accent-foreground: oklch(0.92 0.006 265)
|
|
129
|
-
sidebar-border: oklch(0.22 0.007 265)
|
|
130
|
-
sidebar-ring: oklch(0.72 0.187 49)
|
|
131
|
-
dark:
|
|
132
|
-
background: oklch(0.15 0.006 265)
|
|
133
|
-
foreground: oklch(0.92 0.006 265)
|
|
134
|
-
card: oklch(0.18 0.006 265)
|
|
135
|
-
card-foreground: oklch(0.92 0.006 265)
|
|
136
|
-
popover: oklch(0.24 0.007 265)
|
|
137
|
-
popover-foreground: oklch(0.92 0.006 265)
|
|
138
|
-
primary: oklch(0.72 0.187 49)
|
|
139
|
-
primary-foreground: oklch(0.15 0.006 265)
|
|
140
|
-
secondary: oklch(0.22 0.007 265)
|
|
141
|
-
secondary-foreground: oklch(0.9 0.006 265)
|
|
142
|
-
muted: oklch(0.21 0.007 265)
|
|
143
|
-
muted-foreground: oklch(0.67 0.008 260)
|
|
144
|
-
accent: oklch(0.24 0.007 265)
|
|
145
|
-
accent-foreground: oklch(0.92 0.006 265)
|
|
146
|
-
destructive: oklch(0.63 0.19 23)
|
|
147
|
-
destructive-foreground: oklch(0.11 0.02 23)
|
|
148
|
-
success: oklch(0.66 0.13 158)
|
|
149
|
-
warning: oklch(0.71 0.14 71)
|
|
150
|
-
border: oklch(0.25 0.007 265)
|
|
151
|
-
input: oklch(0.25 0.007 265)
|
|
152
|
-
ring: oklch(0.72 0.187 49)
|
|
153
|
-
surface-raised: oklch(0.19 0.006 265)
|
|
154
|
-
surface-overlay: oklch(0.24 0.007 265)
|
|
155
|
-
chart-1: oklch(0.72 0.187 49)
|
|
156
|
-
chart-2: oklch(0.62 0.15 300)
|
|
157
|
-
chart-3: oklch(0.62 0.14 265)
|
|
158
|
-
chart-4: oklch(0.7 0.11 200)
|
|
159
|
-
chart-5: oklch(0.71 0.14 71)
|
|
160
|
-
sidebar: oklch(0.13 0.006 265)
|
|
161
|
-
sidebar-foreground: oklch(0.88 0.006 265)
|
|
162
|
-
sidebar-primary: oklch(0.72 0.187 49)
|
|
163
|
-
sidebar-primary-foreground: oklch(0.13 0.006 265)
|
|
164
|
-
sidebar-accent: oklch(0.19 0.007 265)
|
|
165
|
-
sidebar-accent-foreground: oklch(0.9 0.006 265)
|
|
166
|
-
sidebar-border: oklch(0.2 0.007 265)
|
|
167
|
-
sidebar-ring: oklch(0.72 0.187 49)
|
|
168
|
-
typography:
|
|
169
|
-
display: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400] }
|
|
170
|
-
sans: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400, 500] }
|
|
171
|
-
mono: { family: "Geist Mono Variable", fallback: "ui-monospace, monospace", weights: [400] }
|
|
172
|
-
ramp:
|
|
173
|
-
display: { size: 30px, line: 36px, weight: 400, family: sans, tracking: -0.03em }
|
|
174
|
-
h1: { size: 24px, line: 29px, weight: 400, family: sans, tracking: -0.025em }
|
|
175
|
-
h2: { size: 19px, line: 25px, weight: 400, family: sans, tracking: -0.02em }
|
|
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: 17px, weight: 400, 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, empty-state, auth], sans: [chrome, controls, body], mono: [data, ids, timestamps, eyebrows, logs, metrics] }
|
|
181
|
-
elevation:
|
|
182
|
-
radius: { sm: 4px, md: 8px, lg: 9999px }
|
|
183
|
-
hairline: border
|
|
184
|
-
shadow:
|
|
185
|
-
overlay: "0 8px 24px oklch(0.1 0.006 265 / 0.5)"
|
|
186
|
-
popover: "0 4px 12px oklch(0.1 0.006 265 / 0.4)"
|
|
187
|
-
dark-ladder: { background: 0.15, raised: 0.19, overlay: 0.24, hue-held: 265 }
|
|
188
|
-
motion:
|
|
189
|
-
duration: { press: 90ms, fade: 120ms, 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: chart-4 }
|
|
198
|
-
layout: { base: 4px, sidebar: [240px, 56px], topbar: 52px, side-panel: [420px, 640px], content-max: 1400px }
|
|
199
|
-
```
|
|
@@ -1,198 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
schema: design-md/v2
|
|
3
|
-
id: zapier
|
|
4
|
-
tier: brand
|
|
5
|
-
segments: [automation, workflow, no-code]
|
|
6
|
-
keywords: [warm, cream, orange, coffee, rounded, friendly, automation]
|
|
7
|
-
sourced: 2026-07-12
|
|
8
|
-
sources: "design-md/v1 library entry (2026-07-04); 2026-07-12 brand re-audit; Inter carried as the brand's real workhorse (Degular Display hero stays behind), IBM Plex Mono for the derived mono"
|
|
9
|
-
license: open
|
|
10
|
-
---
|
|
11
|
-
|
|
12
|
-
# zapier — a warm workshop bench, one orange lever
|
|
13
|
-
|
|
14
|
-
## 1 Visual Theme
|
|
15
|
-
A warm workshop bench where automations get wired together: a cream working surface,
|
|
16
|
-
deep coffee ink, faintly recessed cream cards, and one saturated orange lever pulled
|
|
17
|
-
for the action that runs. Warm by default — the cream `background` is a deliberate
|
|
18
|
-
off-white, never the pure white the category defaults to; the dark theme is an authored
|
|
19
|
-
coffee ladder. Flat: warm hairlines and the recessed-card surface ladder carry
|
|
20
|
-
hierarchy, never heavy shadow. Corners hold the signature 12px middle radius — neither
|
|
21
|
-
friendly-pill nor technical-square.
|
|
22
|
-
|
|
23
|
-
## 2 Color Roles
|
|
24
|
-
Deep coffee `foreground` on the warm cream `background`, never pure black; every neutral
|
|
25
|
-
carries warmth, none is cool grey. `primary` orange is the single conversion voltage —
|
|
26
|
-
the one action, active nav, the focus `ring` — worn with warm-white type. `input` is the
|
|
27
|
-
brand's bold coffee-ink field edge. `accent` is a pale-orange whisper for selection.
|
|
28
|
-
Status hues speak status, brick red never the orange. The `sidebar` holds a recessed
|
|
29
|
-
cream a half-step below the canvas.
|
|
30
|
-
|
|
31
|
-
## 3 Typography
|
|
32
|
-
Inter (chrome and display, the brand's real workhorse — Degular Display stays behind) /
|
|
33
|
-
IBM Plex Mono (data). Register scope: the sans runs every title, control, cell, and
|
|
34
|
-
byline, its display steps tracking slightly negative, weight 600 the ceiling; the mono
|
|
35
|
-
owns zap IDs, run codes, and timestamps. The uppercase eyebrow keeps positive tracking —
|
|
36
|
-
the brand's signature label. Numerals are always `tabular-nums`; emphasize by weight.
|
|
37
|
-
|
|
38
|
-
## 4 Component Stylings
|
|
39
|
-
Buttons `radius-md` (12px, never pill or square), orange `primary` fill with warm-white
|
|
40
|
-
type; inputs `radius-sm` on the bold coffee-ink `input` edge, the orange `ring` at 2px
|
|
41
|
-
without glow; cards recessed cream on the brighter canvas — surface contrast is the
|
|
42
|
-
elevation — a hairline for a grid edge; table rows `muted` hover, pale-orange `accent`
|
|
43
|
-
selection; detail opens in the side panel; badges pill, status fills only, never `primary`.
|
|
44
|
-
|
|
45
|
-
## 5 Layout
|
|
46
|
-
4px base; sidebar 256/56px; topbar 56px; side panel 440/640px; content max 1280px;
|
|
47
|
-
density standard, the 64px marketing rhythm left behind.
|
|
48
|
-
|
|
49
|
-
## 6 Depth
|
|
50
|
-
Flat, surface-contrast first. Light: the recessed cream ladder and warm hairlines carry
|
|
51
|
-
rank — cards sit a step below the canvas, emphasized outlines take the bold ink border;
|
|
52
|
-
shadow only when a card truly floats, coffee-tinted and soft. Dark: the authored ladder
|
|
53
|
-
does the depth — `background` 0.19 L, `surface-raised` +0.05, `surface-overlay` +0.10,
|
|
54
|
-
warm hue held at 40.
|
|
55
|
-
|
|
56
|
-
## 7 Motion
|
|
57
|
-
Warm and confident, kept restrained. Named moments: `panel-slide` (side panel, 240ms,
|
|
58
|
-
interruptible), `fade-arrive` (page content, 160ms), `run-press` (primary press, 120ms).
|
|
59
|
-
Physicality granted only to auth and first-run empty states; tables and keyboard actions
|
|
60
|
-
are instant.
|
|
61
|
-
|
|
62
|
-
## 8 Iconography & Charts
|
|
63
|
-
Lucide, 1.5px stroke, 16/20px grid, `muted-foreground` default. Charts: hairline axes,
|
|
64
|
-
no gridline fills; a warm-led ramp — orange, gold, green, brick, slate-blue categorical
|
|
65
|
-
(`chart-1..5`); monochrome sequential canvas→orange; tooltips on `surface-overlay` with
|
|
66
|
-
mono numerals.
|
|
67
|
-
|
|
68
|
-
## 9 Voice
|
|
69
|
-
Warm and confident, plainly stated: friendly without exclamation. "Create Zap" · "Nothing
|
|
70
|
-
running — your last Zap finished 5m ago" · "This Zap failed at step 3; the trigger data
|
|
71
|
-
was missing a required field."
|
|
72
|
-
|
|
73
|
-
## 10 Do's & Don'ts
|
|
74
|
-
Do anchor on the warm cream canvas and keep ink deep coffee — the temperature is the
|
|
75
|
-
voice. Do reserve orange for the single most important action; orange plus cream plus
|
|
76
|
-
coffee is the whole conversion story. Do hold corners at the 12px middle radius. Don't
|
|
77
|
-
pill or square the CTA, promote a second chromatic accent, or let orange become
|
|
78
|
-
`destructive` — use the brick red.
|
|
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
|
-
forms cap, dashboards use full width.
|
|
84
|
-
|
|
85
|
-
## 12 Agent Prompt Guide
|
|
86
|
-
Reach for the warm cream canvas first; float recessed cream cards on it, separated by
|
|
87
|
-
surface contrast and warm hairlines before shadow. Spend the orange once — if two things
|
|
88
|
-
want it, one is not primary. Keep corners at 12px, ink deep coffee, IDs in IBM Plex Mono.
|
|
89
|
-
Dark is the authored coffee ladder — consult the block, never derive.
|
|
90
|
-
|
|
91
|
-
```yaml design-values
|
|
92
|
-
color:
|
|
93
|
-
light:
|
|
94
|
-
background: oklch(0.997 0.004 91.4)
|
|
95
|
-
foreground: oklch(0.21 0.018 18.7)
|
|
96
|
-
card: oklch(0.969 0.007 67.7)
|
|
97
|
-
card-foreground: oklch(0.21 0.018 18.7)
|
|
98
|
-
popover: oklch(0.997 0.004 91.4)
|
|
99
|
-
popover-foreground: oklch(0.21 0.018 18.7)
|
|
100
|
-
primary: oklch(0.67 0.222 37.4)
|
|
101
|
-
primary-foreground: oklch(0.99 0.01 91)
|
|
102
|
-
secondary: oklch(0.945 0.012 79.8)
|
|
103
|
-
secondary-foreground: oklch(0.25 0.018 19)
|
|
104
|
-
muted: oklch(0.945 0.012 79.8)
|
|
105
|
-
muted-foreground: oklch(0.478 0.018 94.4)
|
|
106
|
-
accent: oklch(0.949 0.027 43.7)
|
|
107
|
-
accent-foreground: oklch(0.527 0.172 38.2)
|
|
108
|
-
destructive: oklch(0.54 0.176 28.6)
|
|
109
|
-
destructive-foreground: oklch(0.985 0.01 28.6)
|
|
110
|
-
success: oklch(0.586 0.113 152.4)
|
|
111
|
-
warning: oklch(0.679 0.135 74.9)
|
|
112
|
-
border: oklch(0.916 0.014 77.1)
|
|
113
|
-
input: oklch(0.21 0.015 19)
|
|
114
|
-
ring: oklch(0.67 0.222 37.4)
|
|
115
|
-
surface-raised: oklch(0.997 0.004 91.4)
|
|
116
|
-
surface-overlay: oklch(0.997 0.004 91.4)
|
|
117
|
-
chart-1: oklch(0.67 0.2 37.4)
|
|
118
|
-
chart-2: oklch(0.68 0.14 74.9)
|
|
119
|
-
chart-3: oklch(0.58 0.11 152.4)
|
|
120
|
-
chart-4: oklch(0.5 0.17 28.6)
|
|
121
|
-
chart-5: oklch(0.55 0.1 250)
|
|
122
|
-
sidebar: oklch(0.969 0.007 67.7)
|
|
123
|
-
sidebar-foreground: oklch(0.25 0.018 19)
|
|
124
|
-
sidebar-primary: oklch(0.67 0.222 37.4)
|
|
125
|
-
sidebar-primary-foreground: oklch(0.99 0.01 91)
|
|
126
|
-
sidebar-accent: oklch(0.949 0.027 43.7)
|
|
127
|
-
sidebar-accent-foreground: oklch(0.527 0.172 38.2)
|
|
128
|
-
sidebar-border: oklch(0.916 0.014 77.1)
|
|
129
|
-
sidebar-ring: oklch(0.67 0.222 37.4)
|
|
130
|
-
dark:
|
|
131
|
-
background: oklch(0.19 0.012 40)
|
|
132
|
-
foreground: oklch(0.94 0.008 60)
|
|
133
|
-
card: oklch(0.22 0.012 40)
|
|
134
|
-
card-foreground: oklch(0.94 0.008 60)
|
|
135
|
-
popover: oklch(0.27 0.012 40)
|
|
136
|
-
popover-foreground: oklch(0.94 0.008 60)
|
|
137
|
-
primary: oklch(0.67 0.222 37.4)
|
|
138
|
-
primary-foreground: oklch(0.99 0.01 91)
|
|
139
|
-
secondary: oklch(0.24 0.012 40)
|
|
140
|
-
secondary-foreground: oklch(0.9 0.008 60)
|
|
141
|
-
muted: oklch(0.23 0.012 40)
|
|
142
|
-
muted-foreground: oklch(0.68 0.01 60)
|
|
143
|
-
accent: oklch(0.32 0.06 40)
|
|
144
|
-
accent-foreground: oklch(0.92 0.03 43.7)
|
|
145
|
-
destructive: oklch(0.6 0.18 28.6)
|
|
146
|
-
destructive-foreground: oklch(0.14 0.02 28.6)
|
|
147
|
-
success: oklch(0.65 0.12 152.4)
|
|
148
|
-
warning: oklch(0.75 0.14 74.9)
|
|
149
|
-
border: oklch(0.27 0.012 40)
|
|
150
|
-
input: oklch(0.27 0.012 40)
|
|
151
|
-
ring: oklch(0.7 0.2 40)
|
|
152
|
-
surface-raised: oklch(0.24 0.012 40)
|
|
153
|
-
surface-overlay: oklch(0.29 0.012 40)
|
|
154
|
-
chart-1: oklch(0.72 0.2 37.4)
|
|
155
|
-
chart-2: oklch(0.75 0.14 74.9)
|
|
156
|
-
chart-3: oklch(0.66 0.12 152.4)
|
|
157
|
-
chart-4: oklch(0.6 0.18 28.6)
|
|
158
|
-
chart-5: oklch(0.65 0.11 250)
|
|
159
|
-
sidebar: oklch(0.16 0.012 40)
|
|
160
|
-
sidebar-foreground: oklch(0.9 0.008 60)
|
|
161
|
-
sidebar-primary: oklch(0.67 0.222 37.4)
|
|
162
|
-
sidebar-primary-foreground: oklch(0.99 0.01 91)
|
|
163
|
-
sidebar-accent: oklch(0.24 0.06 40)
|
|
164
|
-
sidebar-accent-foreground: oklch(0.92 0.03 43.7)
|
|
165
|
-
sidebar-border: oklch(0.22 0.012 40)
|
|
166
|
-
sidebar-ring: oklch(0.7 0.2 40)
|
|
167
|
-
typography:
|
|
168
|
-
display: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400, 600] }
|
|
169
|
-
sans: { family: "Inter Variable", fallback: "system-ui, sans-serif", weights: [400, 600] }
|
|
170
|
-
mono: { family: "IBM Plex Mono", fallback: "ui-monospace, monospace", weights: [400] }
|
|
171
|
-
ramp:
|
|
172
|
-
display: { size: 28px, line: 34px, weight: 600, family: display, tracking: -0.01em }
|
|
173
|
-
h1: { size: 24px, line: 30px, weight: 600, family: sans, tracking: -0.01em }
|
|
174
|
-
h2: { size: 20px, line: 26px, weight: 600, family: sans }
|
|
175
|
-
body: { size: 14px, line: 20px, weight: 400, family: sans }
|
|
176
|
-
small: { size: 13px, line: 18px, weight: 400, family: sans }
|
|
177
|
-
caption: { size: 13px, line: 16px, weight: 600, family: sans, tracking: 0.06em, transform: uppercase }
|
|
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: 6px, md: 12px, lg: 16px }
|
|
182
|
-
hairline: border
|
|
183
|
-
shadow:
|
|
184
|
-
overlay: "0 8px 30px oklch(0.21 0.03 40 / 0.12)"
|
|
185
|
-
popover: "0 4px 16px oklch(0.21 0.03 40 / 0.1)"
|
|
186
|
-
dark-ladder: { background: 0.19, raised: 0.24, overlay: 0.29, hue-held: 40 }
|
|
187
|
-
motion:
|
|
188
|
-
duration: { press: 120ms, fade: 160ms, panel: 240ms }
|
|
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, first-run-empty]
|
|
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: 4px, sidebar: [256px, 56px], topbar: 56px, side-panel: [440px, 640px], content-max: 1280px }
|
|
198
|
-
```
|