OpenDesign·你的设计资产库

网页参考

Pleo

集中的企业支出与费用管理平台

FintechSaaS
Pleo 网站截图

01

设计气质 DNA

财务效率企业支出自动化管控

现代化的财务操作系统

02

色彩

#FFFFFFAccent
#000000Ink
#333333Ink soft
#F5F5F5BG soft
#888888Muted
rgba(0, 0, 0, 0.1)Line

采用高对比度的单色方案,以确保清晰度与信任感

03

字体

neo-grotesque-sans · monospace

  • display64px · 400
  • h245px · 400
  • body23px · 400
  • caption16px · 400

04

间距

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

使用充裕的垂直节奏,章节内边距为80px

05

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

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

交互元素使用1px实线rgba(0, 0, 0, 0.1)边框

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

居中的单列主视觉区域,后接交替排列的内容区块

07

动效与交互

130msmicro
230mssmall
400msmedium
cubic-bezier(0.4, 0, 1, 1)easing

hover时平滑的颜色和背景过渡

微妙的颜色过渡或背景变化 · 即时响应,延迟最小化

08

组件

  • button 药丸形状,高对比度(黑底白字或白底黑字)
  • card 带有圆角的微妙背景区块
  • hero 大尺寸加粗标题,配合简洁的支持文本和双行动号召按钮

09

文案语气与禁用清单

  • 语气 直接、赋能且专业
  • 标题风格 祈使句式,强调收益
  • 按钮文案 清晰且可操作
  • 不要使用装饰性渐变——截图为扁平纯色背景
  • 不要使用卡片投影——截图为扁平表面搭配细微边框
  • 不要使用过粗的字重——截图为统一的400字重排版
  • 不要使用鲜艳的强调色——截图为严格的单色方案
  • 不要在主视觉区域使用复杂的多栏布局——截图为居中的单列主视觉区域
  • 不要使用小圆角的矩形——截图为完整的药丸形按钮
  • 避免: 行业术语
  • 避免: 复杂的金融术语
  • 避免: 激进的销售语言

10

包内真实截图

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

11

System Prompt

这是一个专注于企业费用管理的高级金融科技SaaS平台。设计采用精致、极简的美学风格,使用严格的单色方案(黑色、白色和浅灰色)来传达信任与效率。排版采用简洁的新怪诞体无衬线字体,搭配大尺寸、高对比度的主视觉区域。关键十六进制颜色为#000000、#FFFFFF和#F5F5F5。关键设计约束包括:不使用装饰性渐变或厚重投影,使用统一的400字重字体,采用药丸形按钮而非标准圆角矩形。避免复杂的多栏主视觉布局或鲜艳的强调色。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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