# Design Style Guide: NPR : National Public Radio



> Source: https://text.npr.org

> Extracted: 2026-05-15 22:30

> Viewport: 1280x720 | Full page: 1292px



## Design Philosophy



- **Light theme** — light/white backgrounds with dark text

- **Single typeface** (-apple-system) — unified, cohesive feel



---



## Color Palette



### Backgrounds



**Light / Surface**

- `#ffffff`



### Text



**Dark / Base**

- `#000000` (used 44x)

- `#0000ee` (used 27x)



### Borders



**Dark / Base**

- `#000000`





## Typography



**Font stack**: -apple-system



| Role | Font | Size | Weight | Line Height | Tracking |

|------|------|------|--------|-------------|----------|

| Display / H1 | -apple-system | 24px | 700 | 32px | normal |

| Body | -apple-system | 16px | 400 | normal | normal |





## Spacing Scale



`4px` · `8px` · `15px` · `16px` · `20px` · `40px`



*Based on a **8px grid** system.*





## Component Patterns



### Buttons



- **"Go To Full Site"** (filled)

  - `background: #ffffff` · `color: #000000`

  - `font: 16px / 400`

  - `padding: 4px 8px` · `radius: 0px`



### Navigation



- **3 links**: News, Culture, Music

  - Layout: `block`, gap: `normal`



- **4 links**: Contact Us, Terms of Use, Permissions, Privacy Policy

  - Layout: `block`, gap: `normal`



