SuperAPI AI 工具集

frontend-design-saas

前端与建站

查看项目

更新于 10-15 20:13

技能介绍

用途:这是一份面向 SaaS 产品界面的设计参考,用于构建应用外壳、数据表格、设置面板、账单页、仪表盘与认证等界面,风格参照 Stripe、Linear、Vercel 一系。

主要能力:给出可直接套用的设计令牌与规则,包括中性色阶、品牌强调色(默认 #5E6AD2)、语义状态色、图表配色与暗色模式映射;字体栈(Inter/Geist 与 JetBrains Mono)、字号与字重、字距;4px 基准的间距体系;圆角(按钮输入 6-8px,卡片 8-12px,弹窗 12-16px);紧凑向下的阴影层级与焦点环;以及 ease-out 为主的动效时长与过渡。

使用方式:资料未提供安装命令或调用步骤,仅说明在构建上述界面时参考该技能。可按其令牌定义 CSS 变量并映射到组件。

适用场景:SaaS 仪表盘、管理控制台、数据密集型应用外壳、设置与账单页面、认证与空状态、命令面板等产品界面。

限制:强调产品界面应密集、中性、安静,品牌色占比低于约 5%,避免胶囊按钮、玻璃拟态、渐变边框与营销式大阴影;默认 UI 字号为 13-14px;动效不超过 300ms。资料未提供收费、平台与效果数据。