01
设计气质 DNA
金融科技简洁现代国际化可靠
一个干净、井然有序的银行大厅，配以醒目的绿色强调色。
02
色彩
#9FE870Accent#000000Ink#FFFFFFBG#F0F0F0BG soft#F5F5F5BG quietrgba(0,0,0,0.08)Line在中性背景上使用高对比度的主色调搭配充满活力的绿色强调色。
03
字体
- display
56px · 500 - body
16px · 400
所有用户界面文字使用几何无衬线字体。 · 大型展示文字保持紧凑的字间距。
04
间距
4px8px16px24px32px48px64px96px标准 4px 基础网格。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 999px
1px solid rgba(0,0,0,0.08)
oklab(0 0 0 / 0.04) 0px 10px 15px -3px · oklab(0 0 0 / 0.04) 0px 4px 6px -4px
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
全宽灵活网格。
07
动效与交互
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
悬停状态下的平滑过渡。 · 内容加载时的细微淡入效果。
细微的背景颜色变化或轻微缩放。 · 细微的按压效果。
08
组件
- button 药丸形状的按钮，采用纯绿色背景或细微边框。
- card 带有柔和阴影的圆角容器。
- chip 药丸形状的导航开关。
- hero 采用大字体或产品图片的极简布局。
09
文案语气与禁用清单
- 语气 专业、乐于助人且清晰。
- 标题风格 简洁直接，具有强烈的视觉层次感。
- 按钮文案 清晰、面向行动的文字，置于药丸形按钮上。
- 不要使用尖角 —— 截图显示高度圆润的药丸形和圆角。
- 不要使用深色背景 —— 截图显示以白色为主的画布。
- 不要为主要操作使用柔和的颜色 —— 截图使用了亮绿色。
- 不要使用衬线字体 —— 截图使用了几何无衬线字体。
- 不要使用多种亮色 —— 截图使用了严格的黑、白、绿色调。
- 不要使用密集的布局 —— 截图显示了充足的留白。
- 避免: 过于随意的语言
- 避免: 行业术语
- 避免: 激进的推销话术
10
包内真实截图
11
System Prompt
这是一个简洁、现代的金融科技网站，具有极简美学。主色调为纯白和纯黑，搭配充满活力、高饱和度的绿色强调色 (#9FE870)。字体依赖几何无衬线字体类别（如 Inter / Wise Sans），以营造友好而专业的感觉。布局宽敞，具有充足的内边距和高度圆润的药丸形用户界面元素。关键约束：避免使用深色模式、避免使用衬线字体，并严格遵守绿色/黑色/白色配色方案，不引入竞争性色调。使用粗体、清晰的标题和充足的留白以保持清晰度。