build-website
该技能用于根据用户提供的简述（如落地页、作品集、报告或仪表盘）创建并发布一个新的 Spacefast 网站。它要求先检查现有项目并复用其组件、资源和构建命令，再依据用户简述与真实内容进行构建；强调遵循团队记忆、设计系统和发布审批规则，并在发布前对源码与构建产物执行设计系统校验，检查桌面与移动端页面及交互状态。适用于需要新建站点、团队协作建站和上线前质量核验的场景。
Skill 广场
找到适合任务的 Agent Skill，阅读介绍并复制安装命令。
更新于 11-02 00:09
前端与建站
11,379 个结果
edit-space
edit-space 是 Spacefast 插件体系中的站点编辑技能，用于修改已有 Spacefast Space 的内容、设计或源文件，并落实视觉审查意见。它面向页面文本、样式、布局和文件编辑等任务，依托已连接的 Spacefast 工具完成操作。使用中需先确定目标 Space，区分仅改源码与需要部署的意图，并遵守 MCP 调用、审批和工作模式规则。编辑前应阅读团队记忆与技能、完整源文件及设计规范，保留无关改动，不用部署文件充当可编辑源码。发布或部署前需按当前已保存标准执行设计系统校验，检查桌面与移动端受影响页面和状态并报告缺口；缺少标准时应报告不可用而非视为通过。视觉意见需与其审查版本绑定，评论线程和截图、内容仪表盘等场景各有对应参考说明。最后分别报告已保存的源码与线上部署结果。
frontend
面向 Gram 仪表盘与 elements React 前端代码库的编码规范与最佳实践，涵盖组件复用、React 性能模式、Tooltip 使用及 Moonshine 设计系统样式要求。
tamis
tamis 是一个通过浏览器网络捕获来审计网站广告、martech、分析与联盟标签的技能，重点是按厂商识别标签，因为标签名会重名。可获取同意前后状态，输出厂商与分类分组及 UNKNOWN 列表。需先配置 DoH 绕过 DNS 过滤。
dashboard
Dashboard 是一个技能，用于创建带数据可视化与实时更新的 HTML/CSS/JS 仪表盘。它包含四个方面的内容：数据源发现（帮助寻找免费公共 API，并检查 Star Child 已支持的 API 与密钥配置）、仪表盘生成（提供基于模板与自定义从零构建两种方式，模板推荐 Tabler、AdminKit）、可视化集成（按需选用 Chart.js、ApexCharts 或 D3.js）、实时更新（以 SSE 为主，WebSocket 为辅）。技能强调先计算 API 调用量再选择数据源，优先使用免费公共 API，并提供代理自动配置、响应式网格布局、图表更新与 SSE 客户端/服务端代码示例。
@6171/doc-to-markdown
通用文档转 Markdown 工具，可将 PDF、Word、PowerPoint、Excel、CSV、HTML 和纯文本转换为结构清晰的 Markdown，保留标题、表格、列表等结构，适合供 AI 智能体读取文档内容。
flutter-api
用于查询 Flutter SDK API 的技能参考指南，涵盖 widgets、Material Design、Cupertino、导航、动画、手势与表单等核心库的用法示例，同时包含 iOS 风格组件与部分状态管理内容，适合开发 Flutter 应用时查阅。
react-rerender-mental-models
帮助建立 React 重渲染与记忆化正确心智模型的技能，讲解什么会真正触发重渲染、何时需要 memo 优化，并给出反模式与架构建议。
design-atlas-ui
Design Atlas UI 是一个前端界面构建与评审技能。它先为界面确立明确的设计方向，把方向记录到项目的 DESIGN.md 中，再以该文件作为所有设计值的唯一依据（source of truth），最后产出可运行代码与带证据的验证报告。它借助 Design Atlas 参考库寻找真实设计范例，用于获取思路，但不直接复制其中数值。技能强调：用户需求优先于审美偏好，无障碍最低标准与内容真实性始终不可突破；所有颜色、尺寸、圆角、阴影和时长必须来自设计令牌（token）。工作流程包括读项目上下文、选定方向、写 DESIGN.md 并通过校验、反默认检查、仅用令牌构建、带证据验证、按 What/Why/Fix 格式报告。适用于新界面开发、视觉方向重设计以及只读的 UI 评审。
graffiti-best-practices
面向 Graffiti UI 的标记生成与重构技能，强调 class-first、语义化、可访问与响应式输出，并遵循模板优先、令牌契约与美学质量门槛。
browser-use
browser-use 是用于浏览器自动化的命令行工具，可在多个命令间保持浏览器会话，支持网页测试、表单填写、截图与数据提取，适合多步骤网页操作场景。
frontend-design
这是一个指导创建独特、生产级前端界面的技能，旨在避免常见的“AI 味”审美。当用户要求构建网页组件、页面、工件或界面时使用。它要求先进行设计思考：明确界面解决的问题与使用者、选定鲜明的审美方向（如极简、极繁、复古未来、奢华精致、编辑杂志风、野兽派等）、考虑技术约束，并确定差异化亮点。随后用 HTML/CSS/JS、React、Vue 等实现可运行代码，要求达到生产级、视觉出众、审美统一且细节精致。在审美层面，它对字体、配色、动效、空间构成和背景细节给出具体指导，强调避免通用字体与俗套配色，鼓励意想不到的布局与有意为之的设计。
remotion-best-practices
Remotion 最佳实践技能，用于在 React 中制作视频时获取领域知识。提供字幕、动画、音频、字体、3D、图表、转场等主题的分规则文件与代码示例。
slack
通过 OpenClaw 的 slack 工具控制 Slack 的技能，支持对消息添加表情回应、管理置顶、发送/编辑/删除消息以及获取成员信息。使用需配置 OpenClaw 的机器人令牌，并提供 channelId、messageId 等参数。
chat-ui
chat-ui 是来自 ui.inference.sh 的 React/Next.js 聊天界面构建组件集，属于 styleof/superpowers 技能。它提供聊天容器、消息、输入框、打字指示器和头像等基础组件，帮助开发者快速搭建对话式界面。组件基于 Tailwind CSS 与 shadcn/ui 设计令牌，可通过 shadcn CLI 一键安装。消息支持 user、assistant、system 三种角色变体，分别对应右对齐、左对齐和居中显示。适用于需要在应用中集成 AI 对话或客服聊天界面的场景。
widgets-ui
widgets-ui 是一个面向 React/Next.js 的声明式 UI 组件渲染器，来自 ui.inference.sh。它允许通过结构化的 JSON 描述，将智能体的响应渲染成丰富的交互式界面，例如表单、按钮、输入框、选择框、复选框、徽章、图标、图片等组件。该技能包含一个 WidgetRenderer 组件和一套 Widget 类型定义，开发者将符合 schema 的 widget 对象传入即可生成 UI，并通过 onAction 回调处理提交、点击等交互。它支持多种布局容器（row、col、box）、排版元素（title、text、caption、label）、交互组件和展示组件，还提供多种渐变背景。安装方式为通过 npx shadcn@latest add 添加组件，并可通过 npx skills add 安装配套技能。适用于需要让智能体动态生成表单、卡片等交互界面的场景。
landing-gen
landing-gen 是一款根据 package.json 自动生成 HTML 落地页的命令行工具。它读取项目元数据（名称、描述、关键词、仓库链接等），通过 AI 模型生成包含首屏、功能网格和行动号召（CTA）的完整单文件落地页，输出为可直接部署的 landing.html。无需配置模板或做设计决策，一条命令即可完成，适合刚发布 npm 包、需要快速营销页或演示页的场景。
frontend-design
frontend-design 是一个用于创建具有高设计品质、风格独特且达到生产级水准的前端界面的技能。当用户要求构建 Web 组件、页面或 artifacts 时可以使用该技能。它在编码前先确立四个要素：Purpose（用途）、Tone（基调，选择一种鲜明的美学风格，如极简、极繁、复古未来、粗野主义、编辑风等）、Constraints（约束）和 Differentiation（差异化，即那个令人难忘的元素），并围绕一个清晰的概念方向精确执行。其设计从五个维度展开：字体排印（美观独特的展示字体与正文字体搭配，不使用通用默认字体）、色彩与主题（由 CSS 变量驱动、以一个主色加鲜明点缀构成的统一调色板）、动效（有目的的 CSS 动画、编排式加载揭示、滚动触发）、空间构图（不对称、重叠、对角线流动、刻意的留白）以及背景与细节（渐变、纹理、阴影以营造深度）。该技能还提示避免常见的 AI 套路化痕迹，例如过度使用的字体（默认 Inter）、可预测的紫色渐变、全部居中、统一圆角以及千篇一律的布局。
syncfusion-aspnetcore-form-builder
该技能是 Syncfusion ASP.NET Core Form Builder 的使用指南，面向需要创建、排错或扩展可视化表单设计器的开发者。内容覆盖在 ASP.NET Core（含 Razor Pages）项目中安装 Syncfusion.AspNetCore.FormBuilder 与 Themes 包、通过 schema 加载初始表单、配置工具箱与属性面板、定义字段与布局、设置全局表单选项（导出、预览、持久化、RTL、模式、模板等）、处理拖拽与属性变更事件，以及准备含校验、条件、表达式、联动下拉、动态范围、远程数据和 Data Grid 的 JSON schema。文档还说明了导出、导入与预览流程，并提供定制工具箱分类、用 setProperty 动态添加属性、注册自定义工具箱模板等常见做法。主要用于表单设计与编辑，不覆盖终端渲染与提交处理。
syncfusion-aspnetcore-form-renderer
Syncfusion ASP.NET Core Form Renderer 的实践指南，用于根据 JSON 架构在 ASP.NET Core Razor Pages 中生成、配置和扩展表单。该技能覆盖表单架构与字段模型、内置与自定义校验、条件显示与禁用、expressionValue 动态表达式、choiceBasedField 级联下拉、minMaxRange 跨字段数值/日期范围、远程数据绑定、数据网格、按钮动作与自定义模板等内容，并提供 NuGet 安装、标签助手注册、主题与脚本引入等快速上手步骤，适合需要以架构驱动方式构建表单的开发场景。
smoothui-component-craft
SmoothUI Component Craft 是一个用于创建、改进、修复或审查 SmoothUI 组件的技能，目标是产出具备生产级动画、无障碍性和性能表现的组件。它通过严格的分阶段工作流编排多个质量技能：先进行头脑风暴与调研，再用 interface-craft 设计动画与交互层，随后按模板实现组件及配套文件，接着依次运行 React 最佳实践、Web 设计指南和无障碍与视觉设计三项审查，最后用 pnpm check 与 pnpm build 验证。该技能对动画和无障碍提出了明确要求，例如使用 useReducedMotion、只动画 transform 与 opacity、使用语义化 HTML 和 ARIA 属性等。
web-design-guidelines
web-design-guidelines 是一个用于审查 UI 代码是否符合 Web Interface Guidelines 的技能。它会在每次审查前从指定源地址获取最新规则，读取用户指定的文件或文件模式，逐条对照指南中的全部规则进行检查，并以简洁的 file:line 格式输出发现的问题。适用于被要求“review my UI”“check accessibility”“audit design”“review UX”或“check my site”等场景。若用户未指定文件，会先询问需要审查哪些文件。
frontend-design
该技能用于创建独特、达到生产级质量的前端界面，避免千篇一律的“AI 味”审美。当用户要求构建 Web 组件、页面、制品或界面时使用。它强调在编码前先确立大胆的美学方向，关注排版、配色、动效、空间构图与背景细节，并输出可运行的真实代码。
compose-animations
Jetpack Compose 动画编写与审查技能，指导按需求选择最小合适的动画 API，涵盖显隐过渡、单属性动画、多属性同步、内容切换与性能注意事项。