OpenDesign·你的设计资产库

网页参考

Gus Biz

一个采用粗野主义美学、高对比度色彩和趣味字体的创意机构网站。

AgencyPlayfulTypographyExpressiveMotion

封面待补录,可通过原站查看设计。

01

设计气质 DNA

创意粗野主义趣味获奖

一本打破传统设计网格的大胆、趣味的剪贴簿。

02

色彩

#FF8488Accent
#050000Ink
#008263BG
#F5C04FMuted
rgba(5,0,0,1)Line

以青绿色为基础,搭配红色和黄色点缀的,高对比度、趣味盎然的配色方案。

03

字体

transitional-serif · humanist-sans

  • display28px · 700

主要标题和展示性文字使用衬线字体。 · 正文和界面元素使用无衬线字体。 · 在趣味的展示性文字与易读的正文之间保持清晰的字体层级。

04

间距

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

宽松且有机的节奏,常打破严格网格,以实现趣味布局。

05

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

sm · 0px
md · 0px
lg · 0px
pill · 999px

0px 1px 0px 0px rgba(0,0,0,1)

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

基于网格但刻意错位且充满趣味,打破严格对齐。

07

动效与交互

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

流畅的颜色和背景过渡 · 悬停时的细微变换 · 趣味、连续的滚动跑马灯

颜色或背景变化,细微的变换。 · 即时的视觉反馈。

08

组件

  • button 简洁的,基于文本或基础几何形状(如圆形)。
  • card 极简的,通常通过边框或强烈的背景对比来界定。
  • chip 简单的几何形状或星形。
  • input 标准文本输入框,样式极简。
  • hero 大型、粗体的排版,搭配趣味图形元素,全宽展示。

09

文案语气与禁用清单

  • 语气 趣味、自信且毫不掩饰的大胆。
  • 标题风格 大型、富有表现力的衬线字体,通常全小写。
  • 按钮文案 简洁、直接,常融入趣味布局中。
  • 不要使用沉闷或微妙的配色方案——截图显示的是充满活力的青绿色、红色和黄色。
  • 不要使用严格极简的布局——截图显示的是打破网格的趣味构图。
  • 不要只使用无衬线字体——截图显著展示了衬线展示字体。
  • 不要避免使用几何形状——截图显示了星芒标志和圆形元素。
  • 不要创建静态的首屏区域——截图显示了一个动态的、滚动的跑马灯。
  • 不要使用微妙的阴影或渐变——截图显示的是带有纤细、锐利边框的纯色。
  • 避免: 微妙含蓄
  • 避免: 企业行话
  • 避免: 过于复杂的界面模式

10

包内真实截图

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

11

System Prompt

Gus Biz 是一个趣味盎然的创意机构网站,具有大胆的、受粗野主义启发的美学风格。它采用以青绿色背景(#008263)为中心的鲜艳配色方案,搭配强烈的红色(#FF8488)和黄色(#F5C04F)点缀,以及深色墨色(#050000)。字体富有表现力,展示性文字使用过渡衬线字体,正文使用人文主义无衬线字体。布局基于网格但刻意充满趣味和有机感,常打破严格对齐。主要特点包括动态滚动跑马灯、大胆的星芒标志以及极简的几何界面组件。关键禁忌:不要使用沉闷或企业化的配色方案,不要创建严格极简或无菌的布局,不要避免使用趣味的几何元素或富有表现力的字体。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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