# Scandinavian

Also called: Scandi design, Nordic minimalism, hygge web, Nordic clean, Danish modern  
Era: 1950s furniture heritage; web usage 2014 onward (furniture, fashion, fintech from the Nordics)  
Page: https://designforai.dev/style/scandinavian

## Traits

- light, airy layouts with warm whites and pale wood tones
- functional simplicity: clear grid, honest materials, product photography in daylight
- muted natural accents: sage, dusty blue, ochre, clay, charcoal
- geometric or humanist sans in medium weight, comfortable sizes
- gentle radius (6-10px), hairline borders, almost no shadow
- product-first: big photos with generous margins, short captions
- calm motion, nothing decorative

Palette: #faf8f5 warm white, #2b2b2b charcoal, #a8b5a0 sage, #c9a27e wood, #6f8fa6 dusty blue, #e8e4de line

Type: Manrope, DM Sans or Karla; headings 500 at 32-56px with -0.01em, body 400 at 16-17px line-height 1.6; occasionally a light serif (Cormorant) for one word

## Do

- shoot or select photography in soft daylight with natural materials; the images carry the style
- keep colour to warm neutrals plus one muted accent that appears in the photos too
- use lots of horizontal space: 2-column product layouts with 48-64px gutters

## Don't

- do not use cold blue-greys or pure white; warmth is the difference from generic minimalism
- do not add decorative illustration; photos and type only
- do not over-round; 6-10px, not pills

Known for it: HAY, Muuto, Klarna (2019 partial), Normann Copenhagen, Aesop-adjacent

## CSS seed

```css
:root{--bg:#faf8f5; --fg:#2b2b2b; --muted:#7a7570; --accent:#a8b5a0; --accent2:#c9a27e; --line:#e8e4de; --radius:8px; --font:'Manrope',sans-serif}
```

## Prompt

Build the site in Scandinavian style. Background #faf8f5, text #2b2b2b, muted #7a7570, hairlines #e8e4de, accents sage #a8b5a0 and wood #c9a27e, one dusty blue #6f8fa6 for links. Font Manrope: headings 500 at 52/34/24px with -0.01em, body 400 at 17px, line-height 1.6, captions 13px in muted. Layout: 12-column grid with 56px gutters on desktop, product blocks as two-column pairs (image left, text right, then alternated), 128px between sections. Images: daylight photography of natural materials, border-radius 8px, no border, no shadow, full column width. Cards, when needed, are transparent with a 1px #e8e4de border and 8px radius. Primary button: #2b2b2b fill, #faf8f5 text, radius 8px, 46px tall; secondary is text with an arrow. Nav is thin: logo, four links, 64px tall, 1px bottom hairline. No icons except a 20px arrow and cart. Motion: 250ms ease on hover, image opacity fade on scroll over 500ms.