OpenDesign·你的设计资产库

网页参考

Letsbehonest Eu

一个可持续时尚品牌,以高对比度的编辑式摄影和温暖、质朴的色调为特色。

EditorialPhotographicCurationCleanPremium
Letsbehonest Eu 网站截图

01

设计气质 DNA

可持续时尚编辑风格真实抓拍

一本编辑式时尚杂志的数字店面。

02

色彩

#892500Accent
#0E0E0EInk
#868686Ink soft
#EEE5D9BG
#F9F6F2BG soft
#B4B4B4Muted
rgba(134, 134, 134, 0.3)Line

温暖、质朴的中性色,由单一的深红色强调色和高对比度摄影所锚定。

03

字体

geometric-sans · humanist-sans

  • display138px · 700
  • h156px · 700
  • body14px · 400
  • caption11px · 400

导航和次级标题使用大写字母。 · 为大写元素保持充足的字间距(2px 以上)。 · 使用几何与人文无衬线字体的组合来构建层次结构。

04

间距

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

宽敞的垂直间距,各板块有明确的内边距(例如顶部 114px)。

05

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

sm · 4px
md · 8px
lg · 12px
pill · 999px

极简,使用 1px solid #868686 作为细微的分隔线和交互元素。

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全宽首图,随后是居中的单列板块,留有大量空白。

07

动效与交互

150msmicro
200mssmall
400msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing

交互元素在悬停时快速、微妙的颜色过渡。 · 轮播幻灯片的平滑过渡。

微妙的颜色变化或透明度转变,通常为 0.15s ease-out。 · 即时的视觉反馈。

08

组件

  • button 基于文本的或简单的矩形按钮,使用大写文本和充足的水平内边距。
  • card 干净的商品卡片,以中性背景上的全高模特摄影为特色。
  • hero 全出血、高分辨率的编辑式摄影,配有最简的覆盖文本和大型轮播箭头。

09

文案语气与禁用清单

  • 语气 自信、极简,并聚焦于可持续性。
  • 标题风格 简短、有力,通常以大号、粗体大写字母展示。
  • 按钮文案 干净且不显眼,通常基于文本。
  • 不要使用纯白色背景——截图显示温暖的米色 (#EEE5D9) 是主要画布。
  • 不要将导航设置为小写——截图显示所有导航项均为大写。
  • 不要使用复杂的渐变——设计依赖于纯色和高品质摄影。
  • 不要所有地方都使用无衬线字体——品牌标识使用粗体、窄体无衬线字体,而正文则更偏人文风格。
  • 不要给卡片添加投影——商品卡片无边框,与背景齐平。
  • 不要为主要内容使用暗黑模式或深色背景——调色板主要是浅色和质朴的。
  • 避免: 使用刺眼、霓虹或过度人造感的颜色。
  • 避免: 使用装饰性或手写体字体。
  • 避免: 创建拥挤的布局,在图片上叠加过多文本。
  • 避免: 使用复杂的阴影或渐变。
  • 避免: 添加不必要的边框或厚重的 UI 外观。
  • 避免: 将主要导航使用小写字母。

10

包内真实截图

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

11

System Prompt

设计一个高端的、编辑式时尚电子商务网站。其核心美学建立在一个温暖、质朴的调色板上,主背景为 #EEE5D9,搭配一个鲜明、高对比度的强调色 #892500。为展示文本和正文使用几何与人文无衬线字体的组合,确保导航和关键标签使用大写字母。布局必须以图像为核心,优先考虑大型、高分辨率的摄影,配以大量空白和极简的 UI 外观。避免拥挤的界面、厚重的阴影或看起来人造的颜色。确保交互是微妙的,使用快速的 0.15 秒颜色过渡。不要将导航使用小写,不要给卡片添加投影,也不要使用纯白色背景。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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