精选 · 开放 · 免费

DIA Studio

一个设计与创新工作室，通过高对比度、基于网格的编辑式界面呈现其作品。

01

设计气质 DNA

一个在精致、注重排版的空间中精心策划的设计作品画廊。

02

色彩

严格的单色色板，优先考虑最高对比度和中性呈现，以突出作品本身。

03

字体

transitional-serif

• display56px · 500
• body16px · 450

所有界面元素使用衬线字体（JJannon）。 · 保持紧凑的行高（约1.1），营造紧密、密集的排版感觉。 · 使用方括号作为操作和筛选器的标准界面分隔符。

04

间距

紧凑、对齐网格的间距，最小化垂直内边距，优先考虑密度。

05

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

无可见界面边框；分隔通过留白、颜色对比和网格对齐实现。

06

布局

一个严格、密集的瀑布流网格布局，不同宽高比的图片紧密排列。

07

动效与交互

画廊项目悬停时的透明度淡入淡出

图像缩略图上的细微透明度变化，以指示可交互性。 · 直接导航至项目页面或分类视图。

08

组件

• button 无传统按钮；交互通过用方括号包裹的纯文本链接处理。
• card 项目卡片仅为纯摄影缩略图，以密集、无边框的网格形式呈现，无覆盖层。
• chip 分类筛选器为用方括号包裹的基于文本的列表项。
• input 搜索由一个简单的、用方括号包裹的文本提示表示。
• hero 主视觉区域不是一张大型图片，而是一个连续、不间断的镶嵌网格作品展示，从视口顶部延伸而下。

09

文案语气与禁用清单

• 语气 专业、自信且内敛。
• 标题风格 陈述式且直接，使用经典衬线字体。
• 按钮文案 微妙且注重排版，使用方括号代替传统按钮。

• 不要使用圆角——界面严格保持尖锐的矩形。
• 不要使用强烈的强调色——网站完全依赖单色色板。
• 不要使用按钮组件——交互是方括号中的文本链接。
• 不要使用投影——界面完全扁平。
• 不要使用无衬线字体——网站严格基于衬线字体。
• 不要在瀑布流网格中创建大的垂直间隙——网格应紧密排列。
• 避免: 俏皮的语言
• 避免: 夸张的营销文案
• 避免: 过度的大写
• 避免: 表情符号或视觉装饰

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko