frontend-design(前端视觉方向)
为新建或重设计的前端界面确定视觉设计方向:布局、字体排印、色彩、动效与反平庸 AI 审美。在设计页面、仪表盘、海报、营销界面或探索性 UI 变体时使用。
使用场景/Cursor 开发必备
面向 Cursor 用户的入门组合:文件、GitHub、文档、浏览器。快速搭建 AI 编程工作流。
共匹配 6,596 个资源 · 第 64 / 138 页
Cursor 对 MCP 的支持是原生且开箱即用的:在 Settings → MCP 或项目根的 .cursor/mcp.json 中粘贴一段 JSON 即可接入任意 MCP Server。搭配 AgentHub 的一键配置生成器,从发现到接入通常不超过一分钟。
推荐的入门组合覆盖四类高频需求:Filesystem(读写项目文件)、GitHub(PR / Issue / diff)、Context7(最新框架文档,减少幻觉)、Playwright(浏览器验证与 E2E)。之后再按业务补充数据库、抓取或国内服务类 MCP。
本页列出的每个资源都附带 Cursor 专用配置片段:在 AgentHub 打开资源详情页 → 选择 Cursor Tab → 复制 JSON 粘贴即可,安装命令与鉴权环境变量一并给出。
为新建或重设计的前端界面确定视觉设计方向:布局、字体排印、色彩、动效与反平庸 AI 审美。在设计页面、仪表盘、海报、营销界面或探索性 UI 变体时使用。
端到端修复 Cursor 的 RTL(从右到左)渲染问题并做可视化验证。当用户提供 cursor-ext-rtl 的 GitHub issue、提到 RTL 视觉缺陷、Markdown 表格、希伯来语/阿拉伯语/波斯语排版、Cursor 聊天渲染,或要求开发并可视化测试修复方案时使用。
将编码任务委托给 OpenAI Codex CLI(开发功能、提 PR)。
创建专业级 CSS 动画、过渡、微交互与复杂动效设计。在添加动画、悬停效果、加载状态、页面过渡、滚动动画或任何动效设计工作时使用。
使用 mcpc CLI 在 shell 中操作 MCP(Model Context Protocol)服务器——以持久会话连接服务器,随后列出并调用工具、读取资源、获取 prompts、运行异步任务。脚本与代码模式请使用 --json。凡需与 MCP 服务器交互、调用 MCP 工具或以编程方式访问 MCP 资源时都可使用。
OrangeHRM 测试分层参考——`phpunit.xml` 中声明的按插件 PHPUnit 测试套件、测试数据库生命周期(`instance:create-test-db` 构建含数据的 MySQL 库并由 `CoreFixtureService` 导出、bootstrap 在每个测试时还原)、测试基类(`TestCase` 用于纯单元测试、`KernelTestCase` 用于需要完整框架与 DI 容器的测试、`EntityTestCase` 用于纯实体测试、`EndpointTestCase` 与 `EndpointIntegrationTestCase` 用于带请求 mock 与异常期望的 API 端点测试)、YAML fixture 模式(按插件 `test/fixtures/<DaoName>.yml` + 在 `setUp()` 中调用 `TestDataService::populate($yamlPath)`)、前端单元测试的 Jest 配置(`@vue/cli-plugin-unit-jest/presets/typescript-and-babel`、同级 `__tests__/` 目录),以及用于 E2E 的 Cypress(独立工作区位于 `src/test/functional/`)。当用户编写测试、决定继承哪个基类、调试 fixture 加载、搭建测试数据库、运行单个测试类或试图弄清测试机制时使用。
个人自动化专长,涵盖 IFTTT 小程序、Apple 快捷指令、Android 自动化、财务自动化(缴费、储蓄、投资)、通知管理、日常例程自动化、智能家居编排,以及构建能减少认知负担、节省重复生活事务时间的系统。当用户询问 automation for life、相关技术、最佳实践,或需要该领域指导时使用。当请求超出 automation for life 范围或需要其他专项技能时请勿使用。
基于 Zapier、Make 与 n8n 的工作流自动化设计,涵盖触发-动作架构、多步自动化流程、错误处理策略、个人与商业自动化模式、ROI 计算,以及常用自动化配方库。当用户询问 automation architect、相关技术、最佳实践,或需要该领域指导时使用。当请求超出 automation architect 范围或需要其他专项技能时请勿使用。
面向应用开发的 SQLite 专长,涵盖 WAL 模式配置、并发访问模式、FTS5 全文检索、JSON 支持、虚拟表、PRAGMA 优化、备份策略、文件锁行为、桌面与移动应用的内嵌模式、迁移策略,以及对容量与并发限制的理解。当用户询问 sqlite specialist、sqlite specialist 最佳实践,或需要 sqlite specialist 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
高级 SQL 专长,包括窗口函数、CTE、递归查询、基于 EXPLAIN 执行计划的查询优化、索引策略、pivot/unpivot 操作、JSON 操作、全文检索、存储过程,以及在 PostgreSQL、MySQL 与 SQL Server 中识别性能反模式。当用户询问 sql master、sql master 最佳实践,或需要 sql master 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
面向分析的高级 SQL,涵盖窗口函数、CTE、递归查询、查询优化、透视,以及面向数据仓库与分析型数据库的复杂分析模式。当用户询问 sql analytics expert、相关技术、最佳实践,或需要该领域指导时使用。当请求超出 sql analytics expert 范围或需要其他专项技能时请勿使用。
指导实现专家级的重构模式:重构与整洁代码决策框架、生产可用的模式以及重构模式工作流的具体模板。当用户询问重构模式、refactoring patterns 配置,或重构项目的重构最佳实践时使用。当用户需要其他开发者工具能力时请勿使用——可查看 developer tools 子类目下的同级技能。
代码重构专家,运用 Martin Fowler 的重构目录、代码坏味道检测、安全的逐步变换与指标驱动的重构决策。当用户询问 refactoring guru、refactoring guru 最佳实践,或需要 refactoring guru 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
高级 CSS 专长,涵盖 Grid 与 Flexbox 精通、自定义属性架构、响应式设计方法论、CSS 方法论选型、动画性能、容器查询、层叠层级(cascade layers)与优先级管理。当用户询问 css master、css master 最佳实践,或需要 css master 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
指导实现专家级的 CSS 架构:html-css 与 web-development 决策框架、生产可用的模式以及 css 架构工作流的具体模板。当用户询问 css 架构、css architecture 配置,或 CSS 项目的 html-css 最佳实践时使用。当用户需要其他 Web 开发能力时请勿使用——可查看 web development 子类目下的同级技能。
移动无障碍开发专长,涵盖 iOS VoiceOver 与 Android TalkBack 集成、SwiftUI 与 Jetpack Compose 的无障碍 API、触控目标尺寸、手势替代方案、动态字体支持、颜色对比合规、读屏软件测试,以及 WCAG 移动端专项成功标准。当用户询问 accessible mobile developer、相关技术、最佳实践,或需要该领域指导时使用。当请求超出 accessible mobile developer 范围或需要其他专项技能时请勿使用。
专业移动 UI/UX 模式,涵盖平台设计规范(Material Design、Human Interface)、响应式布局、手势处理、离线优先 UI、骨架屏、下拉刷新、无限滚动、底部面板与触觉反馈。当用户询问 mobile ui designer、mobile ui designer 最佳实践,或需要 mobile ui designer 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
专业移动应用测试,涵盖单元测试(XCTest、JUnit)、UI 测试(Espresso、XCUITest、Detox)、截图测试、设备农场测试、性能测试、网络状况模拟、无障碍测试与崩溃报告。当用户询问 mobile testing、mobile testing 最佳实践,或需要 mobile testing 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
移动应用安全,涵盖证书绑定实现、安全的本地存储模式、越狱与 root 检测、代码混淆与防篡改、面向移动客户端的 API 安全、生物识别认证、安全密钥管理、网络安全、逆向工程防御,以及 OWASP MASVS 合规。当用户询问 mobile security engineer、mobile security engineer 最佳实践,或需要 mobile security engineer 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
专业移动持续集成与交付,涵盖 Fastlane 自动化、代码签名管理、TestFlight 与 Google Play 发布流水线、App Center 分发、CI 中的自动化测试、构建版本策略、环境配置,以及 iOS 与 Android 应用的发布管理。当用户询问 mobile cicd、mobile cicd 最佳实践,或需要 mobile cicd 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
全面的移动应用质量评估,覆盖性能、UX、无障碍、安全与应用商店合规,产出可执行的审计记分卡。当用户询问 mobile app quality audit、相关技术、最佳实践,或需要该领域指导时使用。当请求超出 mobile app quality audit 范围或需要其他专项技能时请勿使用。
专业移动分析,涵盖归因追踪、漏斗分析、崩溃报告集成、A/B 测试框架、留存与同期群分析、事件分类体系设计、符合隐私规范的数据采集、实时看板,以及面向 iOS 与 Android 应用的可执行指标策略。当用户询问 mobile analytics、mobile analytics 最佳实践,或需要 mobile analytics 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
移动隐私专长,涵盖应用权限管理、iOS 与 Android 的跟踪防护、加密通讯应用选型、设备加密、注重隐私的浏览器与 DNS 配置、位置跟踪最小化、应用审计方法论,并在不牺牲可用性的前提下构建注重隐私的移动环境。当用户询问 mobile privacy guide、相关技术、最佳实践,或需要该领域指导时使用。当请求超出 mobile privacy guide 范围或需要其他专项技能时请勿使用。
免费游玩手游设计,涵盖 F2P 设计模式、留存机制、短会话设计、变现模式(内购、广告、战令)、移动 UX、新手引导流程、A/B 测试、数据驱动的设计与长线运营策略。当用户询问 mobile game designer 或需要相关主题帮助时使用。不适用于无关领域或已有更专门技能的场景。
化身为资深后端架构师,设计可扩展、高可用的服务端系统,明确 API 契约、合理的模型与有据可查的取舍。当用户需要系统设计、数据库架构、API 契约定义、缓存策略或后端技术选型时使用。编写前端 UI 组件、CSS,或对现有 PR 做代码评审时请勿使用。
指导实现专家级的 Kubernetes 工作负载设计:云与架构决策框架、生产可用的模式以及 kubernetes 工作负载设计工作流的具体模板。当用户询问 kubernetes 工作负载设计、kubernetes workload design 配置,或 Kubernetes 项目的 DevOps 最佳实践时使用。当用户需要其他 devops cloud 能力时请勿使用——可查看 devops cloud 子类目下的同级技能。
Kubernetes 编排。Pod 设计模式、Deployment/StatefulSet/DaemonSet、Service 类型、Ingress 配置、ConfigMap/Secret、RBAC、HPA/VPA、资源限制、Helm chart、Kustomize、Pod 故障排查。当用户询问 kubernetes operator、kubernetes operator 最佳实践,或需要 kubernetes operator 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
指导实现专家级的 Kubernetes 网络:云与安全决策框架、生产可用的模式以及 kubernetes 网络工作流的具体模板。当用户询问 kubernetes 网络、kubernetes networking 配置,或 Kubernetes 项目的 DevOps 最佳实践时使用。当用户需要其他 devops cloud 能力时请勿使用——可查看 devops cloud 子类目下的同级技能。
指导实现专家级的 Kubernetes 配置:云与最佳实践决策框架、生产可用的模式以及 kubernetes 配置工作流的具体模板。当用户询问 kubernetes 配置、kubernetes configuration 配置,或 Kubernetes 项目的 DevOps 最佳实践时使用。当用户需要其他 devops cloud 能力时请勿使用——可查看 devops cloud 子类目下的同级技能。
最常见 Docker 错误的解决方案——清理命令、容器调试、网络问题、构建失败与性能问题。当用户询问 docker quick fix、相关技术、最佳实践,或需要该领域指导时使用。当请求超出 docker quick fix 范围或需要其他专项技能时请勿使用。
指导实现专家级的 Docker 生产模式:云与安全决策框架、生产可用的模式以及 docker 生产模式工作流的具体模板。当用户询问 docker 生产模式、docker production patterns 配置,或 Docker 项目的 DevOps 最佳实践时使用。当用户需要其他 devops cloud 能力时请勿使用——可查看 devops cloud 子类目下的同级技能。
Docker 容器化专家。多阶段构建、层缓存、安全(非 root、distroless)、docker-compose 模式、健康检查、网络、数据卷管理、镜像仓库管理、镜像扫描与 Dockerfile 优化。当用户询问 docker engineer、docker engineer 最佳实践,或需要 docker engineer 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
指导实现专家级的 Docker Compose 模式:云与自动化决策框架、生产可用的模式以及 docker compose 模式工作流的具体模板。当用户询问 docker compose 模式、docker compose patterns 配置,或 Docker 项目的 DevOps 最佳实践时使用。当用户需要其他 devops cloud 能力时请勿使用——可查看 devops cloud 子类目下的同级技能。
数据库性能评估:考察查询效率、索引策略、连接管理、配置与扩展就绪度,产出可执行的 performance 记分卡。当用户询问 database performance audit、相关技术、最佳实践,或需要该领域指导时使用。当请求超出 database performance audit 范围或需要其他专项技能时请勿使用。
指导实现专家级的数据库迁移模式:数据库与自动化决策框架、生产可用的模式以及数据库迁移模式工作流的具体模板。当用户询问数据库迁移模式、database migration patterns 配置,或数据库项目的数据库最佳实践时使用。当用户需要其他后端基础设施能力时请勿使用——可查看 backend infrastructure 子类目下的同级技能。
数据库 schema 迁移专家,涵盖零停机迁移策略、schema 演进模式、数据回填技术、迁移工具链(Flyway、Liquibase、自研)、回滚规划、蓝绿数据库部署、大表迁移与迁移测试策略。当用户询问 database migration expert、database migration expert 最佳实践,或需要 database migration expert 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
数据库 schema 设计专长,涵盖规范化与反规范化策略、索引、查询优化、分区、连接池、迁移管理、多租户模式与只读副本。当用户询问 database architect、database architect 最佳实践,或需要 database architect 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
高级 TypeScript 专长,涵盖类型级编程、泛型模式、可辨识联合、模板字面量类型、条件类型、映射类型、声明合并、模块增强以及严格模式的精通运用。当用户询问 typescript guru、typescript guru 最佳实践,或需要 typescript guru 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
指导高级 TypeScript 类型运算:可辨识联合、映射类型、条件类型、模板字面量类型、工具类型组合,以及面向库作者的类型级编程。当用户询问 typescript 类型模式、可辨识联合、映射类型、条件类型、模板字面量类型、工具类型或 infer 关键字时使用。当用户询问 TypeScript 基础配置(用 typescript-project-setup)、运行时校验(用 typescript-runtime-safety)或 JavaScript 惯用法(用 javascript-idioms)时请勿使用。
指导使用 Zod 进行 TypeScript 运行时类型校验:schema 设计、品牌类型、类型守卫、应用边界处的运行时校验,以及 parse-not-validate 模式。当用户询问 Zod schema、运行时校验、品牌类型、类型守卫、parse-not-validate 或 API 边界校验时使用。当用户询问 TypeScript 类型系统特性(用 typescript-type-patterns)、项目配置(用 typescript-project-setup)或测试(用 javascript-testing-patterns)时请勿使用。
指导完成专家级的 TypeScript 项目配置:开启严格模式的 tsconfig.json、路径别名、声明文件生成、monorepo 的组合工程(composite projects)以及 ESM 配置,覆盖决定类型安全与开发体验的关键决策。当用户询问搭建 TypeScript 项目、配置 tsconfig.json、设置路径别名、组合工程或 TypeScript 构建配置时使用。当用户询问 TypeScript 类型模式(用 typescript-type-patterns)、运行时校验(用 typescript-runtime-safety)或 Node.js 搭建(用 nodejs-project-setup)时请勿使用。
指导实现专家级的 Next.js 性能优化:TypeScript 与框架决策框架、生产可用的模式以及 nextjs 性能工作流的具体模板。当用户询问 next.js 性能、nextjs performance 配置,或 Next.js 项目的 TypeScript 最佳实践时使用。当用户需要其他 Web 开发能力时请勿使用——可查看 web development 子类目下的同级技能。
指导实现专家级的 Next.js 部署模式:TypeScript 与框架决策框架、生产可用的模式以及 nextjs 部署模式工作流的具体模板。当用户询问 next.js 部署模式、nextjs deployment patterns 配置,或 Next.js 项目的 TypeScript 最佳实践时使用。当用户需要其他 Web 开发能力时请勿使用——可查看 web development 子类目下的同级技能。
指导实现专家级的 Next.js 数据模式:TypeScript 与框架决策框架、生产可用的模式以及 nextjs 数据模式工作流的具体模板。当用户询问 next.js 数据模式、nextjs data patterns 配置,或 Next.js 项目的 TypeScript 最佳实践时使用。当用户需要其他 Web 开发能力时请勿使用——可查看 web development 子类目下的同级技能。
Next.js 架构专长,涵盖 App Router 模式、服务端与客户端组件、基于 Server Actions 的数据获取、中间件、路由处理器、ISR、流式 SSR、图片优化、并行路由与拦截路由。当用户询问 nextjs architect、nextjs architect 最佳实践,或需要 nextjs architect 实施指导时使用。当用户需要其他专项技能或涉及无关技术领域时请勿使用。
指导实现专家级的 Next.js App Router 模式:TypeScript 与框架决策框架、生产可用的模式以及 App Router 工作流的具体模板。当用户询问 next.js app router 模式、nextjs app router 模式配置,或 Next.js 项目的 TypeScript 最佳实践时使用。当用户需要其他 Web 开发能力时请勿使用——可查看 web development 子类目下的同级技能。
当用户想评审 pull request、理解 PR 的改动、评估合并风险或检查测试覆盖缺口时使用。示例:“Review this PR”“PR #42 改了什么?”“这个 PR 能安全合并吗?”
当用户想知道改动某处会破坏什么,或在编辑代码前需要安全性分析时使用。示例:“改 X 安全吗?”“什么东西依赖这个?”“这会导致什么出问题?”
两者皆可:项目级 .cursor/mcp.json 随仓库共享给团队,全局 ~/.cursor/mcp.json 对本机所有项目生效。含密钥的配置建议放项目级并加入 .gitignore,或用环境变量引用。
每个启用的 MCP 都会向上下文注入工具定义,建议按项目启用、用完禁用不常用的服务器,把上下文留给真正需要的工具。
JSON 结构相同,差异主要在命令路径与环境变量写法(如 npx 与绝对路径、引号转义)。AgentHub 详情页会区分 stdio 与远程托管(streamable-http/SSE)两类接入方式。