CURATED · OPEN · FREE

Louis Poulsen

A premium lighting brand with a clean, editorial, and gallery-focused visual language.

lightingdesign

↓ Download design system (20 MB)Open in OpenDesign

Visit: https://www.louispoulsen.com

📦 Browse pack contents →

Identity DNA

designlightingpremiumarchitectural

An editorial gallery for high-end industrial design

Color

#000000Ink

#333333Ink soft

#FFFFFFBG

#F6F6F6BG soft

#808080Muted

rgba(0,0,0,0.25)Line

High-contrast, monochromatic palette that lets rich photography and white space dominate.

Typography

transitional-serif · humanist-sans

display56px · 300
headline30px · 300
body14px · 400

Spacing

4px

8px

16px

24px

32px

48px

64px

96px

4px base grid with comfortable, generous whitespace for an editorial feel.

Surfaces

sm · 2px

md · 4px

lg · 40px

pill · 999px

1px solid rgba(0,0,0,0.25) for separators; heavy use of borders for interactive list items.

Layout

1440container

12columns

24pxgutter

768 / 1024breakpoints

Asymmetric editorial layout with large hero images, multi-column masonry-style photo grids, and full-width list sections.

Motion & Interaction

150msmicro

200mssmall

350msmedium

ease-in-outeasing

Smooth hover transitions on links and list items, subtle scaling transforms on interactive elements.

Subtle background or text color changes; active state indicators on category list items. · Clean state changes, minimal visual feedback to maintain elegance.

Components

button Understated, text-heavy buttons with minimal decoration; prominent black-filled 'SEE MORE' action button.
card Edge-to-edge photography in a dense grid layout with no visible padding or background.
hero Full-viewport cinematic image with large, elegant serif text overlay and minimal supporting copy.

Voice & Don'ts

Tone Confident, premium, and evocative, focusing on the craft and history of lighting design.
Headlines Elegant, all-caps serif typography with tight tracking.
CTAs Minimalist, often using simple arrows or uppercase sans-serif text.

don't use rounded corners — screenshot shows sharp 90-degree edges on all UI components.
don't use drop shadows — screenshot shows flat surfaces relying on borders and photography for depth.
don't use bright accent colors — screenshot shows a strictly monochromatic palette with black, white, and gray.
don't use bold font weights — screenshot shows predominantly regular (400) and light (300) weights.
don't use cluttered navigation — screenshot shows a minimal top bar with ample horizontal spacing.
don't use heavy container padding — screenshot shows a layout that allows photography and text to sit near the viewport edges.
Avoid: Cluttered layouts
Avoid: Loud or aggressive colors
Avoid: Playful or overly casual language

Inside the pack — real screenshots

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

Captured from the live site · real computed styles

System prompt

This site is a premium editorial e-commerce experience for a high-end lighting brand. The design relies heavily on cinematic photography, generous whitespace, and a strict monochromatic palette of white (#FFFFFF) and black (#000000) with neutral grays (#F6F6F6). Typography uses a refined transitional serif for display headings and a clean humanist sans-serif for body text and navigation. Key critical don'ts include: never use drop shadows or border-radii on cards, never introduce high-chroma accent colors, and never use bold font weights that disrupt the elegant, airy feel. Ensure all interactions utilize smooth ease-in-out transitions to maintain the premium aesthetic.

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