SuperAPI AI 工具集

arc-ui-skills

设计与创作

查看项目

更新于 10-15 22:17

技能介绍

用途:这是一套面向 AI 智能体的设计约束技能,用于构建 Arc 风格的界面。当需要制作浅色模式界面、Arc 风格设计系统,或使用 Inter 字体与 4px 网格实现 UI 时参考。

主要能力:提供颜色、语义令牌、排版、间距、边框、布局、组件与交互的明确规则。颜色要求主表面用浅色背景,页面背景用 #E4E4E4,主操作与焦点态用 #6FADE2,文字对比度至少 4.5:1。语义令牌包括 surface-base、surface-raised、surface-overlay、text-primary、text-secondary、text-tertiary、border-default、accent、warning 等,均给出 HEX 与 RGB。排版要求主字体为 Inter,主标题 53px/700,正文 22px/500,标题用 text-balance、正文用 text-pretty,数字用 tabular-nums,未经要求不得改字距。间距要求 4px 网格,默认元素间距 5px,禁止任意值。边框圆角取自 2px 至 22px 的刻度,默认 7px,胶囊元素用 21px 以上,边框宽度限 1px 或 2px。布局以 1920px 为基准视口,全屏高度用 h-dvh 而非 h-screen,固定元素需尊重 safe-area-inset。交互方面:焦点用 2px 强调色轮廓加 2px 偏移,禁用态用 opacity 0.5 与 not-allowed,破坏性操作须用 AlertDialog,加载用骨架屏,错误就近显示,图标按钮须加 aria-label。动画仅在明确要求时添加,只动 transform 与 opacity,入场用 ease-out,交互反馈不超过 200ms,并尊重 prefers-reduced-motion。

使用方式与限制:资料未提供安装命令或具体调用步骤,暂未提供。该技能为约束性指南,不包含可执行代码;部分规则标注为 SHOULD 或 MUST,需按语义区分强制与建议。资料中未说明收费、价格、支持平台或实际效果。