UI Skills 是一套面向智能体（agent）构建界面的主观约束规范，目标是让智能体产出更一致、更可用的界面。它不提供代码或安装命令，而是一组必须遵循的规则。
技术栈：MUST 优先使用 Tailwind CSS 默认值（间距、圆角、阴影），再考虑自定义；需要 JavaScript 动画时 MUST 使用 motion/react（原 framer-motion）；Tailwind CSS 入场与微动画 SHOULD 使用 tw-animate-css；类名逻辑 MUST 使用 cn 工具（clsx + tailwind-merge）。
组件：涉及键盘或焦点行为的 MUST 使用可访问的组件原语（Base UI、React Aria、Radix）；MUST 优先使用项目已有的组件原语；NEVER 在同一交互面混用原语体系；兼容时 SHOULD 优先 Base UI；纯图标按钮 MUST 加 aria-label；NEVER 手写键盘或焦点行为，除非明确要求。
交互：破坏性或不可逆操作 MUST 使用 AlertDialog；加载态 SHOULD 用结构化骨架屏；NEVER 用 h-screen，应使用 h-dvh；固定元素 MUST 尊重 safe-area-inset；错误 MUST 显示在操作发生处附近；NEVER 阻止 input 或 textarea 粘贴。
动画：NEVER 添加未被明确要求的动画；MUST 只动画合成器属性（transform、opacity）；NEVER 动画布局属性；SHOULD 避免动画绘制属性；入场 SHOULD 用 ease-out；交互反馈 NEVER 超过 200ms；循环动画离屏 MUST 暂停；MUST 尊重 prefers-reduced-motion；NEVER 引入自定义缓动曲线。
排版：标题 MUST 用 text-balance，正文 MUST 用 text-pretty；数据 MUST 用 tabular-nums；密集 UI SHOULD 用 truncate 或 line-clamp；NEVER 修改字距。布局 MUST 使用固定 z-index 层级，SHOULD 用 size-x 代替 w-x + h-x。性能上 NEVER 动画大面积 blur() 或 backdrop-filter，NEVER 在动画外使用 will-change，NEVER 用 useEffect 表达可用渲染逻辑实现的内容。设计上 NEVER 使用渐变（尤其紫色或多色），NEVER 用发光作为主要可供性，空状态 MUST 给出一个明确的下一步操作，每屏 SHOULD 只用一个强调色。