Modal
Specimen
Loading
Cohere — Features
Deep indigo expanse, sharp sans-serif geometry, and a quiet, powerful digital stillness.
Click any value to copy. Roles are suggestions, not gospel.
- #3fa0b0oklch(65.5% 0.092 210)Dominant
- #1e6471oklch(46.6% 0.070 213)Surface
- #e5c2a1oklch(83.6% 0.060 65)Ink
- #945c7coklch(54.7% 0.085 345)Accent
- #bb8fccoklch(71.3% 0.099 316)Detail
Read off the live site. Treat it as reference, not a recipe.
| Role | Family | Size | Weight | Leading | Tracking | Sample |
|---|---|---|---|---|---|---|
| h1 | CohereText | 96px | 400 | 1 | -1.92px | Aa Bb Cc |
| h2 | Unica77 Cohere Web | 32px | 400 | 1.2 | -0.32px | Aa Bb Cc |
| h3 | Unica77 Cohere Web | 48px | 400 | 1.2 | -0.48px | Aa Bb Cc |
| body | Unica77 Cohere Web | 16px | 400 | 1.5 | 0 | Aa Bb Cc |
| button | Unica77 Cohere Web | 14px | 400 | 0 | 0 | Aa Bb Cc |
Max content width 1440px
:root {
--color-dominant: #3fa0b0;
--color-surface: #1e6471;
--color-ink: #e5c2a1;
--color-accent: #945c7c;
--color-detail: #bb8fcc;
}
/* CSS variables exposed by source */
:root {
--c: 258deg;
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--coral: #ff7759;
--green: #39594d;
--cellWidth: calc(100% + 2px);
--tw-skew-x: 0;
--cellHeight: calc(100% + 2px);
--tw-shadow: 0 0 #0000;
--tw-translate-x: 0;
--tw-ring-offset-width: 0px;
--coral-light: rgb(255 173 155);
--marble: #fafafa;
--tw-scroll-snap-strictness: proximity;
--tw-border-spacing-x: 0;
--tw-scale-x: 1;
--d: 348deg;
--tw-shadow-colored: 0 0 #0000;
--tw-border-spacing-y: 0;
--b: 168deg;
--tw-scale-y: 1;
--tw-skew-y: 0;
--tw-ring-color: #4c6ee680;
--volcanic: #212121;
--tw-translate-y: 0;
--a: 78deg;
--tw-rotate: 0;
--z-index: 99;
--tw-ring-offset-color: #fff;
}Drop-in prompt
Build a landing page in the visual style of Cohere — Features.
Reference design system (extracted from the live site):
- Palette: #3fa0b0, #1e6471, #e5c2a1, #945c7c, #bb8fcc
- Typefaces: CohereText, Unica77 Cohere Web
- Macrostructure: Specimen
Use the dominant colour for surfaces, the accent sparingly,
and lean on type weight + scale rather than colour for hierarchy.
Full DESIGN.md: https://inspomcp.dev/api/design/cohere-com--developers
