Extreme minimalism with a strict black-and-white palette punctuated by photography
03
Typography
humanist-sans
display60px · 300
h148px · 300
body18px · 300
small16px · 300
Font weight is predominantly 300 (light) for a refined, elegant aesthetic · Line lengths are tightly controlled to maintain readability on large display text · Typographic hierarchy relies heavily on size differences rather than weight variations
04
Spacing
4px
8px
16px
24px
32px
48px
64px
96px
Generous vertical spacing between sections creates a sense of luxury and breathing room
05
Surfaces
sm · 0px
md · 0px
lg · 16px
pill · 9999px
Thin 1px borders used sparingly for list dividers
06
Layout
1280container
12columns
40pxgutter
768 / 1024breakpoints
Asymmetric two-column layout with generous whitespace and full-bleed image carousels
07
Motion & Interaction
200msmicro
300mssmall
600msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
Smooth color and opacity transitions on interactive elements · Horizontal scrolling carousels for project imagery
Subtle color changes on text links, typically to muted gray · Standard pointer cursor throughout interactive areas
08
Components
buttonText-only buttons without background styling, relying on hover states
cardSimple image cards with minimal typography underneath
heroFull-width text-heavy hero with an overlapping horizontal image carousel below
09
Voice & Don'ts
ToneAuthoritative, sophisticated, and restrained
HeadlinesDeclarative and factual statements about the practice
CTAsUnderstated text links rather than prominent buttons
Don't use heavy font weights — screenshot shows exclusively light (300) weight typography
Don't add drop shadows to UI elements — screenshot shows completely flat surfaces
Don't use a vibrant accent color — screenshot shows strictly black, white, and gray
Don't use rounded corners on cards or buttons — screenshot shows mostly sharp rectangular edges
Don't crowd the layout with elements — screenshot shows extensive whitespace between sections
Don't use colored background sections — screenshot shows a uniform white background throughout
Captured from the live site · real computed styles
11
System prompt
This is the website for Snøhetta, a global transdisciplinary architecture and design practice. The design DNA is defined by extreme minimalism, utilizing a strict monochrome palette of pure black (#000000) for text on a pure white (#FFFFFF) background, with #757575 and #949494 for secondary and muted text. The typography exclusively uses a light weight (300) humanist-sans font family (Dovre) at large display sizes, creating a refined, elegant aesthetic. The layout features generous whitespace, thin 1px dividers, and an asymmetric two-column structure with full-bleed image carousels. Critical design rules: never use bold font weights, never add drop shadows or vibrant accent colors, never crowd the layout, always maintain generous spacing, and rely on size hierarchy rather than weight for visual distinction. The overall feel is that of a premium, high-end design portfolio that lets the work speak for itself.
Bring this taste to your agent
Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.
