用途:Paddle UI Skills 提供一套有明确倾向的约束规则,供 AI 智能体在构建 Paddle 风格界面时参考。适用于构建浅色模式界面、创建 Paddle 风格设计系统,以及使用 Inter 字体和 4px 网格实现 UI。
主要能力:给出颜色、语义令牌、排版、间距、边框、布局、组件、交互状态、动画与性能等方面的具体规范。颜色上要求页面背景使用 #FDFDFD(surface-base),主操作与焦点状态使用 #3475F2(accent),文字对比度至少 4.5:1。语义令牌包括 surface-raised #78FDAF、surface-overlay #E0E0E1、text-primary #2E8D5F、text-secondary #6F7070、text-tertiary #929292、border-default #8FF5BA、success #78FDAF 等。排版要求以 Inter 为主字体,主标题 74px/700,正文 32px/500,标题用 text-balance、正文用 text-pretty,数字用 tabular-nums。间距要求使用 4px 网格,默认元素间距 2px。边框圆角取自 0、1、2、3、4、6、7、9、13px 刻度,默认 4px,边框宽度统一 1px。布局以 1920px 为基准视口,全屏高度用 h-dvh 而非 h-screen,固定元素需尊重 safe-area-inset。交互上焦点使用 2px accent 描边与 2px outline-offset,禁用态 opacity 0.5 且 cursor: not-allowed,破坏性操作使用 AlertDialog,图标按钮需 aria-label。动画仅在明确要求时添加,只动 transform 与 opacity,交互反馈不超过 200ms,并尊重 prefers-reduced-motion。
使用方式与限制:资料未提供安装命令或具体调用步骤,暂未提供。规则以 MUST/SHOULD/NEVER 分级,属于设计约束而非可直接运行的代码库;部分令牌与文字颜色示例存在不一致,实际使用需自行核对。