OpenDesign·你的设计资产库

网页参考

Guglieri

一个面向设计师和教育者的、采用粗体排版与高对比度的个人作品集网站。

PortfolioStudioPremiumBold TypographyRefined
Guglieri 网站截图

01

设计气质 DNA

设计师教育者工艺作品集个人

一位资深设计专业人士的数字作品集

02

色彩

#ffffffInk
#575757Ink soft
#000000BG
#1c1c1cBG soft
#454545Muted
rgba(87, 87, 87, 0.3)Line

高对比度单色,强调粗体排版的视觉冲击力

03

字体

geometric-sans · humanist-sans

  • display64px · 900
  • h232px · 400
  • body14px · 400

标题使用极粗字重 (1000) 与紧凑字间距 · 正文使用标准字重 (400) 并带有轻微负字间距 · 导航链接为大写小号字体

04

间距

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

基于 4px 网格的统一间距

05

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

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

用于分隔的纤细微妙线条

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全宽版块,留有宽裕的 padding

07

动效与交互

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

交互元素上的细微 hover 过渡效果

通过透明度或颜色变化提供视觉反馈 · 立即响应,并伴随光标变化

08

组件

  • button 带有箭头图标的胶囊形按钮
  • hero 全宽 hero 区域,配有大型 3D 渲染光标素材

09

文案语气与禁用清单

  • 语气 专业、自信,且聚焦于工艺
  • 标题风格 大胆直接的陈述
  • 按钮文案 清晰、行动导向并带有箭头
  • 不要使用浅色背景——网站以黑色 (#000000) 为主导
  • 不要为标题使用细/浅字重——设计采用极粗字重 (1000)
  • 不要为 UI 元素添加过多阴影或 3D 效果——3D 效果仅用于图像
  • 不要为正文使用宽字间距——网站采用紧凑字间距 (-0.28px)
  • 不要引入明亮的强调色——色彩板严格限定为单色,仅通过图像提供色彩
  • 不要使用装饰性字体——排版采用干净、几何感的无衬线体
  • 避免: 术语堆砌的语言
  • 避免: 过于随意的语气
  • 避免: 过多的感叹号

11

System Prompt

这是一个为设计师兼教育者 Claudio Guglieri 打造的个人作品集网站。设计高端精致,专注于粗体排版与高对比度。色彩板以黑色 (#000000) 和白色 (#ffffff) 为主,次要文本使用柔和灰阶 (#575757)。字体类别采用几何与人文主义无衬线体,展示文本使用极粗字重 (1000) 与紧凑字间距。布局留白宽裕,注重视觉冲击力。关键禁忌:绝不使用浅色背景,避免为标题使用细字重,不要添加不必要的装饰元素从而削弱其大胆、干净的美学。网站通过深色背景上的高品质 3D 图像来展示作品。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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