Enterprise AI · reverse-engineered design system

Design System
Analysis of Cohere

The security-first enterprise-AI brand: warm near-black on white, crisp black outlines, soft pastel section tints, and one coral-to-blue gradient held in reserve for hero moments.

01 — Foundations

Colour Palette

02 — Foundations

Typography

Hierarchy is built from size and tracking, not weight — even the 96px display is regular 400. The brand face is Unica77 Cohere Web (proprietary); shown here substituted with Inter, its nearest free Google match and Cohere's own declared fallback.

03 — Components

Button Variants

button · gradient
Expressive coral→periwinkle→blue pill. Reserved for hero and high-emphasis CTAs.
button · dark
The everyday CTA — near-black #17171c pill, white label, signature asymmetric bottom padding.
button · secondary
Crisp 1px black outline on white. The standard secondary action.
button · pill
Soft grey pill for low-emphasis or tag-style actions.
04 — Components

Cards & Surfaces

Product cards are flat: white surface, a 1px hairline, and the signature 22px radius. Shadows appear only on hover.

05 — Components

Form Elements

text-input
textarea

Signature detail: inputs use a pure-black 1px border and a crisp 2px radius — the sharpest corner in the system, deliberately set against the soft 22px cards and full-pill buttons.

06 — Foundations

Spacing Scale

An 8px base rhythm with a 4px half-step, scaling up to roomy 48px section padding.

07 — Foundations

Border Radius

From a crisp 2px on inputs to the signature 22px on cards — and a full pill for every button.

08 — Foundations

Elevation & Depth

Level 0 — 1px hairline only. The default; Cohere is a flat, border-first system.
Level 1 — soft 0 4px 12px rgba(0,0,0,.2) on dropdowns and card hovers.
Level 2 — deep 0 32px 68px rgba(0,0,0,.3) for modals and large floating panels.
09 — Responsive

Responsive Behavior

NameWidthKey changes
Mobile< 768pxSingle column; 96px display collapses to ~52px; nav folds to a menu.
Tablet768–1023pxTwo-column card grids; gutters tighten.
Laptop1024–1279pxUp to four-column grids; full display scale returns.
Desktop≥ 1280pxCentred max-width container with wide gutters; full 96px hero.

The pill-button and black-outlined-input vocabulary stays identical across every breakpoint, so the interface reads the same on phone and desktop.

Pricing Tiers

Cohere's site leads with “Contact sales” rather than a public price table; these tiers are illustrative, styled to the system.

Trial
$0/mo
Rate-limited API keys for evaluation and prototyping.
  • Command R model access
  • 1,000 calls / month
  • Community support
  • Cohere Labs resources
Production● Most popular
Usage/1M tokens
Pay-as-you-go access to Command, Embed and Rerank.
  • All latest models
  • Pay per token
  • 99.9% uptime SLA
  • Email & chat support
Enterprise
Custom
Private deployment — cloud, VPC, on-prem, or air-gapped.
  • Private / on-prem deployment
  • Fine-tuning & customization
  • SOC 2 · GDPR · HIPAA
  • Dedicated solutions team

Data Table

A models registry in the system's flat style — uppercase header, hairline rows, pill status.

IDModelTypeStatusUpdated
cmd-aCommand AGenerativeActive2d ago
cmd-r7Command R7BGenerativeActive1w ago
emb-v4Embed v4EmbeddingsActive3w ago
rrk-35Rerank 3.5SearchActive1mo ago
aya-vAya VisionMultilingualPreview2mo ago
1–5 of 412
123

Auth Forms

Sign-in styled to the system — black-outlined 2px inputs, near-black pill primary, outlined SSO.

Sign in

Sign in to Cohere

OR
Create account

Create an account

OR