A gallery of bold work with a loud signature color.
02
Color
#FF4F00Accent
#000000Ink
#EBE9E3BG
#FFFFFFBG soft
#767676Muted
rgba(0,0,0,1.0)Line
High contrast monochrome base with a single vibrant orange focal point.
03
Typography
geometric-sans
display120px · 400
h186px · 400
h240px · 400
body16px · 400
Use the declared Moderat typeface family. · Maintain a heavy reliance on font weight 400 for display and body. · Keep letter-spacing tight for large headlines.
04
Spacing
4px
8px
16px
20px
24px
32px
40px
64px
100px
Generous whitespace with explicit padding blocks (40px, 100px).
05
Surfaces
sm · 0px
md · 0px
lg · 0px
pill · 999px
Sharp, 1px black lines used sparingly for dividers.
06
Layout
1200container
12columns
20pxgutter
768 / 1024breakpoints
Full-width hero block followed by edge-to-edge project imagery.
07
Motion & Interaction
150msmicro
300mssmall
750msmedium
cubic-bezier(0.55, 0.055, 0.675, 0.19)easing
Color and opacity transitions on interactive elements. · Transform-based cursor or hover effects.
Color transitions using ease-in-out. · Subtle linear opacity shifts.
08
Components
buttonMinimalist navigation with simple text or thin hamburger icon.
cardEdge-to-edge image blocks with overlaid typography.
heroMassive solid color block with centered text.
09
Voice & Don'ts
ToneConfident, minimal, professional.
HeadlinesMassive, lowercase or sentence-case geometric sans.
CTAsSubtle text links.
Don't use multiple accent colors — the screenshot shows a strict orange accent (#FF4F00).
Don't use serif fonts — the screenshot shows a geometric sans-serif (Moderat).
Don't add shadows or rounded corners to main blocks — the screenshot shows sharp edges.
Don't use bold font weights for headlines — the screenshot shows font weight 400.
Don't add decorative icons or graphics — the screenshot shows typography-only design.
Don't use wide letter-spacing for headlines — the screenshot shows tight negative tracking.
Captured from the live site · real computed styles
11
System prompt
This is a minimalist design agency site featuring massive geometric sans-serif typography and a strict color palette of off-white (#EBE9E3), black (#000000), and a vibrant orange (#FF4F00). The layout uses generous whitespace and full-width blocks to showcase work. For any new pages, ensure large typography remains the hero, maintain the specific orange accent sparingly, and never use serif fonts, rounded corners on layout blocks, or bold font weights 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.
