CURATED · OPEN · FREE

OMA

A monolithic architecture portfolio that lets the buildings speak while the UI retreats

architecturestudio
OMA screenshot
↓ Download design system (75 MB)Open in OpenDesign

Visit: https://www.oma.com

📦 Browse pack contents →

01

Identity DNA

ArchitectureStudioGlobalEditorialMinimal

A monochromatic Swiss watch that occasionally ticks in red

02

Color

#FF0000Accent
#000000Ink
#FFFFFFBG
#666666Muted
rgba(0,0,0,1.0)Line

Strict black-and-white foundation interrupted only by a single, sharp red accent for vital metadata

03

Typography

grotesque-sans

All caps is mandatory for display hierarchy · Tight negative letter-spacing is required for large text · Font weight alternates strictly between 500 and 700

04

Spacing

4px
8px
12px
16px
24px
32px
48px
64px
96px

Rigid 4px base unit used consistently for padding and internal element spacing

05

Surfaces

sm · 0px
md · 0px
lg · 0px
pill · 0px

Hard 4px solid borders used exclusively to highlight time-sensitive content blocks

06

Layout

1280container
12columns
24pxgutter
768 / 1024breakpoints

Edge-to-edge photography with overlaid hard-edged typography containers

07

Motion & Interaction

220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing

Standard link transitions (all properties)

Standard pointer cursor on all text links and elements · Standard pointer interaction

08

Components

09

Voice & Don'ts

10

Inside the pack — real screenshots

OMA — 桌面首屏（hero）
桌面首屏（hero）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
OMA — 移动首屏
移动首屏

Captured from the live site · real computed styles

11

System prompt

A global architecture portfolio site (OMA) that uses a minimalist, high-contrast design system. The palette is strictly black (#000000) and white (#FFFFFF), with a single, sharp red accent (#FF0000) used only for date metadata. The typography is a uniform grotesque sans-serif (Arial W01) used exclusively in uppercase with tight negative letter-spacing. All components are flat with hard 0px corners and zero drop shadows, relying on massive, full-bleed architectural photography to provide visual interest. Key critical donts: never use border-radius, never add drop shadows, and never use lowercase letters for headlines.

Bring this taste to your agent

Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.

OpenDesign skill ↗ · This pack for agents ↗

en · zh-CN · zh-TW · ja · ko