OpenDesign·你的设计资产库

网页参考

Louis Poulsen

一个高端照明品牌,视觉语言干净、具编辑感并聚焦画廊美学。

LightingDesign
Louis Poulsen 网站截图

01

设计气质 DNA

设计照明高端建筑感

一个面向高端工业设计的编辑式画廊

02

色彩

#000000Ink
#333333Ink soft
#FFFFFFBG
#F6F6F6BG soft
#808080Muted
rgba(0,0,0,0.25)Line

高对比度单色方案,让丰富的摄影与留白占据主导。

03

字体

transitional-serif · humanist-sans

  • display56px · 300
  • headline30px · 300
  • body14px · 400

04

间距

4px
8px
16px
24px
32px
48px
64px
96px

基于4px网格,提供舒适、宽裕的留白以营造编辑感。

05

表面 (圆角 / 阴影 / 边线)

sm · 2px
md · 4px
lg · 40px
pill · 999px

使用 1px solid rgba(0,0,0,0.25) 作为分隔线;交互式列表项大量运用边框。

06

布局

1440container
12columns
24pxgutter
768 / 1024breakpoints

非对称编辑式布局,包含大型主视觉图片、多列瀑布流式照片网格以及全宽列表区域。

07

动效与交互

150msmicro
200mssmall
350msmedium
ease-in-outeasing

链接与列表项平滑的 hover 过渡,交互元素上微妙的缩放变换。

背景或文字颜色的细微变化;分类列表项上的激活状态指示。 · 干净的状态切换,最小化的视觉反馈以保持优雅。

08

组件

  • button 低调、以文字为主的按钮,装饰极少;突出的黑色填充“查看更多”操作按钮。
  • card 边到边的图片,密集网格布局,无可见内边距或背景。
  • hero 全视口电影感图片,叠加大型优雅衬线文字与少量辅助文案。

09

文案语气与禁用清单

  • 语气 自信、高端且富有感染力,聚焦于照明设计的工艺与历史。
  • 标题风格 优雅的大写衬线字体,字间距紧凑。
  • 按钮文案 极简风格,常使用简单箭头或大写无衬线文本。
  • 不要使用圆角——截图显示所有 UI 组件均为锐利的 90 度直角。
  • 不要使用投影——截图显示平面表面,依赖边框与摄影来体现层次。
  • 不要使用明亮的强调色——截图显示严格采用黑、白、灰的单色方案。
  • 不要使用粗体字重——截图显示以常规(400)和细体(300)字重为主。
  • 不要使用拥挤的导航——截图显示顶部栏极简,水平间距充足。
  • 不要使用过重的容器内边距——截图显示布局允许图片与文本靠近视口边缘。
  • 避免: 杂乱的布局
  • 避免: 刺眼或激进的颜色
  • 避免: 俏皮或过于随意的语言

10

包内真实截图

历史提取与模型分析 · 尚未逐项校验

11

System Prompt

这是一个为高端照明品牌打造的、具有高端编辑式电商体验的网站。设计大量依赖电影感摄影、宽裕的留白,以及由白色(#FFFFFF)和黑色(#000000)与中性灰(#F6F6F6)构成的严格单色方案。排版使用精致的过渡衬线字体作为展示标题,以及简洁的人文主义无衬线字体作为正文和导航文本。关键禁忌包括:绝不使用投影或圆角边框、绝不引入高饱和度强调色、绝不使用会破坏优雅通透感的粗体字重。确保所有交互都使用平滑的 ease-in-out 过渡以维持高端美学。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效,整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗

复制给 Agent

参考链接与来源说明,可复制给 Agent。