精选 · 开放 · 免费

Everafter

一个用于可扩展、实时客户体验管理的 AI 原生平台。

01

设计气质 DNA

一个现代、高端的 B2B SaaS 客户成功平台。

02

色彩

高对比度的深色模式，搭配充满活力的紫罗兰色强调色和用于浅色表面的柔和淡彩色强调。

03

字体

transitional-serif · humanist-sans

• display56px · 600
• body18px · 400

标题使用高对比度的过渡衬线字体 (Moret) 以营造高端感。 · 正文使用几何人文主义无衬线字体 (Poppins) 以确保清晰度。 · 导航和大多数 UI 元素使用句子式大小写。

04

间距

主要布局区块之间一致使用 48px 间距。

05

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

深色模式元素使用 1px solid rgba(34,20,55,1)，浅色模式使用浅灰色。

0px 1px 2px rgba(8, 8, 8, 0.08) · 0px 4px 4px rgba(8, 8, 8, 0.08) · 0px 8px 12px rgb(248, 245, 255)

06

布局

单列居中布局，具有宽裕的留白和独特的英雄区域。

07

动效与交互

用于悬停状态和页面加载的平滑透明度过渡。 · 交互元素上的细微缩放变换。

按钮和链接上微妙的背景颜色变化或透明度转换。 · 通过轻微的缩放或颜色变化提供即时的视觉反馈。

08

组件

• button 主按钮为胶囊形状，采用纯紫罗兰色 (#793CFB) 背景和白色文本。次级按钮为白色边框的轮廓样式。
• card 圆角矩形卡片，带有细微阴影，用于展示产品界面。
• chip 小型胶囊形标签，带有浅色背景和文本标签（例如 'Success Plan'）。
• input 简洁的轮廓式输入框，带有圆角边框。
• hero 分栏布局，一侧是醒目的衬线字体排印，另一侧是产品截图，设置在深色背景上。

09

文案语气与禁用清单

• 语气 专业、自信且富有前瞻性。
• 标题风格 使用衬线字体做出大胆、自信的陈述以增强冲击力。
• 按钮文案 直接且以行动为导向（例如，'获取量身定制的演示'）。

• 不要使用等宽字体——截图显示标题使用衬线字体，正文使用无衬线字体。
• 不要使用明亮的霓虹色——截图显示的是深紫罗兰色强调色 (#793CFB) 和淡彩色强调。
• 不要使用尖锐的圆角——截图显示的是胶囊形按钮（半径 999px）和圆角卡片。
• 不要使用纯深色调色板——截图显示内部 UI 组件使用了白色/浅色模式。
• 不要使用厚重的投影——截图显示的是用于营造层次感的柔和、漫射阴影。
• 不要对主要标题使用全大写——截图显示使用的是句子式大小写或标题式大小写。
• 避免: 被动语态
• 避免: 过度的术语
• 避免: 全大写标题

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

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