01
设计气质 DNA
字体铸造厂实验性趣味性工艺感
一份感觉像实体、可触摸工作室的数字字体标本页。
02
色彩
#ffffffInk#000000BG#222222Mutedrgba(255,255,255,1.0)Line严格的单色配色方案,依赖摄影内容提供色彩。
03
字体
- display
60px · 400 - heading
43px · 400 - body
16px · 400
在首屏区域使用大号、粗体的展示字体。 · 所有界面和正文文字使用无衬线字体。 · 展示字体保持紧凑的行距。
04
间距
4px8px16px24px32px48px64px96px基于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使用衬线字体、避免彩色配色方案、避免微妙的装饰元素。整体感觉大胆、实验性且视觉驱动。
