# S02 — Minimalist Monochrome
## Industry: SaaS
## Style DNA
- **Palette:** Pure black and white with occasional gray. No colors.
- **Typography:** Bold editorial fonts. Strong contrast between sizes. Serif or geometric sans.
- **Radius:** Sharp corners (0-2px). Architectural precision.
- **Shadow:** None or hard shadows only.
- **Border:** Thick black rules. Strong dividers.
- **Patterns:** None. Typography is the pattern.
- **Motion:** Minimal. Instant or very quick transitions.
## Do's
- Use strong black and white contrast
- Emphasize typography hierarchy
- Use bold editorial layouts
- Keep imagery minimal
## Don'ts
- Don't use colors unless intentional
- Don't add unnecessary elements
- Don't use rounded corners excessively
- Don't use playful animations
## Design Tokens
```yaml
tokens:
meta:
style_id: "S02"
style_name: "Minimalist Monochrome"
industry: "SaaS"
use_case: "Full Landing Page"
color:
bg:
primary: "#FFFFFF"
secondary: "#F5F5F5"
text:
primary: "#000000"
secondary: "#333333"
muted: "#666666"
brand:
primary: "#000000"
accent: "#000000"
border:
strong: "#000000"
subtle: "#E0E0E0"
state:
success: "#000000"
warning: "#000000"
error: "#000000"
focus:
ring: "#000000"
radius:
none: 0
sm: 0
md: 2
border:
width:
hairline: 1
medium: 2
strong: 3
shadow:
none: none
hard: "4px 4px 0 #000000"
layout:
container:
content: 1120
wide: 1280
grid:
desktop: 12
tablet: 8
mobile: 4
gutter:
mobile: 16
desktop: 24
motion:
duration:
fast: 0
normal: 100
easing: linear
typography:
font:
sans:
primary: "Playfair Display"
fallback:
- "Georgia"
- "Times New Roman"
- "serif"
mono:
primary: "JetBrains Mono"
fallback:
- "ui-monospace"
- "SFMono-Regular"
scale:
h1: { size: 56, line: 64, weight: 700, tracking: -0.02 }
h2: { size: 40, line: 48, weight: 700, tracking: -0.01 }
h3: { size: 28, line: 36, weight: 700, tracking: -0.005 }
body: { size: 16, line: 24, weight: 450, tracking: 0 }
small: { size: 14, line: 20, weight: 450, tracking: 0 }
measure:
hero_max: "48ch"
body_max: "72ch"
spacing:
base: 8
section_py:
mobile: [64, 80]
desktop: [112, 128]
```
