CURATED · OPEN · FREE

Victoiredouy

A stark, typographic portfolio or editorial site featuring massive display headings against a deep black background.

EditorialBold TypographyMonochromeCleanRefined

↓ Download design system (14 MB)Open in OpenDesign

Visit: https://victoiredouy.com

📦 Browse pack contents →

Identity DNA

editorialminimalisttypography-drivenhigh-contrast

A high-contrast black-and-white editorial magazine with oversized, condensed display type.

Color

#FAFAFAInk

#DCDCDCInk soft

#000000BG

#767676Muted

rgba(220, 220, 220, 1.0)Line

Strict monochrome palette using near-black backgrounds and near-white text for maximum contrast and editorial impact.

Typography

condensed-grotesque-sans · monospaced

display177px · 400
heading54px · 400
body15px · 400

Use Space Mono for body text and navigation. · Use a condensed grotesque sans for massive display headings. · Apply tight negative tracking to large display text. · Use uppercase transform for navigation and certain labels.

Spacing

4px

8px

16px

24px

32px

48px

64px

96px

Loose and varied, with significant vertical padding separating major sections.

Surfaces

sm · 0px

md · 0px

lg · 0px

pill · 999px

Thin 2px borders used primarily for interactive states and subtle separation.

0px 1px 2px rgba(0,0,0,0.5) · 0px 0px 0px 1px rgba(250,250,250,0.1)

Layout

1280container

12columns

24pxgutter

768 / 1024breakpoints

Full-width columns designed to accommodate extremely large typography.

Motion & Interaction

220msmicro

400mssmall

800msmedium

cubic-bezier(0.4, 0, 0.2, 1)easing

Smooth color transitions on interactive elements. · Eased opacity and transform transitions for UI state changes.

Subtle color or background-color shifts on interactive elements. · Standard active states.

Components

button Minimal, text-based buttons with uppercase monospaced text and thin borders.
card None visible.
chip None visible.
input None visible.
hero A massive, screen-filling typographic hero section with oversized condensed text.

Voice & Don'ts

Tone Minimalist and severe.
Headlines Massive, tightly tracked, condensed uppercase display type.
CTAs Understated monospaced text labels.

Don't use rounded corners — screenshot shows sharp, zero-radius edges.
Don't use vibrant accent colors — screenshot shows a strict monochrome palette.
Don't use light or serif display fonts — screenshot shows heavy, condensed sans-serif display type.
Don't use generous line-height for headings — screenshot shows tightly packed, almost touching display lines.
Don't use wide letter-spacing for display text — screenshot shows tight, negative letter-spacing.
Don't use drop shadows on text — screenshot shows flat, high-contrast typography.
Avoid: Colorful gradients
Avoid: Rounded corners
Avoid: Drop shadows on text
Avoid: Playful or decorative elements

Inside the pack — real screenshots

Victoiredouy — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Captured from the live site · real computed styles

System prompt

This design is a minimalist, typography-driven editorial site characterized by stark black-and-white contrast and massive, condensed display headings. The primary palette relies strictly on deep black (#000000) for backgrounds and near-white (#FAFAFA) for text, with subtle grey (#DCDCDC, #767676) for secondary elements. Typography is the dominant feature, utilizing a condensed grotesque sans for oversized display type and a monospaced font (Space Mono) for body text and navigation. Layouts are clean and spacious to accommodate large text scales. Critical prohibitions include avoiding rounded corners, vibrant accent colors, drop shadows on text, and wide letter-spacing for display headings.

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