SuperAPI AI 工具集

n26-ui-skills

设计与创作

查看项目

更新于 10-15 22:17

技能介绍

用途:该技能为 AI 智能体提供构建 N26 风格界面的约束规则。当需要制作暗色模式界面、以 N26 美学为灵感的设计系统,或使用 Inter 字体与 4px 网格实现 UI 时适用。

主要能力与规范: 颜色:主表面必须使用暗色背景(亮度 < 20,检测值 0),页面背景必须为 #000000(surface-base),主操作与焦点态必须用 #116F64(accent),文字对比度至少 4.5:1。提供语义令牌:surface-base #000000、surface-raised #929493、surface-overlay #E0E0E0、text-primary #555555、text-secondary #436960、text-tertiary #588378、border-default #D3D3D3、accent #116F64。 排版:主字体必须为 Inter;主标题 46px/extra_bold,正文 27px/500;标题用 text-balance,正文用 text-pretty;数字用 tabular-nums;不擅自修改字距。 间距与边框:间距必须基于 4px 网格,默认元素间距 5px;圆角取自 1px、3px、5px,默认 5px;边框宽度统一 1px。 布局:按 1920px 基准视口设计;全屏高度用 h-dvh 而非 h-screen;固定元素尊重 safe-area-inset;正方形元素用 size-*。 交互:焦点必须用 2px 轮廓与 2px outline-offset;禁用态 opacity 0.5 加 cursor not-allowed;破坏性操作必须用 AlertDialog;错误就近显示;不得阻止粘贴;图标按钮必须加 aria-label。 动画:非明确要求不加动画;仅动画 transform 与 opacity;入场用 ease-out;交互反馈不超过 200ms;尊重 prefers-reduced-motion。

使用方式:资料未提供安装命令或调用步骤,暂未提供。

适用场景与限制:适合构建暗色系、N26 风格的界面与设计系统。资料仅给出设计约束与令牌,未说明平台、收费、效果或完整组件示例,这些暂未提供。