# Coursera

> `coursera@1.0.0`

Coursera is one of the largest online learning platforms, host to university and industry partner courses, professional certificates, and full degree programs. The brand voice is considered, credentialing, and outcomes-focused — Coursera is positioned closer to a university than to a consumer app. Visually, the identity is a single deep signature blue (#0056D2 — Coursera Blue) against a light, generous White canvas, supported by a soft Bluish White surface tint and a restrained near-black ink text scale that deliberately avoids pure #000000. Typography is Source Sans Pro across body and headings, with Boutros Coursera as the bilingual / Arabic display companion.


**Tags:** `coursera`, `education`, `mooc`, `online-learning`, `brand`, `light-first`, `blue`, `corporate`

## Atoms

### Palette

**Coursera** · `coursera@1.0.0` · Proprietary — All Rights Reserved

> Coursera's brand palette, captured from the live marketing site (coursera.org) where the Coursera Design System exposes named color tokens — most visibly the BLUE primary (#0056D2), the deep-navy text color (#1F1F1F), and the BLUISH_WHITE soft surface tint (#F3F8FF). The system is corporate, considered, and reader-friendly: a single deep signature blue against near-white surfaces with a restrained neutral grey scale. Coursera is light-first; the marketing canvas is White, with Bluish White as the surface tint and Coursera Blue as the brand action. 

### Fonts

| Role | Font | License | Classification |
|------|------|---------|----------------|
| `heading` | **Source Sans 3** `(source-sans-3@1.0.0)` | OFL-1.1 | sans-serif |
| `body` | **Source Sans 3** `(source-sans-3@1.0.0)` | OFL-1.1 | sans-serif |
| `mono` | **Source Code Pro** `(source-code-pro@1.0.0)` | OFL-1.1 | monospace |

## Swatches

| ID | Name | Value |
|----|------|-------|
| `coursera-blue` | Coursera Blue | `#0056D2` |
| `bluish-white` | Bluish White | `#F3F8FF` |
| `blue-dark` | Blue Dark | `#003C8F` |
| `blue-pale` | Blue Pale | `#E3EEFF` |
| `blue-deep` | Blue Deep | `#002761` |
| `ink-50` | Ink 50 | `#1F1F1F` |
| `ink-100` | Ink 100 | `#303030` |
| `ink-300` | Ink 300 | `#616161` |
| `ink-500` | Ink 500 | `#757575` |
| `ink-700` | Ink 700 | `#9E9E9E` |
| `white` | White | `#FFFFFF` |
| `surface` | Surface | `#FAFAFA` |
| `surface-2` | Surface 2 | `#F5F5F5` |
| `border` | Border | `#E0E0E0` |
| `success` | Success | `#1B8057` |
| `warning` | Warning | `#F28100` |
| `error` | Error | `#F44336` |
| `error-deep` | Error Deep | `#66000F` |

## Mode role mappings

### Light mode

| Role | Swatch | Hex |
|------|--------|-----|
| `background` | `white` | `#FFFFFF` |
| `surface` | `bluish-white` | `#F3F8FF` |
| `surface-elevated` | `white` | `#FFFFFF` |
| `text-primary` | `ink-50` | `#1F1F1F` |
| `text-secondary` | `ink-300` | `#616161` |
| `text-tertiary` | `ink-500` | `#757575` |
| `primary` | `coursera-blue` | `#0056D2` |
| `primary-hover` | `blue-dark` | `#003C8F` |
| `accent` | `coursera-blue` | `#0056D2` |
| `accent-hover` | `blue-dark` | `#003C8F` |
| `warning` | `warning` | `#F28100` |
| `warning-hover` | `warning` | `#F28100` |
| `error` | `error` | `#F44336` |
| `success` | `success` | `#1B8057` |
| `border` | `border` | `#E0E0E0` |

### Dark mode

| Role | Swatch | Hex |
|------|--------|-----|
| `background` | `ink-50` | `#1F1F1F` |
| `surface` | `ink-100` | `#303030` |
| `surface-elevated` | `ink-300` | `#616161` |
| `text-primary` | `white` | `#FFFFFF` |
| `text-secondary` | `surface-2` | `#F5F5F5` |
| `text-tertiary` | `ink-700` | `#9E9E9E` |
| `primary` | `coursera-blue` | `#0056D2` |
| `primary-hover` | `bluish-white` | `#F3F8FF` |
| `accent` | `bluish-white` | `#F3F8FF` |
| `accent-hover` | `blue-pale` | `#E3EEFF` |
| `warning` | `warning` | `#F28100` |
| `warning-hover` | `warning` | `#F28100` |
| `error` | `error` | `#F44336` |
| `success` | `success` | `#1B8057` |
| `border` | `ink-300` | `#616161` |

## Brand semantic roles

### Colors

| Role | Swatch | Hex |
|------|--------|-----|
| `identity` | `white` | `#FFFFFF` |
| `on-identity` | `ink-50` | `#1F1F1F` |
| `primary` | `coursera-blue` | `#0056D2` |
| `primary-hover` | `blue-dark` | `#003C8F` |
| `accent` | `coursera-blue` | `#0056D2` |
| `accent-hover` | `blue-dark` | `#003C8F` |
| `mark` | `coursera-blue` | `#0056D2` |
| `success` | `success` | `#1B8057` |
| `warning` | `warning` | `#F28100` |
| `error` | `error` | `#F44336` |
| `text-primary-light` | `ink-50` | `#1F1F1F` |
| `text-primary-dark` | `white` | `#FFFFFF` |
| `background-light` | `white` | `#FFFFFF` |
| `background-dark` | `ink-50` | `#1F1F1F` |
| `surface-light` | `bluish-white` | `#F3F8FF` |
| `surface-dark` | `ink-100` | `#303030` |
| `text-secondary-light` | `ink-300` | `#616161` |
| `text-tertiary-light` | `ink-500` | `#757575` |
| `border-light` | `border` | `#E0E0E0` |

### Typography

| Role | Font role key |
|------|---------------|
| `display` | `heading` |
| `prose` | `body` |
| `code` | `mono` |

## Rules

### 🛑 error (6)

#### `colorChoice` → `roles.colors.primary`

- **allowed:** coursera-blue, blue-dark
- **forbidden:** bluish-white, blue-pale, blue-deep, success, warning, error

> Coursera Blue (#0056D2) is the single signature primary across the entire CDS. Bluish White and Blue Pale are surface tints, not action colors; Blue Deep is a callout / hero anchor. Repurposing semantic colors (success green, warning orange, error red) as the primary action color conflicts with their established semantic meaning in the product. 

#### `colorChoice` → `roles.colors.text-primary-light`

- **allowed:** ink-50, ink-100
- **forbidden:** black

> Coursera's canonical body text on coursera.org is Ink 50 (#1F1F1F) or Ink 100 (#303030). The CDS does not use pure #000000 for body copy — the near-black scale was chosen deliberately for reader comfort on the long-form course-syllabus and reading material the platform hosts. 

#### `forbiddenTreatment` → `logo`

- **treatments:** stretched, skewed, rotated, drop-shadow, recolored-non-brand, on-busy-photo, low-contrast-fill

> The Coursera wordmark and Coursera Blue are precise brand assets used across institutional and partner surfaces. Skew, rotation, drop shadow, or recoloring conflict with the brand's credentialing, university-adjacent posture; the press kit on coursera.org/about/press documents the allowed treatments. 

#### `contrastRatio` → `text-primary`

- **against:** `background`
- **minRatio:** `7`
- **standard:** `WCAG-AAA`

> Ink 50 (#1F1F1F) on White (#FFFFFF) gives roughly 16:1 — clears AAA decisively. Coursera's long-form course-reading posture, with syllabi, transcripts, and academic prose, justifies an AAA contrast target rather than the AA floor. 

#### `fontPairing` → `typography.display`

- **requires:** `prose`
- **minSizeRatio:** `1.4`

> Source Sans Pro serves both display and prose roles on coursera.org; the typographic hierarchy is established by size and weight within a single family. A 1.4× minimum display-to-prose ratio preserves that hierarchy for course titles and module headings. 

#### `accessibilityRequirement` → `*`

- **standard:** `WCAG-AA`
- **criterion:** `1.4.3`

> WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. Coursera's audience includes adult learners, institutional partners, and degree-program students; consumers composing in-brand surfaces must preserve the AA contrast floor on every text-on-color combination. 

### ⚠️ warning (2)

#### `enumMembership` → `typography.heading.fontWeight`

- **allowed:** 300, 400, 600, 700

> The Coursera live site uses Source Sans Pro at Light (300) for hero copy, Regular (400) for body, SemiBold (600) for emphasis, and Bold (700) for headings. Source Sans 3 — the open-source successor referenced here — ships the same weight band. 

#### `contextRestriction` → `roles.colors.primary`

- **forbiddenContexts:** large-fill, hero, background
- **allowedContexts:** cta, link, focus-ring, mark, data-viz-primary

> Coursera Blue is concentrated in CTAs, links, and the mark — never as a flood-fill background. The brand canvas is the White / Bluish White surface; Coursera Blue is the accent that punctuates that surface, not replaces it. 

### 💡 recommendation (1)

#### `compositionConstraint` → `roles.colors.primary`

- **pairsWith:** white, bluish-white, ink-50, blue-pale
- **doesNotPairWith:** warning, error, error-deep

> Coursera Blue reads cleanest on White or Bluish White, or as a fill on the Ink 50 dark canvas. Placing Coursera Blue adjacent to the orange warning or red error colors introduces chromatic conflict — the cool brand blue and the warm semantic accents fight for the same eye position without resolving into hierarchy. 

## Provenance

- **Source:** <https://www.coursera.org/about/press>
- **License:** `Proprietary — All Rights Reserved`
- **Attribution:** Coursera, Inc. — visual identity captured from the deployed front-page application on coursera.org (the Coursera Design System exposes BLUE / BLUISH_WHITE / WHITE constants and the --cds-color-* / --cds-font-family-* CSS custom-property families). The Coursera press kit on dropbox.com is referenced from /about/press as the official media asset source. The Coursera logo and associated marks are property of Coursera, Inc. 
- **Imported:** `2026-05-19`
- **Notes:** Coursera's font stack on the live site is Source Sans Pro (open source, SIL OFL) for Latin scripts and Boutros Coursera (proprietary) for Arabic. This atom references source-sans-3@1 as the canonical body and heading face — Source Sans 3 is the maintained successor to Source Sans Pro by Adobe / Google. The Boutros Coursera bilingual companion has no open-source substitute documented here. 

---

*Generated by the brand-atoms converter. Source: `coursera@1.0.0` from the encyclopedia.*