OpenDesign·你的设计资产库

网页参考

Biron

极简主义暗色作品集，展示原始美学与精致的数字体验。

PortfolioEditorialDark ModeCleanTypography
Biron 网站截图

01

设计气质 DNA

独立视觉设计师伦敦原始美学精致交互

具有物理质感的数字画廊

02

色彩

#FFFFFFInk
#000000BG
rgba(255,255,255,1)Line

极致高对比度单色色板

03

字体

transitional-serif

  • display56px · 400
  • body18px · 400
  • caption12px · 400

文字变换：导航和标签使用全大写 · 高对比度：仅在黑色背景上使用白色文字

04

间距

4px
8px
16px
20px
40px
50px
64px

充裕的内边距与紧凑的内部节奏

05

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

sm · 0px
md · 0px
lg · 0px
pill · 999px

无可见边框

0px 0px 0px 0px transparent

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全视口，居中内容，充裕留白

07

动效与交互

220msmicro
666mssmall
1000msmedium
cubic-bezier(0.19, 1, 0.22, 1)easing

透明度淡入 · 位移变换

无可见交互 · 无可见交互

08

组件

  • button 无可见组件
  • card 无可见组件
  • chip 无可见组件
  • input 无可见组件
  • hero 全屏背景图片配衬线文字覆盖

09

文案语气与禁用清单

  • 语气 极简且专业
  • 标题风格 衬线体，小写或混合大小写，内敛
  • 按钮文案 无可见样式
  • 不要使用圆角——截图显示为尖锐的0px边缘
  • 不要使用投影——截图显示为扁平、基于文字的布局
  • 不要使用明亮的强调色——截图显示为严格的黑白调色板
  • 不要使用装饰性边框——截图显示为干净、无边框的区块
  • 不要所有文字居中对齐——截图显示为混合对齐
  • 不要使用密集的信息布局——截图显示为大量留白
  • 避免: 鲜艳色彩
  • 避免: 装饰性元素
  • 避免: 复杂布局

10

包内真实截图

Biron — 桌面首屏（hero）
桌面首屏（hero）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Biron — 移动首屏
移动首屏

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

11

System Prompt

一个为伦敦视觉设计师设计的极简主义作品集网站。设计采用严格的黑白调色板，标题和界面标签使用醒目的过渡衬线字体。布局大量依赖留白和全视口区块，并配有大型背景图像。关键十六进制色为#000000背景色和#FFFFFF文字色。关键禁忌：绝不使用圆角，绝不添加投影，绝不引入明亮的强调色。通过微妙的动效和高对比度字体，专注于原始美学与精致交互。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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