CURATED · OPEN · FREE

Lilnasx Jeanpaulgaultier

A stark, monochromatic luxury e-commerce experience that prioritizes editorial photography and brutalist typography.

PhotographicCurationPremiumBold TypographyEditorial

↓ Download design system (17 MB)Open in OpenDesign

Visit: https://lilnasx.jeanpaulgaultier.com/en

📦 Browse pack contents →

Identity DNA

High FashionAvant-GardeAvant-GardeLuxuryArtistic

A high-fashion editorial lookbook with stark contrast and bold typography.

Color

#000000Ink

#222222Ink soft

#828282BG

#E0E0E0BG soft

rgba(0,0,0,1.0)Line

High-contrast monochromatic palette that lets the photography dictate the visual interest.

Typography

slab-serif · grotesque-sans · monospaced

display30px · 400
body16px · 400
caption11px · 400

Use the custom display font for all major headings to maintain the avant-garde brand identity. · Navigation and UI labels are set in a strict uppercase grotesque-sans. · Maintain tight line heights for display text to match the editorial aesthetic.

Spacing

4px

8px

16px

24px

32px

48px

64px

96px

Tight, 4px-based rhythm that respects the strict grid layout of the product display.

Surfaces

sm · 2px

md · 2px

lg · 2px

pill · 999px

Solid 1px black lines used for grids and inputs.

0 0 5px 0 rgb(128, 128, 128)

Layout

1440container

12columns

768 / 1024breakpoints

Edge-to-edge photography split into a strict 2-column grid for products.

Motion & Interaction

150msmicro

200mssmall

320msmedium

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

Smooth fade-in for modal overlays. · Subtle transform transitions for interactive elements.

Standard pointer cursor with minimal visual feedback on most elements. · Instant state changes for form inputs.

Components

button Full-width, solid black rectangles with centered white uppercase text.
card Borderless image cards with text and price aligned to the bottom.
chip N/A
input Minimalist fields with a 1px black border and left-aligned uppercase labels.
hero A dramatic 50/50 split-screen featuring full-bleed editorial photography.

Voice & Don'ts

Tone Assertive, avant-garde, and strictly professional.
Headlines Short, punchy, all-caps statements or minimal product names.
CTAs Direct, all-caps commands like 'OK' or 'LOGIN'.

don't use rounded corners — the design relies on sharp, brutalist rectangular edges.
don't add drop shadows to cards — the layout uses a flat, borderless grid system.
don't use multi-color gradients — the palette is strictly monochromatic with high contrast.
don't use lowercase for navigation — the design strictly enforces uppercase for all UI labels.
don't add decorative elements around buttons — the interface relies on solid black blocks.
don't use center-aligned body text — the layout uses left-aligned typography for readability.
Avoid: Playful language
Avoid: Soft gradients
Avoid: Friendly exclamation marks

Inside the pack — real screenshots

Lilnasx Jeanpaulgaultier — 桌面首屏（hero） — 桌面首屏（hero）

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

Captured from the live site · real computed styles

System prompt

Design a high-fashion luxury e-commerce interface that feels like a premium editorial lookbook. Use a strict monochromatic palette (black, white, grey) where the photography provides all visual interest. Use a custom slab-serif for display text and a grotesque-sans for UI elements. Maintain a brutalist aesthetic with sharp rectangular buttons, 1px black borders, and full-bleed photography. Ensure all navigation and UI text is strictly uppercase. Key colors are #000000, #828282, and #FFFFFF. Avoid playful elements, rounded corners, and soft gradients to preserve the avant-garde brand identity.

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