精选 · 开放 · 免费

Bastienallard

一位高级艺术总监的极简个人作品集，采用单色方案并具有强烈的排版存在感。

01

设计气质 DNA

一个干净、高对比度的编辑式布局，旨在展示数字设计专长。

02

色彩

极端高对比度的单色方案，无强调色，依赖排版和摄影来构建视觉层次。

03

字体

geometric-sans · monospace

• display56px · 540
• body16px · 540

所有界面文字使用 Diatype Variable 字体 · 保持标题紧凑的字间距 · 仅将系统字体用作后备方案

04

间距

充足的留白，采用严格的 4px 基线网格。

05

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

使用 rgba(0,0,0,0.8) 实现的细微 1px 边框，用于分隔。

06

布局

简洁的三栏页脚布局，拥有宽敞、开阔的主要内容区域。

07

动效与交互

所有交互元素使用平滑过渡 · 悬停时微妙的光标变化

链接上微妙的不透明度变化或颜色反转。 · 立即反馈，无沉重动画。

08

组件

• button 无背景填充的极简文本按钮。
• card 以图片为主的项目卡片，带有细微的排版叠加。
• chip 用于分类的简单文本标签。
• input 干净、无边框的文本输入框。
• hero 大尺寸、高冲击力的排版，搭配编辑式摄影。

09

文案语气与禁用清单

• 语气 专业、自信且内敛。
• 标题风格 粗体、直接且高度易读。
• 按钮文案 引导而非张扬的微妙文本链接。

• 不要使用深色模式 — 截图显示为纯白背景。
• 不要添加明亮的强调色 — 方案严格为单色。
• 不要使用装饰性衬线字体 — 截图显示全文使用几何无衬线体。
• 不要添加厚重的投影 — 表面是扁平的，依赖边框或排版来营造深度。
• 不要用多种颜色使界面杂乱 — 采用严格的黑、白、灰方案。
• 不要在所有地方使用圆角 — 设计是锐利且建筑感的。
• 避免: 过度装饰
• 避免: 刺眼的颜色
• 避免: 复杂的动画

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

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