SuperAPI AI 工具集
合作ENAI 行业资讯收藏

Skill 广场

找到适合任务的 Agent Skill，阅读介绍并复制安装命令。

更新于 10-26 00:15

前端与建站

11,097 个结果

unslop-preflight

Unslop Preflight 是一款面向 AI 辅助前端开发的预检与自动修复防护工具，当前版本为 v1.15.0。它在正式实施前端改动前，通过创建、审计、修复并评分 PRODUCT.md、DESIGN.md、AGENTS.md 及源代码，评估仓库的准备状态，目标是把模糊需求转化为安全、确定性的交接成果，避免 AI 生成前端中常见的脆弱布局、文案粗糙和交互不可访问等问题。工具会先识别项目模式（初始播种、审计、根因修复、重设计、实施、修复），核验交接文档是否缺失或过期，缺失时可通过 bunx unslop-preflight init 初始化；随后运行扫描与安全自动修复（如 bunx unslop-preflight autopilot --safe-fix --verify --report --strict，或针对源码、文案、界面观感的定向扫描），并在 .unslop/ 目录生成报告，按阻塞、需补充规格、含修复清单可交付、已验证可交付四种状态给出就绪判断。它还包含 npm 供应链安全检查建议。

前端与建站10 次安装

gsap-optimise

GSAP Optimise 是一套面向 GSAP 动画的性能优化配方与审计清单，属于 iotron/agent-skills 技能集，定位在动画构建（gsap-animate）之后、测试（gsap-test）之前的性能优化环节。它围绕 GPU 加速、will-change 管理、高频动画、懒渲染、反模式识别和性能审计清单展开，帮助开发者对已完成的 GSAP 动画进行性能审查与改进。该技能本身只覆盖优化配方与审计清单，通用性能指导需调用配套的 gsap-performance 技能，并依赖 greensock/gsap-skills。

前端与建站10 次安装

widgets-ui

widgets-ui 是一套面向 React/Next.js 的声明式 UI 组件方案，来自 ui.inference.sh，目标是把结构化数据（JSON）直接渲染为丰富的交互界面。它通过一个 WidgetRenderer 组件接收 Widget 对象，用 children 嵌套描述布局、排版、表单控件与展示元素，并支持表单提交和数据回传。适合用于智能体或后端返回结构化响应后，前端无需手写组件即可生成界面，例如表单收集、航班信息卡片等场景。

前端与建站10 次安装

frontend-design

该技能用于指导创建独特、达到生产级水准的前端界面，避免常见的“AI 味”审美。用户提供前端需求（组件、页面、应用或界面）及其用途、受众或技术约束后，技能先引导进行设计思考：明确要解决的问题与使用者、选定鲜明甚至极端的美学基调（如极简、复古未来、奢华、编辑杂志风、粗野主义、工业实用等）、梳理框架与性能无障碍等技术约束，并确定让作品令人难忘的差异化点。随后实现可运行的代码（HTML/CSS/JS、React、Vue 等），要求功能可用、视觉醒目、风格统一且细节讲究。美学指南涵盖：排版选用独特字体并搭配展示字体与正文字体、避免 Arial/Inter 等通用字体；用 CSS 变量统一色彩主题，主色配锐利点缀；用动画与微交互营造效果，HTML 优先纯 CSS，React 可用 Motion，重视页面加载的编排式揭示；空间构成上采用非对称、重叠、斜向、打破网格的布局；背景与视觉细节使用渐变网格、噪点纹理、几何图案、层叠透明、戏剧化阴影、装饰边框、自定义光标等营造氛围。要求避免通用 AI 审美（如常见字体、紫渐变白底、可预测布局），根据语境做多元变化，并让实现复杂度与美学愿景匹配。

前端与建站10 次安装

frontend-design

该技能用于指导创建独特、达到生产级水准的前端界面，避免常见的“AI 味”审美。用户提供前端需求（组件、页面、应用或界面）及其用途、受众或技术约束后，技能先引导进行设计思考：明确要解决的问题与使用者、选定鲜明甚至极端的美学基调（如极简、复古未来、奢华、编辑杂志风、粗野主义、工业实用等）、梳理框架与性能无障碍等技术约束，并确定让作品令人难忘的差异化点。随后实现可运行的代码（HTML/CSS/JS、React、Vue 等），要求功能可用、视觉醒目、风格统一且细节讲究。美学指南涵盖：排版选用独特字体并搭配展示字体与正文字体、避免 Arial/Inter 等通用字体；用 CSS 变量统一色彩主题，主色配锐利点缀；用动画与微交互营造效果，HTML 优先纯 CSS，React 可用 Motion，重视页面加载的编排式揭示；空间构成上采用非对称、重叠、斜向、打破网格的布局；背景与视觉细节使用渐变网格、噪点纹理、几何图案、层叠透明、戏剧化阴影、装饰边框、自定义光标等营造氛围。要求避免通用 AI 审美（如常见字体、紫渐变白底、可预测布局），根据语境做多元变化，并让实现复杂度与美学愿景匹配。

前端与建站10 次安装

infographic-item-creator

这是一个用于生成或更新信息图（infographic）Item 组件的技能，目标仓库为 TypeScript/TSX 项目中的 src/designs/items 目录。当用户需要设计、实现或修改数据项组件时使用。它会按照项目既定的 item 规则、布局约束和注册要求，生成完整的 Item 组件代码。工作流程包括：阅读 references/item-prompt.md 获取完整的框架规则、允许使用的组件与输出要求；在信息不足时澄清最小需求，如期望的视觉效果、必需字段（icon/label/value/desc/illus）、尺寸和对齐需求；使用 getItemProps 提取自定义属性，并用 getElementBounds 计算布局；产出完整的 TypeScript 文件，包含 imports、继承 BaseItemProps 的 Props、组件实现以及带准确 composites 的 registerItem；最后对照参考中的约束进行自检，例如不使用未列出的组件、为所有被包裹组件传入索引、正确的条件渲染。还建议在适当情况下扫描 src/designs/items 中相似的 item 以匹配本地模式，并保持输出简洁，避免 React 专属特性（如 keys、hooks）。

前端与建站10 次安装