W3C Design Tokens
3 filesCross-tool design-token spec (DTCG/W3C). Light + dark mode siblings.
Cohere
Cohere is an enterprise AI company building the Command family of large language models, the Embed family of retrieval embeddings, and the Rerank reranking model — distributed via cloud APIs and on-prem deployment. The brand voice is enterprise-grounded and practitioner-first: model cards, retrieval benchmarks, and deployment guides over marketing slogans. Visually, Cohere's optical signature is a tropical three-stop gradient (coral → mauve → cobalt) painted across the brand's proprietary CohereColor display face, anchored to a near-black "Ink" canvas on product surfaces and a near-white "Paper" canvas on the marketing site. Typography is the proprietary CohereVariable / CohereText / CohereMono family with Space Grotesk and Inter as documented fallbacks.
1 palette 3 fonts 0 assets 9 rules
Preview prompt
Use the [email protected] brand from brand-atoms.com.
Fetch https://brand-atoms.com/dist/brands/cohere/1.0.0/json/brand.json
and apply its role mappings (primary, accent, identity, etc.),
reference the fonts in references.fonts, and honor every rule where
severity is "error". Surface any deviation you choose to make.Downloads
All converter outputs for [email protected]. Served from
/dist/brands/cohere/1.0.0/.
JSON
1 filePlain JSON mirror of the resolved brand — palette, fonts, roles, rules.
CSS variables
1 fileCSS custom properties on :root with prefers-color-scheme dark.
SCSS
1 fileSCSS variables + Sass maps for swatches, roles, and fonts.
Tailwind config
1 fileTailwind v3 theme.extend.colors + fontFamily.
Figma Tokens
1 fileFigma Tokens plugin JSON (Tokens Studio compatible).
Swift
1 fileSwift enums for SwiftUI / UIKit color + font tokens.
Kotlin / Compose
1 fileKotlin objects for Jetpack Compose color + typography tokens.
Markdown guide
1 fileHuman-readable brand guide. Same source as the on-page Brand Guide.
Brand Guide
Inline rendering of the Markdown brand guide. Same source as the
markdown/brand-guide.md download.
Cohere
Cohere is an enterprise AI company building the Command family of large language models, the Embed family of retrieval embeddings, and the Rerank reranking model — distributed via cloud APIs and on-prem deployment. The brand voice is enterprise-grounded and practitioner-first: model cards, retrieval benchmarks, and deployment guides over marketing slogans. Visually, Cohere's optical signature is a tropical three-stop gradient (coral → mauve → cobalt) painted across the brand's proprietary CohereColor display face, anchored to a near-black "Ink" canvas on product surfaces and a near-white "Paper" canvas on the marketing site. Typography is the proprietary CohereVariable / CohereText / CohereMono family with Space Grotesk and Inter as documented fallbacks.
Tags: cohere, ai, llm, enterprise, brand, dark-first, gradient, coral, cobalt
Atoms
Palette
Cohere · [email protected] · Proprietary — All Rights Reserved
Cohere's brand palette as captured from the live marketing site (cohere.com). The brand's optical signature is a tropical three-stop gradient — coral (#FF7759) → mauve (#7670C5) → cobalt (#4C6EE6) — that travels across product surfaces and the CohereColor display face. Surrounding the gradient is a calibrated neutral system: a near-white "Paper" canvas in light mode and a near-black "Ink" canvas in dark mode (Command product surfaces use the dark Ink ground as their primary canvas). Secondary accent colors — a magenta-violet, a deep-jade, a navy, and an ember-red — appear in editorial and data-viz contexts but the coral-mauve-cobalt gradient is the dominant brand cue.
Fonts
| Role | Font | License | Classification |
|---|---|---|---|
heading |
Space Grotesk ([email protected]) |
OFL-1.1 | sans-serif |
body |
Space Grotesk ([email protected]) |
OFL-1.1 | sans-serif |
mono |
Geist Mono ([email protected]) |
OFL-1.1 | monospace |
Swatches
| ID | Name | Value |
|---|---|---|
ink-deep |
Ink Deep | #101010 |
ink |
Ink | #17171C |
ink-elevated |
Ink Elevated | #212121 |
ink-quiet |
Ink Quiet | #2E2E2E |
paper |
Paper | #FAFAFA |
paper-elevated |
Paper Elevated | #F2F2F2 |
paper-quiet |
Paper Quiet | #E0E0E0 |
coral |
Coral | #FF7759 |
coral-soft |
Coral Soft | #FFD9D0 |
coral-deep |
Coral Deep | #CA492D |
mauve |
Mauve | #7670C5 |
cobalt |
Cobalt | #4C6EE6 |
cobalt-soft |
Cobalt Soft | #8FA6F9 |
cobalt-pale |
Cobalt Pale | #E5EBFF |
violet |
Violet | #9B60AA |
violet-soft |
Violet Soft | #D18EE2 |
violet-pale |
Violet Pale | #EDDAF4 |
jade |
Jade | #355146 |
jade-soft |
Jade Soft | #71867E |
navy |
Navy | #142253 |
navy-mid |
Navy Mid | #2D4CB9 |
ember |
Ember | #B30000 |
text-on-paper |
Text on Paper | #17171C |
text-secondary |
Text Secondary | #616161 |
text-tertiary |
Text Tertiary | #9CA3AF |
Mode role mappings
Light mode
| Role | Swatch | Hex |
|---|---|---|
background |
paper |
#FAFAFA |
surface |
paper-elevated |
#F2F2F2 |
surface-elevated |
paper |
#FAFAFA |
text-primary |
text-on-paper |
#17171C |
text-secondary |
text-secondary |
#616161 |
text-tertiary |
text-tertiary |
#9CA3AF |
primary |
coral |
#FF7759 |
primary-hover |
coral-deep |
#CA492D |
accent |
cobalt |
#4C6EE6 |
accent-hover |
navy-mid |
#2D4CB9 |
warning |
coral-soft |
#FFD9D0 |
warning-hover |
coral |
#FF7759 |
error |
ember |
#B30000 |
success |
jade |
#355146 |
border |
paper-quiet |
#E0E0E0 |
Dark mode
| Role | Swatch | Hex |
|---|---|---|
background |
ink |
#17171C |
surface |
ink-elevated |
#212121 |
surface-elevated |
ink-quiet |
#2E2E2E |
text-primary |
paper |
#FAFAFA |
text-secondary |
paper-quiet |
#E0E0E0 |
text-tertiary |
text-tertiary |
#9CA3AF |
primary |
coral |
#FF7759 |
primary-hover |
coral-deep |
#CA492D |
accent |
cobalt-soft |
#8FA6F9 |
accent-hover |
cobalt |
#4C6EE6 |
warning |
coral-soft |
#FFD9D0 |
warning-hover |
coral |
#FF7759 |
error |
ember |
#B30000 |
success |
jade-soft |
#71867E |
border |
ink-quiet |
#2E2E2E |
Brand semantic roles
Colors
| Role | Swatch | Hex |
|---|---|---|
identity |
ink |
#17171C |
on-identity |
paper |
#FAFAFA |
primary |
coral |
#FF7759 |
primary-hover |
coral-deep |
#CA492D |
accent |
cobalt |
#4C6EE6 |
accent-hover |
navy-mid |
#2D4CB9 |
mark |
coral |
#FF7759 |
success |
jade |
#355146 |
warning |
coral-soft |
#FFD9D0 |
error |
ember |
#B30000 |
text-primary-light |
text-on-paper |
#17171C |
text-primary-dark |
paper |
#FAFAFA |
background-light |
paper |
#FAFAFA |
background-dark |
ink |
#17171C |
surface-light |
paper-elevated |
#F2F2F2 |
surface-dark |
ink-elevated |
#212121 |
text-secondary-light |
text-secondary |
#616161 |
text-tertiary-light |
text-tertiary |
#9CA3AF |
border-light |
paper-quiet |
#E0E0E0 |
border-dark |
ink-quiet |
#2E2E2E |
Typography
| Role | Font role key |
|---|---|
display |
heading |
prose |
body |
code |
mono |
Rules
🛑 error (6)
contrastRatio → text-primary
- against:
background - minRatio:
7 - standard:
WCAG-AAA
Paper (#FAFAFA) on Ink (#17171C) gives roughly 17:1 — clears AAA decisively in both modes. Cohere's enterprise-reader posture, with long benchmark tables and model-card prose, justifies an AAA target rather than the AA floor.
colorChoice → roles.colors.primary
- allowed: coral, coral-deep
- forbidden: mauve, cobalt, violet, ember, navy
Coral (#FF7759) is the gradient origin and the dominant brand action color on cohere.com. Mauve and cobalt are the second and third gradient stops — they belong WITH coral as a ramp, not standing alone as the interactive primary. Violet, ember, and navy are editorial secondaries reserved for data viz and illustration accents.
colorChoice → roles.colors.identity
- allowed: ink, ink-deep
- forbidden: paper, coral, cobalt, mauve
Cohere's identity surface is the dark Ink canvas (#17171C) — Command product surfaces, the docs reader, and the hero gradient module all render on Ink ground. The marketing Paper canvas is the secondary mode. The gradient colors flow ACROSS the identity surface; they are never the identity ground themselves.
forbiddenTreatment → logo
- treatments: stretched, rotated, drop-shadow, on-busy-photo, recolored-non-gradient, low-contrast-fill
The Cohere wordmark and the coral-mauve-cobalt gradient are precise brand assets. The mark may carry the documented gradient fill, but arbitrary single-color recoloring, skewing, or drop-shadow effects conflict with the brand's precise, enterprise posture.
fontPairing → typography.display
- requires:
prose - minSizeRatio:
1.5
CohereVariable serves both display and prose roles on cohere.com — the typographic hierarchy is established by size and weight within a single family. A 1.5× minimum display-to-prose size ratio preserves that hierarchy.
accessibilityRequirement → *
- standard:
WCAG-AA - criterion:
1.4.3
WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. The brand's Paper-and-Ink composition clears AA effortlessly; consumers must preserve the property when composing coral, mauve, or cobalt tints against either canvas.
⚠️ warning (2)
enumMembership → typography.heading.fontWeight
- allowed: 400, 500, 600, 700
The CohereVariable family is delivered on cohere.com with Regular (400), Medium (500), SemiBold (600), and Bold (700) cuts. Display weights outside this band are not in the licensed variable-font cut on the live site.
contextRestriction → roles.colors.accent
- forbiddenContexts: large-fill, background, hero
- allowedContexts: link, focus-ring, data-viz-primary, gradient-stop
Cobalt (#4C6EE6) is the gradient endpoint and appears as a link / focus state on cohere.com. Large cobalt background fills conflict with the brand's Ink-and-Paper canvas system where the gradient is a directional arc, not a flood fill.
💡 recommendation (1)
compositionConstraint → roles.colors.primary
- pairsWith: ink, ink-deep, paper, mauve, cobalt
- doesNotPairWith: ember, violet, navy
Coral reads cleanest against the dark Ink canvas, the light Paper canvas, or its sibling gradient stops (mauve, cobalt). Placing coral adjacent to ember, violet, or navy introduces chromatic conflict — the warm-red and the cool-violet fight for the same eye position without resolving into a ramp.
Provenance
- Source: https://cohere.com/
- License:
Proprietary — All Rights Reserved - Attribution: Cohere — visual identity captured from the deployed stylesheet on cohere.com (Tailwind utility-class palette and the proprietary CohereVariable / CohereText / CohereMono / CohereColor font-family stack). Cohere, Command, Embed, Rerank and associated marks are property of Cohere.
- Imported:
2026-05-18 - Notes: Derived from live site CSS at https://cohere.com/ on 2026-05-18; no public brand guide located. The proprietary CohereVariable family is declared on cohere.com via @font-face but is not publicly distributed; the live site stack falls back to Space Grotesk and Inter. This atom references space-grotesk@1 as the open-source rendering substitute for the sans/display role and geist-mono@1 as the substitute for the mono role.
Generated by the brand-atoms converter. Source: [email protected] from the encyclopedia.
Components — same template, themed by Cohere
Every block below renders from the resolved palette + font references on this brand. Swap the brand and the same template re-themes — no per-brand component code required.
Cohere
A clear hierarchy in Cohere's typeface
Tertiary heading — supporting structure
Body copy renders in the brand's prose font on the brand's background.
Inline links and highlighted phrases pick up
the brand's primary and highlight roles. Code spans like brand.references.palette
fall back to the monospace face.
A blockquote uses the brand's accent color as its rule. Useful for pulling tagline copy out of running prose.
Bulleted list
- Bullet markers inherit the brand's primary color.
- Item spacing reads as a deliberate vertical rhythm.
- Nested items still resolve to the same primary.
- Second-level item using the accent.
- Third bullet wraps cleanly at narrow widths.
Numbered list
- Open the brand's resolved spec.
- Apply roles to the component template.
- Render the surface in the brand's identity.
- Audit the output against the typed rules.
Callout boxes
Info
Neutral status — provides supplemental context without urgency. Uses the brand's primary as the rule.
Success
Confirms a completed action — palette role success determines the rule color.
Warning
Calls out something that needs attention but isn't an error — palette role warning.
Error
Surfaces a failure that blocks progress — palette role error. Use sparingly.
Table
| Role | Resolves to | Mode |
|---|---|---|
| primary | brand color #1 | light + dark |
| accent | brand color #2 | light + dark |
| warning | brand warning | light + dark |
| error | brand error | light + dark |
Atoms
Brand semantic roles
Brand-level role overrides on top of palette-default mappings. Each role resolves to a concrete swatch or font reference.
Colors
accent
→ cobalt #4C6EE6 accent-hover
→ navy-mid #2D4CB9 background-dark
→ ink #17171C background-light
→ paper #FAFAFA border-dark
→ ink-quiet #2E2E2E border-light
→ paper-quiet #E0E0E0 error
→ ember #B30000 identity
→ ink #17171C mark
→ coral #FF7759 on-identity
→ paper #FAFAFA primary
→ coral #FF7759 primary-hover
→ coral-deep #CA492D success
→ jade #355146 surface-dark
→ ink-elevated #212121 surface-light
→ paper-elevated #F2F2F2 text-primary-dark
→ paper #FAFAFA text-primary-light
→ text-on-paper #17171C text-secondary-light
→ text-secondary #616161 text-tertiary-light
→ text-tertiary #9CA3AF warning
→ coral-soft #FFD9D0 Typography
code
→ mono Geist Mono display
→ heading Space Grotesk prose
→ body Space Grotesk Palette mode mappings (from cohere)
Light mode (15 roles)
accent
→ cobalt accent-hover
→ navy-mid background
→ paper border
→ paper-quiet error
→ ember primary
→ coral primary-hover
→ coral-deep success
→ jade surface
→ paper-elevated surface-elevated
→ paper text-primary
→ text-on-paper text-secondary
→ text-secondary text-tertiary
→ text-tertiary warning
→ coral-soft warning-hover
→ coral Dark mode (15 roles)
accent
→ cobalt-soft accent-hover
→ cobalt background
→ ink border
→ ink-quiet error
→ ember primary
→ coral primary-hover
→ coral-deep success
→ jade-soft surface
→ ink-elevated surface-elevated
→ ink-quiet text-primary
→ paper text-secondary
→ paper-quiet text-tertiary
→ text-tertiary warning
→ coral-soft warning-hover
→ coral Rules (9 typed constraints)
error · 6 rules
contrastRatio text-primary against background minRatio 7 standard WCAG-AAA Paper (#FAFAFA) on Ink (#17171C) gives roughly 17:1 — clears AAA decisively in both modes. Cohere's enterprise-reader posture, with long benchmark tables and model-card prose, justifies an AAA target rather than the AA floor.
colorChoice roles.colors.primary allowed coral, coral-deep forbidden mauve, cobalt, violet, ember, navy Coral (#FF7759) is the gradient origin and the dominant brand action color on cohere.com. Mauve and cobalt are the second and third gradient stops — they belong WITH coral as a ramp, not standing alone as the interactive primary. Violet, ember, and navy are editorial secondaries reserved for data viz and illustration accents.
colorChoice roles.colors.identity allowed ink, ink-deep forbidden paper, coral, cobalt, mauve Cohere's identity surface is the dark Ink canvas (#17171C) — Command product surfaces, the docs reader, and the hero gradient module all render on Ink ground. The marketing Paper canvas is the secondary mode. The gradient colors flow ACROSS the identity surface; they are never the identity ground themselves.
forbiddenTreatment logo treatments stretched, rotated, drop-shadow, on-busy-photo, recolored-non-gradient, low-contrast-fill The Cohere wordmark and the coral-mauve-cobalt gradient are precise brand assets. The mark may carry the documented gradient fill, but arbitrary single-color recoloring, skewing, or drop-shadow effects conflict with the brand's precise, enterprise posture.
fontPairing typography.display requires prose minSizeRatio 1.5 CohereVariable serves both display and prose roles on cohere.com — the typographic hierarchy is established by size and weight within a single family. A 1.5× minimum display-to-prose size ratio preserves that hierarchy.
accessibilityRequirement * standard WCAG-AA criterion 1.4.3 WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. The brand's Paper-and-Ink composition clears AA effortlessly; consumers must preserve the property when composing coral, mauve, or cobalt tints against either canvas.
warning · 2 rules
enumMembership typography.heading.fontWeight allowed 400, 500, 600, 700 The CohereVariable family is delivered on cohere.com with Regular (400), Medium (500), SemiBold (600), and Bold (700) cuts. Display weights outside this band are not in the licensed variable-font cut on the live site.
contextRestriction roles.colors.accent forbiddenContexts large-fill, background, hero allowedContexts link, focus-ring, data-viz-primary, gradient-stop Cobalt (#4C6EE6) is the gradient endpoint and appears as a link / focus state on cohere.com. Large cobalt background fills conflict with the brand's Ink-and-Paper canvas system where the gradient is a directional arc, not a flood fill.
recommendation · 1 rule
compositionConstraint roles.colors.primary pairsWith ink, ink-deep, paper, mauve, cobalt doesNotPairWith ember, violet, navy Coral reads cleanest against the dark Ink canvas, the light Paper canvas, or its sibling gradient stops (mauve, cobalt). Placing coral adjacent to ember, violet, or navy introduces chromatic conflict — the warm-red and the cool-violet fight for the same eye position without resolving into a ramp.
Provenance
- Source
- https://cohere.com/
- License
Proprietary — All Rights Reserved- Attribution
- Cohere — visual identity captured from the deployed stylesheet on cohere.com (Tailwind utility-class palette and the proprietary CohereVariable / CohereText / CohereMono / CohereColor font-family stack). Cohere, Command, Embed, Rerank and associated marks are property of Cohere.
- Imported
2026-05-18- Notes
- Derived from live site CSS at https://cohere.com/ on 2026-05-18; no public brand guide located. The proprietary CohereVariable family is declared on cohere.com via @font-face but is not publicly distributed; the live site stack falls back to Space Grotesk and Inter. This atom references space-grotesk@1 as the open-source rendering substitute for the sans/display role and geist-mono@1 as the substitute for the mono role.