SuperAPI AI 工具集

hugging-face-ui-skills

设计与创作

查看项目

更新于 10-15 22:17

技能介绍

用途:这是一套面向 AI 智能体的界面约束规范,用于构建 Hugging Face 风格的 UI,适用于深色模式界面、Hugging Face 启发式设计系统,以及使用 Inter 字体和 4px 网格的界面实现。

主要能力与规则: 颜色方面,主表面必须使用浅度低于 20 的深色背景(检测值为 7),页面背景必须为 #0D1119;文本对比度至少保持 4.5:1;建议精简色板。语义令牌包括 surface-base #0D1119、surface-raised #FFFFFF、surface-overlay #171D2A、text-primary #3D3D3D、text-secondary #909199、text-tertiary #4F4F57、border-default #0B0F16。 字体方面,必须使用 Inter 作为主字体,主标题 61px/700,正文 15px/500;标题用 text-balance,正文用 text-pretty;数字建议用 tabular-nums;除非明确要求不得修改字距。 间距必须遵循 4px 网格,默认元素间距建议 2px,不得使用任意间距值。圆角需取自给定刻度(0px 至 21px),默认 4px,胶囊形用 21px 以上;边框宽度限于 1px、2px、5px。 布局以 1920px 为基准视口,全屏高度用 h-dvh 而非 h-screen,固定元素需尊重 safe-area-inset,方形元素用 size-*。交互上,焦点必须用 2px 轮廓加 accent 色 #5E6AD2 及 2px offset,禁用态用 opacity 0.5 和 cursor: not-allowed,破坏性操作必须用 AlertDialog,加载用骨架屏,错误就近展示。动画仅在明确要求时添加,只动 transform 与 opacity,不超 200ms,并尊重 prefers-reduced-motion。

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

限制:部分规则为启发式建议,需结合实际项目取舍;输入框高度标注为 0px 等数据来自检测,可能需按实际情况调整。