CURATED · OPEN · FREE

Flos

Premium Italian lighting brand with a minimalist, editorial aesthetic.

lightingdesign

↓ Download design system (27 MB)Open in OpenDesign

Visit: https://flos.com

📦 Browse pack contents →

Identity DNA

LightingDesignItalianArchitectureLuminaires

A gallery catalog for high-end lighting design.

Color

#FFFFFFInk

#000000BG

#FAFAFABG soft

#666666Muted

rgba(0,0,0,0.15)Line

High contrast photography dominates; text colors invert depending on light/dark contexts.

Typography

humanist-sans

display64px · 800
heading40px · 600
body16px · 400

Spacing

4px

8px

16px

24px

32px

40px

48px

64px

96px

Generous whitespace and tight letter spacing on headings.

Surfaces

sm · 2px

md · 4px

lg · 40px

pill · 999px

1px solid #000000 or #FFFFFF depending on context.

rgba(0, 0, 0, 0.15) 0px 4px 16px 0px

Layout

1280container

12columns

24pxgutter

768 / 1024breakpoints

Full-bleed hero image with overlaid text; grid-based product cards.

Motion & Interaction

200msmicro

300mssmall

600msmedium

cubic-bezier(0.455, 0.03, 0.515, 0.955)easing

Smooth fade-in transitions · Scale transformations on hover

Subtle opacity or background-color shift. · Standard pointer cursor.

Components

button Ghost button with 1px solid border and all-caps text.
card Image-heavy cards with no visible border or shadow.
hero Full-screen photographic background with left-aligned white text.

Voice & Don'ts

Tone Sophisticated, architectural, and restrained.
Headlines Bold, all-caps or title-case, minimal punctuation.
CTAs All-caps, ghost button style.

don't use bright, saturated colors — screenshot shows a palette dominated by black, white, and muted grays.
don't use rounded corners on primary elements — screenshot shows sharp edges or very subtle radius.
don't add heavy drop shadows to cards — screenshot shows flat, image-driven layouts.
don't use decorative or script fonts — screenshot shows a clean, humanist sans-serif for all text.
don't clutter the hero section with multiple CTAs — screenshot shows a single, clear 'DISCOVER MORE' button.
don't use busy backgrounds behind text — screenshot ensures legibility through dark overlays or solid backgrounds.
Avoid: Loud colors
Avoid: Playful fonts
Avoid: Excessive UI chrome
Avoid: Heavy shadows

Inside the pack — real screenshots

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

Captured from the live site · real computed styles

System prompt

This is a premium Italian lighting brand e-commerce site with a minimalist, editorial aesthetic. The design prioritizes high-quality photography with a high-contrast palette of black (#000000), white (#FFFFFF), and muted gray (#666666). Typography is a clean humanist sans-serif used in both regular and uppercase weights for headings. Critical design constraints: never use bright or saturated accent colors, maintain generous whitespace, and avoid heavy UI elements like thick borders or complex shadows. The layout is strictly grid-based with a focus on large, full-bleed imagery to showcase products in context.

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