loom-react
loom-react 是一套面向 React 19+ 客户端单页应用（SPA）的现代开发模式指南，技术栈为 React Router v7、Jotai、Vite 与 Bun，不适用于 Next.js/Remix 等 SSR 框架。
Skill 广场
找到适合任务的 Agent Skill，阅读介绍并复制安装命令。
更新于 10-25 00:14
前端与建站
11,088 个结果
angular
面向现代 Angular（v20+）开发的专业技能，深入覆盖 Signals、独立组件、无 Zone 应用、SSR/水合与响应式模式，用于构建、优化与迁移 Angular 应用。
textual-reactive-programming
Textual 响应式编程技能：用 reactive 属性、watch 方法与计算属性在 Textual 组件中实现声明式数据绑定，让界面自动随状态刷新，避免手动调用 refresh。
playthru
playthru 是一个用于在网页真实界面上播放脚本化产品演示的轻量 JavaScript 库。它通过一个假光标在真实 UI 上滑动、点击真实元素、在真实输入框中输入文本，并用镜头缩放聚焦重点区域，然后循环播放。该库无依赖、体积约 5 KB、无需导入样式表。所有时序由库固定，不提供速度、缓动或时长选项。支持 npm 与 CDN 两种引入方式，并提供 React 组件 Playthru 和 usePlaythru Hook；其他框架可在挂载后调用 playthru(el)，卸载时调用 destroy()。演示脚本通过链式步骤编写，包括 move、click、type、key、zoom、zoomOut、wait、run、reset 等。默认在舞台进入视口 30% 时自动开始并无限循环，可通过 loop、autoplay、pauseOnHover 选项调整。假光标无法触发 CSS :hover 和 :focus，库改用 data-playthru-hover、data-playthru-focus 属性标记，需自行映射样式。适用场景为落地页或产品页中的交互式功能演示。限制包括：无法定位 iframe、canvas 或 WebGL 内元素；链接和提交按钮的默认行为会被阻止；选择器无匹配会中断演示；多行文本输入不显示绘制光标；prefers-reduced-motion 下会减少动效。
opentui-solid
面向 OpenTUI 与 SolidJS 的专家技能，用于构建终端 TUI：掌握信号、细粒度响应式、JSX 组件模式及 SolidJS 专属优化。提供安装命令、基础渲染、常用 Hooks、组件、样式、状态管理与常见模式示例。
website-to-hyperframes
该技能用于抓取指定网站，并基于抓取内容制作 HyperFrames 视频。适用于用户提供 URL 后要求生成产品发布、社交广告或产品导览视频的场景，采用七步协作式工作流，每步产出物作为下一步的门槛。
visual-component-finder
用于将界面截图匹配到 Angular 组件的技能，帮助定位某个页面由哪个组件渲染，并支持刷新组件索引。通过 BEM 类名等信号进行匹配，输出组件路径与相似度评估，便于代码复用。
window-management
用于定制 macOS SwiftUI 窗口与场景行为的技能，涵盖窗口外观、拖拽区域、位置、恢复、启动行为及无边框窗口，适合调整标题栏、工具栏背景、窗口尺寸与缩放策略。
frontend-design
该技能用于指导创建独特、达到生产级水准的前端界面，避免常见的“AI 味”审美。用户提供前端需求（组件、页面、应用或界面）及其用途、受众或技术约束后，技能先引导进行设计思考：明确要解决的问题与使用者、选定鲜明甚至极端的美学基调（如极简、复古未来、奢华、编辑杂志风、粗野主义、工业实用等）、梳理框架与性能无障碍等技术约束，并确定让作品令人难忘的差异化点。随后实现可运行的代码（HTML/CSS/JS、React、Vue 等），要求功能可用、视觉醒目、风格统一且细节讲究。美学指南涵盖：排版选用独特字体并搭配展示字体与正文字体、避免 Arial/Inter 等通用字体；用 CSS 变量统一色彩主题，主色配锐利点缀；用动画与微交互营造效果，HTML 优先纯 CSS，React 可用 Motion，重视页面加载的编排式揭示；空间构成上采用非对称、重叠、斜向、打破网格的布局；背景与视觉细节使用渐变网格、噪点纹理、几何图案、层叠透明、戏剧化阴影、装饰边框、自定义光标等营造氛围。要求避免通用 AI 审美（如常见字体、紫渐变白底、可预测布局），根据语境做多元变化，并让实现复杂度与美学愿景匹配。
sveltekit-svelte5-tailwind-skill
这是一个面向 SvelteKit 2、Svelte 5 与 Tailwind CSS v4 技术栈的集成技能（Skill），为构建现代 Web 应用提供综合性指导。技能内容覆盖三套工具协同配置的常见挑战，包括 Vite 插件配置、Svelte 5 runes 在 SSR 场景下的使用限制、表单渐进增强、开发与生产环境的 CSS 加载，以及面向 Vercel、Cloudflare、Node 和静态站点的部署与版本迁移。技能内置两套可检索文档集合：references 收录 17 篇问题导向指南（入门、项目搭建、runes、路由、服务端渲染、数据加载、表单与 actions、Tailwind 样式、部署、迁移、性能优化、常见问题与排错等），docs 收录 7 篇完整参考（SvelteKit 配置、Svelte 5 API、Tailwind v4 配置、适配器、进阶路由、进阶 SSR、集成模式）。它采用五阶段检索流程（发现索引、加载索引、筛选候选、读取目标段落、综合回答），强调先查文档再实现，并附带快速开始命令与集成代码模式示例。
web-artifacts-builder
web-artifacts-builder 是 Anthropic 提供的工具套件，用于使用现代前端技术栈（React、Tailwind CSS、shadcn/ui）创建结构复杂、多组件的 claude.ai HTML artifact。它通过初始化脚本搭建 React 项目，开发完成后利用打包脚本将全部 JavaScript、CSS 和依赖内联为单个自包含的 HTML 文件，从而可直接在 Claude 对话中作为 artifact 分享。项目内置 40 多个 shadcn/ui 组件和完整的 Radix UI 依赖，并预置路径别名、Tailwind 主题系统与 Parcel 打包配置，同时兼容 Node 18 及以上环境。该工具还提供设计与风格指南，提醒避免过度居中布局、紫色渐变、统一圆角和 Inter 字体等常见 AI 生成风格。适合需要构建较完整交互式前端界面并作为单个 HTML 交付的场景。
frontend-design
该技能用于指导创建独特、达到生产级水准的前端界面，避免常见的“AI 味”审美。用户提供前端需求（组件、页面、应用或界面）及其用途、受众或技术约束后，技能先引导进行设计思考：明确要解决的问题与使用者、选定鲜明甚至极端的美学基调（如极简、复古未来、奢华、编辑杂志风、粗野主义、工业实用等）、梳理框架与性能无障碍等技术约束，并确定让作品令人难忘的差异化点。随后实现可运行的代码（HTML/CSS/JS、React、Vue 等），要求功能可用、视觉醒目、风格统一且细节讲究。美学指南涵盖：排版选用独特字体并搭配展示字体与正文字体、避免 Arial/Inter 等通用字体；用 CSS 变量统一色彩主题，主色配锐利点缀；用动画与微交互营造效果，HTML 优先纯 CSS，React 可用 Motion，重视页面加载的编排式揭示；空间构成上采用非对称、重叠、斜向、打破网格的布局；背景与视觉细节使用渐变网格、噪点纹理、几何图案、层叠透明、戏剧化阴影、装饰边框、自定义光标等营造氛围。要求避免通用 AI 审美（如常见字体、紫渐变白底、可预测布局），根据语境做多元变化，并让实现复杂度与美学愿景匹配。
react-router
React Router v8 参考技能，覆盖 Declarative、Data、Framework 三种模式，重点说明 Framework Mode（原 Remix）的 loader、action、middleware、routes.ts 及常用 hooks 与组件 API，按任务分类导航到对应文档页。
opendesign-application
OpenDesign 工程化落地指南，面向新建或改造项目采用 @opensig/opendesign 设计系统的开发者，覆盖脚手架、主题系统集成、全局样式基础设施、目录组织与编码约定，并提供 Nuxt 4 SSR 与 Vite + Vue 3 SPA 两套可运行脚手架。
google-fonts-curator
Google Fonts Curator 是一个用于网站字体选型的技能，可根据品牌调性、页面类型与视觉方向推荐有品味的 Google Fonts 字体及搭配，适合需要字体选择、字体配对或排版方向建议的场景。
react-best-practices
一份 React 最佳实践技能，围绕 hooks、Effect、refs 与组件设计，讲解 Effect 作为“逃生舱”的正确用法、常见反模式及替代方案，并给出决策树与参考文档。
stitch-extract-static-html
用于从本地前端页面提取静态 HTML 并内联可获取资产的技能。适合保存指定 UI 状态、离线检查或为 Stitch 上传准备文件。输出不含交互逻辑，不自动上传、不安装依赖，需提供获准访问的本地 URL、视口与输出路径。
stitch-site-md
将站点需求与现有页面整理为 .stitch/SITE.md 的技能，用于为 Stitch Build Loop 确定网站身份、导航、页面状态、优先级与创作边界。视觉 token 提取或实际生成屏幕需用对应技能。
stitch-ui-vue-element-plus-components
将 Stitch 设计转换为模块化 Vite/Vue 3 与 Element Plus 组件的技能，通过 Stitch MCP 获取设计 JSON 与 HTML，强调 Vue SFC 结构、数据解耦与 Element Plus 组件契约。
frontend-design
frontend-design 是一个用于创建独特、生产级前端界面的技能，旨在帮助用户构建具有高设计质量的网页组件、页面与界面，并避免常见的人工智能生成式审美。该技能在用户提出构建前端组件、页面或应用需求时启用，先进行设计思考，再实现可运行的真实代码。其设计流程强调在编码前明确界面用途、目标用户、语气风格、技术约束与差异化亮点，并选择一个清晰的概念方向加以精确执行。该技能给出的美学指南覆盖字体排印、色彩与主题、动效、空间构图、背景与视觉细节，并明确避免通用字体、陈词滥调配色与千篇一律的布局。资料未提供安装命令、价格、平台限制或具体使用步骤等信息。
blog-narrator
把博客 Markdown 导出为逐行披露的演示 HTML，支持轻量预览与 Edge TTS 分段配音合并。适用于将博客转为演讲演示或配音 HTML，可生成自包含单文件。
vite-plus
Vite+（命令为 vp）是一体化 Web 前端工具链，整合了运行时管理、包管理、开发、构建、测试、格式化与 lint 能力。该技能用于在 Agent 开发场景中创建 Vite+ 项目、执行 vp 命令以及配置或迁移 Vite+ 工具链。核心做法是用 vp check 统一完成格式化、lint 与类型检查，用 vp run 执行 package.json 脚本、vp test 运行内置测试，不再分别直接使用 prettier、eslint、vitest，相关配置统一放进 vite.config.ts。
write-component-jsdocs
vapor-ui 组件 JSDoc 编写指南，用于在组件 tsx 文件与 css.ts 变体文件中添加、审查或修复 JSDoc 注释，面向通过 Storybook Autodocs 等文档站点首次接触组件的开发者。
shadcn
shadcn/ui 是一个用于构建界面、组件与设计系统的框架，其组件通过 CLI 以源代码形式添加到用户项目中。该技能（Skill）用于管理 shadcn 组件与项目，涵盖添加、搜索、修复、调试、样式设置与组合 UI，也包括聊天界面。它提供项目上下文信息（如别名、是否为 RSC、Tailwind 版本、样式、基础库、图标库、路径、框架、包管理器、预设等），并强调组合而非重造、优先使用已有组件与内置变体、使用语义化颜色等原则。使用方式为基于项目包管理器运行 npx shadcn@latest（或 pnpm dlx、bunx --bun）命令，如 info、search、docs、view、add、apply、preset 等。适用场景包括初始化新项目、初始化已有项目、创建 monorepo 项目、创建设计系统应用、从 DESIGN.md 构建设计系统、更新组件、切换预设等。限制方面：不得臆测注册表，需用户明确指定；不使用 --overwrite 除非用户明确批准；不手动从 GitHub 获取原始文件；预设命令需在用户项目目录内运行。