css-sass
css-sass 是一个聚焦 Sass/SCSS 预处理器的技能，指导使用现代 dart-sass 的 @use/@forward 语法、变量、mixin、函数、嵌套与模块化架构，并帮助从已废弃的 @import 迁移到 @use。
Skill 广场
找到适合任务的 Agent Skill，阅读介绍并复制安装命令。
更新于 10-23 00:13
前端与建站
11,007 个结果
screen-flow-diagram
将简化的线框屏幕以操作标签连接，生成可缩放的交互式屏幕流图，输出为引用 D3.js 的独立 HTML 文件。
vercel-react-best-practices
Vercel 工程团队维护的 React 与 Next.js 性能优化规则集，包含 8 大类共 57 条按影响优先级划分的实践指南，用于指导编写、审查和重构代码，是面向自动化重构与代码生成的参考技能。
vue-components
面向 Vue 3 组件开发的技能指南，结合 TypeScript 与 Tailwind CSS，强调清晰结构、可组合逻辑、可访问性与可维护模式，帮助编写简洁易读、易测试的组件。
frontend-seo
Frontend SEO 是一套可移植、与框架无关的前端 SEO 系统，面向 React 或 React Native-for-web 前端。它把站点元数据集中在一个常量模块中，从单一 base 推导出规范（canonical）URL，按路由构建标题、描述、canonical、Open Graph 与 Twitter/X 卡片等元数据，并由同一份内容生成站点地图、robots 规则、RSS 订阅源和类型化 JSON-LD。该技能本质上描述的是「一组纯构建函数 + 一层薄框架适配器」的 SEO 方案，而非组件库或视觉风格；它可与 frontend-architecture 技能配合，SEO 系统位于单一服务模块（services/seo/）并通过一个 barrel 对外暴露。目标是让每条路由都输出正确、一致、机器可读的元数据，避免手工复制粘贴 <meta> 标签。技能可被 Claude Code、OpenCode、Codex、Cursor、Windsurf 等读取。使用时需先阅读详细指南，遵守其安全、前置条件与校验要求；且在应用改动前应验证命令、生成代码、依赖、凭证与外部服务行为。
column-pinning
TanStack Table 的列固定（column pinning）技能：通过 columnPinningFeature 把列固定到逻辑 start、center、end 区域，粘性定位由渲染层用 CSS 实现。适用于 RTL 偏移、z-index、背景与列宽处理。
angular-signals
Angular Signals 是 Angular 16+ 引入的细粒度响应式状态管理方案，用于构建高性能、无 Zone 变更检测的现代 Angular 应用。它提供 signal、computed、effect 等核心 API，支持同步状态管理、派生值自动追踪、副作用处理，并可通过 toSignal/toObservable 与 RxJS 互操作。本技能涵盖信号基础、计算信号、效果、信号输入输出、信号查询、与 Observables 的对比与迁移、自定义相等性、无 Zone 变更检测以及状态管理与表单等高级模式，适合需要简化状态管理、提升同步状态性能的 Angular 开发者。
animations-transitions
MUI 动画与过渡技能：介绍 Fade、Grow、Slide、Collapse、Zoom 五个内置过渡组件，TransitionGroup 列表动画，自定义过渡，主题过渡时间与缓动，sx 关键帧动画，以及 Framer Motion 集成。
react
来自 udecode/plate 的 React 编码规范技能，涵盖解构 props、React Compiler 自动记忆化、Effect 使用原则、Tailwind v4 语法、设计令牌与 data 属性样式等约定，用于统一 React 组件写法。
reusable-components
来自 vaadin/agent-skills 的技能，指导智能体把 Vaadin 25 Flow 视图拆分为聚焦、可复用的组件，涵盖何时拆分、基类选择、组件 API 设计、父子通信与生命周期等要点。
docusaurus
Docusaurus 是一个基于 React 的静态站点生成器，用于构建现代文档网站。该技能涵盖文档、博客、页面、版本管理、国际化（i18n）、搜索集成与部署模式。适合为开源项目编写文档、在文档中使用 React 组件、需要多版本文档、需要国际化文档、希望在文档之外附带博客功能、构建开发者门户、需要快速且对 SEO 友好的静态站点，以及希望用 MDX 编写交互式示例的场景。不适合简单单页文档、Python 专用 API 文档（autodoc）、无 React 经验的简单需求、需要实时协作编辑，以及制作幻灯片演示的场景。安装方式为使用 npx create-docusaurus@latest 创建项目，支持 classic 模板与 TypeScript。系统要求 Node.js 18.0 或更高版本、npm 8 或 yarn 1.22+，以及 Git（用于版本管理功能）。
research-ui-prototyping
该技能用于构建研究工作界面，包括实验指标看板、来源或论文浏览器、标注或编码界面、SOTA 矩阵浏览器、可复现性报告查看器，以及方法或数据集演示。其核心原则是：研究 UI 是工作工具而非落地页，应优先采用密集、可检查、面向任务的界面，显式呈现证据与不确定性。技能要求先阅读 references/repository-contract.md 与 references/output-contracts.md，在设计上从核心工作流而非 hero 区块出发，展示标识符、来源、过滤器与导出控件，让不确定性和缺失证据可见，优先使用表格、分面、时间线、图表和差异视图，保持视觉风格克制且符合领域特征；有前端设计技能时可用于润色。数据方面，除静态报告外不得将研究结果硬编码进 UI，数据加载路径需记录，支持论文的表格与图表应导出回 outputs/。完成前需通过截图与交互检查验证。输出需在 docs/agent/ 或 docs/reproducibility/commands.md 中记录 UI 用途、运行命令和数据依赖。适用场景为研究仪表盘、标注工具、数据浏览器、论文支撑演示、SOTA 探索器、实验查看器等前端界面。
workleap-react-best-practices
Workleap 面向 React 单页应用（SPA）的性能优化规范，用于编写、评审或重构 React SPA 代码。内容按优先级分为消除瀑布请求、包体积优化、重渲染优化、渲染性能、JavaScript 性能与高级模式六类，每类给出具体规则及对应参考文件。
Building Blocks
Building Blocks 是 Adobe AEM Edge Delivery 的一个开发技能，用于指导创建新的区块（block）或修改已有区块。它遵循内容驱动开发（CDD）原则，覆盖从理解内容模型、实现 JavaScript 装饰逻辑、添加 CSS 样式到代码质量与测试的完整流程。该技能只能在 content-driven-development 技能的 Phase 2（实现阶段）被调用，使用前必须已具备测试内容和内容模型。
generate
该技能用于为 Lexsis 店面创建未发布的草稿，并在用户需要更深入验证时将其同步并质检至可发布状态。它从本地规范源生成远程草稿，草稿创建可逆，发布是单独的显式操作。技能会依据整个请求和对话推断意图，默认使用 fast-draft 模式处理可逆的模糊请求或创建、试用、预览、探索、迭代类需求；当用户要求最终打磨、详尽质检、活动交接或发布准备时，则进入 production-ready 模式。发布请求会路由到 /publish，该技能从不推断实时发布批准。
web-framework-solidjs
SolidJS 细粒度响应式技能，涵盖 signals、effects、memos、stores、resources 与控制流组件。适用于编写 Solid 组件或响应式状态时加载，强调读取即订阅、组件体只运行一次、props 为实时代理等核心约束。
web-framework-svelte
Svelte 5 runes 技能：讲解 $state、$derived、$effect、$props、$bindable、snippets、回调 props 与 context 的用法，适用于编写 Svelte 5 组件或响应式模块。
web-meta-framework-vitepress
VitePress 1.x 是构建于 Vite 之上、由 Vue 驱动的静态站点生成器，主要用于文档站点，全部配置写在 .vitepress/config.ts 中。本技能总结其站点与主题配置、导航、数据加载器、Markdown 扩展、构建钩子等核心模式与常见陷阱。
frontend-experience-extractor
frontend-experience-extractor 是一个中文可用的 AI 技能，用于从前端组件或模块源码中提取行为需求、用户体验流程、微交互以及条件可见性规则，输出 experience.md 行为文档。
frontend-layout-extractor
frontend-layout-extractor 是 aircury/ai-framework 下的技能，用于从前端组件或模块源码中提取结构与字段要求，生成 focuses 于“完整字段对齐”的 layout.md 文件，不涉及样式与深层行为逻辑。
angularfire
AngularFire 是 Firebase 的官方 Angular 封装库，基于 v18.0.1，提供依赖注入、Zone.js 集成、RxJS 可观察对象、懒加载、SSR 支持及路由鉴权守卫，用于在 Angular 应用中按 Angular 方式集成 Firebase 各项服务。
de-div
de-div 是一个帮助编写语义化、无障碍 HTML 的技能，避免无意义的 div/span 堆砌。支持 EDIT（重构已有标记）与 CREATE（新写标记）两种模式，在保持外观与行为的前提下选择有意义的元素，并输出教学式报告。
ui-styling
ui-styling 是一个用于构建美观、可访问用户界面的技能，结合 shadcn/ui 组件、Tailwind CSS 工具类样式与基于 canvas 的视觉设计系统，适用于 React 系框架的界面开发、主题定制与响应式布局。
react-hook
React Hook 模式指南，说明向自定义 Hook 传递回调时必须用 useCallback 包裹，并给出修复 react-hooks/exhaustive-deps 警告、排查组件意外重渲染与依赖链问题的方法。