OpenDesign·你的设计资产库

网页参考

Henryheffernan

一款依托粗体排版与命令行美学的高对比度单色交互式作品集。

PortfolioMonochromeBold TypographyExperimentalDark Mode

封面待补录,可通过原站查看设计。

01

设计气质 DNA

作品集实验性终端极简主义交互

数字作品集的极简终端启动界面。

02

色彩

#FFFF00Accent
#FFFFFFInk
#000000BG
rgba(255, 255, 255, 1.0)Line

高对比度单色调,搭配单一霓虹色用于警告。

03

字体

transitional-serif · monospace

  • body16px · 400

所有文本均采用一致的等宽或衬线字体,以统一的基准字号渲染。 · 为提升深色背景下的可读性,字间距略微放宽。

04

间距

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

容器内部采用充足的内边距,确保文本不与边框接触。

05

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

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

采用粗实的白或黑色描边,用于主要容器及交互元素。

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

居中单栏布局,配合嵌套的边框容器。

07

动效与交互

200msmicro
200mssmall
200msmedium
cubic-bezier(0.4, 0.0, 0.2, 1)easing

元素呈现时采用透明度与变换过渡。 · 通过提示框暗示打字机风格的闪烁光标效果。

光标变为指针;元素可能通过透明度或颜色反转进行响应。 · 触发状态变更或切换至作品集的下一章节。

08

组件

  • button 采用大写等宽字体的描边方框。
  • card 带有高内边距的矩形边框容器。
  • chip 无
  • input 无
  • hero 全屏深色画布,中央放置一个带边框的提示框。

09

文案语气与禁用清单

  • 语气 直接、技术感、极简。
  • 标题风格 大写等宽字体或粗体衬线字体,置于刚性边框内。
  • 按钮文案 以等宽字体呈现简洁明了的指引,后接一个带边框的按钮。
  • 不要使用圆角——截图中显示的是锐利、硬边的矩形边框
  • 不要使用柔和渐变——截图中显示的是平面、高对比度的纯色填充
  • 不要使用装饰性图像——截图中显示的是纯粹基于排版、文本化的界面
  • 不要使用浅色主题——截图中显示的是以黑色为主背景、白色文字
  • 不要使用装饰性无衬线字体——截图中显示的是等宽字体与过渡衬线字体的混合
  • 不要使用细微阴影——截图中显示的是仅通过粗边框定义的平面元素
  • 避免: 避免使用柔和的渐变或圆角。
  • 避免: 避免使用装饰性插图或复杂的背景图像。
  • 避免: 避免使用温暖、友好或过于随意的语言。
  • 避免: 避免使用多种相互竞争的字族或字重。
  • 避免: 避免使用标准、未经修饰的网页元素。
  • 避免: 避免使用布满大量可见控件的杂乱布局。

10

包内真实截图

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

11

System Prompt

这是一个采用终端启发美学的极简、实验性作品集网站。它被定位为一个大胆的交互式数字展示。主要颜色是纯粹的黑色(#000000)和白色(#FFFFFF),并谨慎使用亮黄色(#FFFF00)作为系统警告。排版大量依赖等宽字体和过渡衬线字体类别,基准字号统一为16px。关键禁忌:避免使用圆角,因为设计依赖于锐利的硬边;避免使用装饰性图像,因为焦点纯粹在于排版;避免使用柔和渐变,因为调色板严格为单色,采用纯色填充。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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