# Duolingo

> `duolingo@1.0.0`

Duolingo is the world's largest language-learning platform — free, gamified, mobile-first, and anchored by Duo the green owl, one of the most recognizable mascots in consumer software. The brand voice is playful, character-led, and unapologetically extrinsic: streaks, hearts, gems, leagues, push notifications with personality. Visually, Duolingo is light-first with Snow / Polar canvases, an Eel ink text color (never pure black), and the famous Feather Green (#58CC02) as the primary action and identity color. The entire palette is animal-named — Owl, Macaw, Cardinal, Bee, Beetle, Eel, Swan, Hare — and that vocabulary is itself part of the brand's voice. Typography is the proprietary DIN Round Pro (body) and Feather Bold (display).


**Tags:** `duolingo`, `education`, `language-learning`, `gamified`, `brand`, `light-first`, `green`, `feather`, `owl`

## Atoms

### Palette

**Duolingo** · `duolingo@1.0.0` · Proprietary — All Rights Reserved

> Duolingo's brand palette, captured directly from the published brand guidelines at design.duolingo.com. The system is famously animal-named — every color is a creature — and the primary brand color is Feather Green (the Owl), the signature of Duo the mascot. The light-first surface canvas is Snow on Polar, with Eel as the deep ink text color. Secondary characters Macaw (blue), Cardinal (rose-red), Bee (yellow), Beetle (purple), and Fox (orange) round out the playful educational identity. Duolingo's product UI is light-first by default; a dark mode flips Eel to canvas and Snow to text. 

### Fonts

| Role | Font | License | Classification |
|------|------|---------|----------------|
| `heading` | **Inter** `(inter@1.0.0)` | OFL-1.1 | sans-serif |
| `body` | **Inter** `(inter@1.0.0)` | OFL-1.1 | sans-serif |
| `mono` | **JetBrainsMono Nerd Font** `(jetbrainsmono-nerdfont@1.0.0)` | OFL-1.1 | monospace |

## Swatches

| ID | Name | Value |
|----|------|-------|
| `feather-green` | Feather Green (Owl) | `#58CC02` |
| `mask-green` | Mask Green | `#89E219` |
| `tree-frog` | Tree Frog | `#58A700` |
| `sea-sponge` | Sea Sponge | `#D7FFB8` |
| `turtle` | Turtle | `#A5ED6E` |
| `snow` | Snow | `#FFFFFF` |
| `polar` | Polar | `#F7F7F7` |
| `swan` | Swan | `#E5E5E5` |
| `hare` | Hare | `#AFAFAF` |
| `wolf` | Wolf | `#777777` |
| `eel` | Eel | `#4B4B4B` |
| `cardinal` | Cardinal | `#FF4B4B` |
| `fire-ant` | Fire Ant | `#EA2B2B` |
| `crab` | Crab | `#FF7878` |
| `flamingo` | Flamingo | `#FFB2B2` |
| `bee` | Bee | `#FFC800` |
| `lion` | Lion | `#FFB100` |
| `fox` | Fox | `#FF9600` |
| `duck` | Duck | `#FBE56D` |
| `canary` | Canary | `#FFF5D3` |
| `macaw` | Macaw | `#1CB0F6` |
| `whale` | Whale | `#1899D6` |
| `humpback` | Humpback | `#2B70C9` |
| `narwhal` | Narwhal | `#1453A3` |
| `blue-jay` | Blue Jay | `#84D8FF` |
| `moon-jelly` | Moon Jelly | `#7AF0F2` |
| `beetle` | Beetle | `#CE82FF` |
| `betta` | Betta | `#9069CD` |
| `butterfly` | Butterfly | `#6F4EA1` |
| `starfish` | Starfish | `#FFAADE` |

## Mode role mappings

### Light mode

| Role | Swatch | Hex |
|------|--------|-----|
| `background` | `snow` | `#FFFFFF` |
| `surface` | `polar` | `#F7F7F7` |
| `surface-elevated` | `snow` | `#FFFFFF` |
| `text-primary` | `eel` | `#4B4B4B` |
| `text-secondary` | `wolf` | `#777777` |
| `text-tertiary` | `hare` | `#AFAFAF` |
| `primary` | `feather-green` | `#58CC02` |
| `primary-hover` | `tree-frog` | `#58A700` |
| `accent` | `macaw` | `#1CB0F6` |
| `accent-hover` | `whale` | `#1899D6` |
| `warning` | `bee` | `#FFC800` |
| `warning-hover` | `lion` | `#FFB100` |
| `error` | `cardinal` | `#FF4B4B` |
| `success` | `feather-green` | `#58CC02` |
| `border` | `swan` | `#E5E5E5` |

### Dark mode

| Role | Swatch | Hex |
|------|--------|-----|
| `background` | `eel` | `#4B4B4B` |
| `surface` | `wolf` | `#777777` |
| `surface-elevated` | `hare` | `#AFAFAF` |
| `text-primary` | `snow` | `#FFFFFF` |
| `text-secondary` | `polar` | `#F7F7F7` |
| `text-tertiary` | `swan` | `#E5E5E5` |
| `primary` | `feather-green` | `#58CC02` |
| `primary-hover` | `mask-green` | `#89E219` |
| `accent` | `macaw` | `#1CB0F6` |
| `accent-hover` | `blue-jay` | `#84D8FF` |
| `warning` | `bee` | `#FFC800` |
| `warning-hover` | `lion` | `#FFB100` |
| `error` | `cardinal` | `#FF4B4B` |
| `success` | `mask-green` | `#89E219` |
| `border` | `wolf` | `#777777` |

## Brand semantic roles

### Colors

| Role | Swatch | Hex |
|------|--------|-----|
| `identity` | `snow` | `#FFFFFF` |
| `on-identity` | `eel` | `#4B4B4B` |
| `primary` | `feather-green` | `#58CC02` |
| `primary-hover` | `tree-frog` | `#58A700` |
| `accent` | `macaw` | `#1CB0F6` |
| `accent-hover` | `whale` | `#1899D6` |
| `mark` | `feather-green` | `#58CC02` |
| `success` | `feather-green` | `#58CC02` |
| `warning` | `bee` | `#FFC800` |
| `error` | `cardinal` | `#FF4B4B` |
| `text-primary-light` | `eel` | `#4B4B4B` |
| `text-primary-dark` | `snow` | `#FFFFFF` |
| `background-light` | `snow` | `#FFFFFF` |
| `background-dark` | `eel` | `#4B4B4B` |
| `surface-light` | `polar` | `#F7F7F7` |
| `surface-dark` | `wolf` | `#777777` |
| `text-secondary-light` | `wolf` | `#777777` |
| `text-tertiary-light` | `hare` | `#AFAFAF` |
| `border-light` | `swan` | `#E5E5E5` |
| `border-dark` | `wolf` | `#777777` |

### Typography

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

## Rules

### 🛑 error (8)

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

- **allowed:** feather-green, tree-frog
- **forbidden:** mask-green, macaw, bee, cardinal, beetle, fox

> Feather Green (#58CC02) is Duo the owl's signature color and the brand's primary action color across every surface in the product. Mask Green is the brighter signage sibling reserved for illustration; Macaw, Bee, Cardinal, Beetle, and Fox are character / semantic secondaries that must not stand in for the primary brand action color. 

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

- **allowed:** eel, wolf
- **forbidden:** black

> Duolingo's published guidelines explicitly avoid pure #000000 for body copy. The canonical text ink is Eel (#4B4B4B) on light surfaces; Wolf (#777777) is the secondary text grey. Pure black reads too harsh against the brand's playful, child-friendly posture and breaks the warmth of the Snow / Polar canvas. 

#### `colorChoice` → `roles.colors.mark`

- **allowed:** feather-green
- **forbidden:** tree-frog, mask-green, macaw, bee, cardinal, beetle

> Duo the owl mascot's body fill is Feather Green specifically. Tree Frog is the pressed / shadow variant and must not be used as the mark fill itself. Recolored mascots — purple Duo, blue Duo, red Duo — only appear in sanctioned editorial moments (e.g., Super promotional art) and are not part of the standard mark vocabulary. 

#### `forbiddenTreatment` → `logo`

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

> Duo the owl and the Duolingo wordmark are precise brand assets. The mascot has a documented set of poses and emotions; arbitrary skew, rotation, or recoloring breaks the character vocabulary. Drop shadows conflict with the brand's flat, illustration-first visual system. 

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

- **against:** `background`
- **minRatio:** `4.5`
- **standard:** `WCAG-AA`

> Eel (#4B4B4B) on Snow (#FFFFFF) gives roughly 9.5:1 — clears AA decisively. Duolingo's product surfaces are used by children and language learners worldwide; the AA contrast floor is the floor and consumers must not drop below it when composing custom text colors on the Snow / Polar canvas. 

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

- **requires:** `prose`
- **minSizeRatio:** `1.5`

> Duolingo pairs the heavier Feather Bold display face with DIN Round Pro for body prose on lesson and marketing surfaces. A 1.5× minimum display-to-prose size ratio preserves the typographic hierarchy that makes streak counters, XP rewards, and lesson titles read as celebrations rather than as labels. 

#### `contextRestriction` → `roles.colors.error`

- **forbiddenContexts:** confirmation, completion, large-fill, hero
- **allowedContexts:** error-state, destructive-action, data-viz-negative

> Cardinal (#FF4B4B) is reserved for wrong-answer feedback, streak-loss warnings, and destructive confirmations. Using Cardinal as a large background fill or hero accent conflicts with its established negative-feedback meaning in the product — learners read large red surfaces as mistakes. 

#### `accessibilityRequirement` → `*`

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

> WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. Duolingo serves a global K-12 and adult learner audience; consumers composing in-brand surfaces must preserve the AA contrast floor on every text-on-color combination. 

### ⚠️ warning (1)

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

- **allowed:** 500, 700

> Duolingo's product UI uses DIN Round Pro at Medium (500) and Bold (700) for body and headings, with Feather Bold (700) for display. The brand does not use Light (300) or Black (900) weights on product surfaces — they conflict with the rounded, friendly type voice. Inter substitutes preserve the same weight band. 

### 💡 recommendation (1)

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

- **pairsWith:** snow, polar, eel, tree-frog
- **doesNotPairWith:** mask-green, bee, fox

> Feather Green reads cleanest against the Snow / Polar canvas or as a fill on the Eel ink. Placing Feather Green adjacent to Mask Green creates near-identical green-on-green; adjacent Bee and Fox introduce warm-cool conflict that fights the green for the same eye position without resolving into hierarchy. 

## Provenance

- **Source:** <https://design.duolingo.com/>
- **License:** `Proprietary — All Rights Reserved`
- **Attribution:** Duolingo, Inc. — visual identity captured from the published Duolingo Brand Guidelines (design.duolingo.com) and the deployed stylesheet on duolingo.com. The animal-named palette is the brand's own vocabulary. Duolingo, Duo, the green owl, the Feather typeface, and associated marks are property of Duolingo, Inc. 
- **Imported:** `2026-05-19`
- **Notes:** Duolingo's proprietary typefaces are DIN Round Pro (Regular, Medium, Bold) for body and Feather Bold for display headings. Neither is publicly distributed; this atom references inter@1 as the open-source substitute for both the display and body roles, with jetbrainsmono-nerdfont@1 for incidental code snippets in support content. The canonical text ink is Eel (#4B4B4B), NOT pure #000000 — pure black is forbidden in body copy per the published guidelines, which is encoded as a colorChoice rule below. 

---

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