# Design Style Guide: Just a moment...



> Source: https://www.producthunt.com

> Extracted: 2026-05-15 22:25

> Viewport: 1280x720 | Full page: 720px



## Design Philosophy



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

- **Dual typeface** — system-ui (UI) + monospace (code/accent)

- **Generous whitespace** — large section gaps for breathing room



---



## Color Palette



### Text



**Dark / Base**

- `#313131` (used 19x)

- `#0000ee`



### Borders



**Dark / Base**

- `#313131`



**Light / Surface**

- `#d9d9d9`





## Typography



**Font stack**: system-ui, monospace



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

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

| Display / H1 | system-ui | 40px | 600 | 50px | normal |

| H2 | system-ui | 24px | 600 | 30px | normal |

| Body | system-ui | 16px | 400 | 18.4px | normal |

| Caption | system-ui | 12px | 400 | 18px | normal |

| Code | monospace | 12px | 400 | 18px | normal |





## Spacing Scale



`8px` · `16px` · `32px` · `128px` · `160px`



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





## Layout Patterns



### Flexbox

- `<div>`, row, align: center, gap: 16px, (2 children)





## Assets



1 images, 0 SVG icons detected.



- `32px × 32px` Icon for www.producthunt.com — `https://www.producthunt.com/favicon.ico`

