OpenDesign·你的设计资产库

网页参考

Tokyo Uk

以智能驱动的数字体验工程。

AgencyBold TypographyCurationPhotographicPremium
Tokyo Uk 网站截图

01

设计气质 DNA

机构数字工作室工程智能作品集

一个高端数字机构,通过电影感影像和巨幅排版展示其大胆的作品。

02

色彩

#000000Ink
#ffffffBG
rgba(0,0,0,1)Line

鲜明的高对比度调色板,依赖大胆排版和大幅摄影,而非复杂的色彩系统。

03

字体

geometric-sans

  • display400px · 500
  • h140px · 400
  • body16px · 400

首屏文字动态缩放以填满视窗宽度 · 正文保持约 680px 的舒适阅读宽度 · 导航与副标题使用轻字重(300)

04

间距

4px
8px
12px
16px
24px
32px
40px
48px
64px
80px
96px
120px

宽裕的留白,顶部内边距 120px,网格项目间间距 80px。

05

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

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

无可见边框;依赖图像对比度与留白进行分隔。

06

布局

1400container
12columns
24pxgutter
768 / 1024breakpoints

全出血首屏,后接响应式双栏项目展示网格。

07

动效与交互

100msmicro
300mssmall
500msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

文本链接的 hover 过渡

文本链接与导航项上的细微透明度或颜色过渡。 · 交互元素上使用标准指针光标。

08

组件

  • button 极简的纯文本导航,无明确按钮形状。
  • card 大型基于图像的项目卡片,下方配有简洁文字描述。
  • hero 电影感全视窗背景图像,叠加巨幅排版文字。

09

文案语气与禁用清单

  • 语气 自信、专业且克制。
  • 标题风格 巨幅、全大写或加粗无衬线字体,主导整个视窗。
  • 按钮文案 克制的文本链接,而非醒目的按钮。
  • 不要使用彩色强调色——截图显示的是严格的黑白调色板。
  • 不要为卡片添加投影——截图显示的是扁平化的基于图像的卡片。
  • 不要使用衬线字体——截图显示的是统一的几何无衬线字体家族。
  • 不要在首屏堆砌界面元素——截图仅显示巨幅文字和背景图像。
  • 不要使用小字号作为标题——截图显示的是填满屏幕的巨幅展示文字。
  • 不要使用明确的按钮形状——截图显示的是极简的纯文本导航。
  • 避免: 杂乱的布局
  • 避免: 装饰性图形
  • 避免: 醒目的行动号召按钮

10

包内真实截图

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

11

System Prompt

这是一个高端数字机构作品集,采用严格的黑白调色板(#000000,#ffffff)和大胆的几何无衬线字体(Aeonik)。布局大量依赖全出血摄影、巨幅展示文字和宽裕的留白(120px 内边距,80px 间距)。关键是没有彩色强调色、没有投影、也没有醒目的按钮。设计是克制的,让作品和大胆排版自己说话。避免添加不必要的界面元素或装饰性图形。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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