OpenDesign·你的设计资产库

网页参考

General Type Studio

一个大胆的、基于摄影的字体铸造厂作品集,运用微距图像和超大展示字体。

TypographyFoundry
General Type Studio 网站截图

01

设计气质 DNA

字体铸造厂实验性趣味性工艺感

一份感觉像实体、可触摸工作室的数字字体标本页。

02

色彩

#ffffffInk
#000000BG
#222222Muted
rgba(255,255,255,1.0)Line

严格的单色配色方案,依赖摄影内容提供色彩。

03

字体

geometric-sans

  • display60px · 400
  • heading43px · 400
  • body16px · 400

在首屏区域使用大号、粗体的展示字体。 · 所有界面和正文文字使用无衬线字体。 · 展示字体保持紧凑的行距。

04

间距

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

基于4px增量,各区域采用充裕的内边距。

05

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

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

用于结构分隔的细白色边框。

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全出血摄影背景搭配文字覆盖层。

07

动效与交互

220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing

淡入 · hover颜色过渡

链接和按钮上平滑的颜色过渡。 · 标准光标交互。

08

组件

  • button 基于文字的按钮,带有hover过渡效果。
  • card 无;依赖字体和摄影。
  • chip 无。
  • input 无。
  • hero 全屏图片搭配大型字体覆盖层。

09

文案语气与禁用清单

  • 语气 权威、专业,又不失趣味。
  • 标题风格 大号、粗体,常使用大写。
  • 按钮文案 简约、基于文字。
  • 不要在UI中使用衬线字体——截图显示的是几何无衬线体。
  • 不要使用彩色配色方案——截图显示的是严格的单色。
  • 不要将内容隐藏在复杂导航之后——截图显示的是清晰、直接的链接。
  • 不要在卡片上使用圆角——截图显示的是直角边缘。
  • 不要使用微妙的投影——截图显示的是平面、图形化的对比。
  • 不要使用小而紧凑的排版——截图显示的是大型、表现力强的字体。
  • 避免: 杂乱
  • 避免: 过度装饰
  • 避免: UI使用衬线字体

10

包内真实截图

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

11

System Prompt

General Type Studio 是一个以大型表现字体和全出血摄影背景为特色的字体铸造厂网站。设计采用黑底白字 (#000000, #ffffff) 的严格单色配色方案。字体主要为几何无衬线体,以超大尺度用于首屏区域。关键特征包括全视口布局、简约界面元素以及对字体标本本身的关注。关键禁忌:避免UI使用衬线字体、避免彩色配色方案、避免微妙的装饰元素。整体感觉大胆、实验性且视觉驱动。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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