大类 · 64 个工具 · 3 个分区

面向前端开发者的 AI 开发工具

组件背后的实战技术栈：AI 代码编辑器与终端 Agent、为这些 Agent 提供上下文的 MCP 服务器与技能，以及把成果发布到网址上的平台。

01 / 03

AI 代码编辑器与开发者工具

Claude Code preview

Claude Code开发者工具直接在命令行终端中运行的 agentic 编程助手。

Cursor preview

Cursor开发者工具AI 优先的代码编辑器，旨在加速软件的编写与交付。

Zed preview

Zed开发者工具高性能代码编辑器，专为低延迟、灵敏的编辑体验而打造。

v0 preview

v0开发者工具将纯文本提示词转化为可用 shadcn/ui 代码的生成式 AI 工具。

Bolt.new preview

Bolt.new开发者工具在浏览器中构建和运行全栈应用的沙盒环境。

Vite preview

Vite开发者工具面向现代 Web 项目的快速前端构建工具与开发服务器。

Biome preview

Biome开发者工具用 Rust 编写的快速代码格式化与 lint 工具，面向 Web 开发项目。

Playwright preview

Playwright开发者工具自动化浏览器、运行可靠端到端测试套件的框架。

buildertools.sh

BuilderTools preview

BuilderTools开发者工具一套专注的开发者工具，帮助你更快地交付软件。

nuqs preview

nuqs开发者工具读写类型安全 URL 查询参数的 React 库。

better-t-stack.dev

Better T Stack preview

Better T Stack开发者工具用命令行脚手架搭建现代全栈 TypeScript 项目的工具。

AI Stack preview

AI Stack开发者工具对比构建 AI 应用所用现代技术栈的目录。

Alumnium preview

Alumnium开发者工具用自然语言编写端到端测试，通过 MCP 提供。

vercel-doctor.com

Vercel Doctor preview

Vercel Doctor开发者工具精准定位 Next.js 应用性能瓶颈的诊断工具。

OSS Perks preview

OSS Perks开发者工具为开源项目维护者汇集免费云额度与福利的平台。

Vinext preview

Vinext开发者工具让你在 Cloudflare 上构建和运行 Next.js 应用的 Vite 插件。

evlog preview

evlog开发者工具用于在 Web 应用中捕获事件的结构化日志框架。

audio.raphaelsalaja.com

@web-kits/audio preview

@web-kits/audio开发者工具在 Web 应用中声明式添加和控制声音的库。

Nue preview

Nue开发者工具轻量级 Web 框架，定位为更精简的 React 替代方案。

Umami preview

Umami开发者工具注重隐私的 Web 分析工具，无需 cookie 同意横幅即可使用。

torph.lochie.me

Torph preview

Torph开发者工具零依赖的文字变形过渡动画库。

x.ai/bot preview

x.ai/bot开发者工具详细说明 xAI 网络爬虫规范的文档。

Tracwell preview

Tracwell开发者工具专注追踪网站访客与转化的分析工具。

DialKit preview

DialKit开发者工具应用内悬浮工具栏，让你在操作时实时调节参数。

02 / 03

AI 编程 Agent 与 MCP 服务器

Dray preview

DrayAgent 与 MCP统一的桌面工作空间，用于运行和管理多个编程 agent。

styles.refero.design

Refero preview

ReferoAgent 与 MCP结构化的 DESIGN.MD 规范文件，指导 AI agent 进行设计。

designmd.me preview

designmd.meAgent 与 MCP生成机器可读的设计规范，供 AI 编码 agent 解析并据此构建。

Open Design preview

Open DesignAgent 与 MCP将设计系统打包成标准化格式，供 AI agent 读取并应用。

designmd.supply

designmd.supply preview

designmd.supplyAgent 与 MCP一套 DESIGN.MD 模板库，引导 AI 助手遵循你预期的外观与规则。

getdesign.md preview

getdesign.mdAgent 与 MCP交互式生成器，为 AI 编码 agent 制定可遵循的设计规则。

design-md.hyperbrowser.ai

Hyperbrowser Design.md preview

Hyperbrowser Design.mdAgent 与 MCP直接从现有网站提取设计规则，生成 DESIGN.MD 文件。

Aura preview

AuraAgent 与 MCP构建结构化的设计系统，为 AI agent 提供清晰的工作准则。

Neuform preview

NeuformAgent 与 MCPAI 辅助的界面设计，将你的布局输出为干净可用的代码。

typeui.sh preview

typeui.shAgent 与 MCP命令行工具，脚手架生成带类型的 UI 组件，让你从干净的配置起步。

Webclaw preview

WebclawAgent 与 MCP将任意网页转换为干净、结构化的 markdown，便于 AI agent 读取。

Ghostex preview

GhostexAgent 与 MCP在一处同时运行并协调多个后台编码 agent 会话。

is-agentic.com preview

is-agentic.comAgent 与 MCP评估网站对爬虫与自动化 agent 的友好程度。

Herdr preview

HerdrAgent 与 MCP分布式运行器，为你的编码 agent 管理并调度任务。

soubi.vercel.app

Soubi preview

SoubiAgent 与 MCP编译器，将 agent skill 定义转换为可用的构建产物。

agentcn preview

agentcnAgent 与 MCP生产级、可定制的 AI agent 方案，可直接接入 React 项目。

skills preview

skillsAgent 与 MCP面向 shadcn registry 与日常开发流程打造的 agent skills。

mcpcn preview

mcpcnAgent 与 MCP用于构建 ChatGPT、Claude 与 MCP 应用界面的 React UI 组件。

integrations.sh

integrations.sh preview

integrations.shAgent 与 MCP一个 API 集成规范仓库，供 AI agent 参考并据此构建。

fx preview

fxAgent 与 MCP用 Zig 编写的高性能编码 agent，通过命令行运行。

hyperframes.dev

HyperFrames preview

HyperFramesAgent 与 MCP无头引擎，无需可见浏览器即可将 HTML 渲染为 MP4 视频。

Foglamp preview

FoglampAgent 与 MCP可观测性工具，持续监控延迟与运行成本。

Distill preview

DistillAgent 与 MCP一个 AI agent，将零散的研究笔记收集起来并整理成序。

Agentation preview

AgentationAgent 与 MCP将屏幕上的 UI 标注转化为 AI agent 可据此行动的上下文。

OpenCode preview

OpenCodeAgent 与 MCP开源 AI 编码 agent，常驻终端、通过命令行工作。

impeccable.style

Impeccable preview

ImpeccableAgent 与 MCP一项设计智能 skill，让 AI agent 更懂什么是好的 UI。

SkillSync preview

SkillSyncAgent 与 MCP让你的 agent 上下文在不同代码编辑器之间保持同步。

bb preview

bbAgent 与 MCP开源开发环境，专为运行与测试编码 agent 而打造。

Capacity preview

CapacityAgent 与 MCP自然语言工作区，将你的 prompt 转化为全栈应用。

Lafys preview

LafysAgent 与 MCPprompt 驱动的生成器，将朴素的描述转化为面向搭建者的 UI 组件。

Efecto preview

EfectoAgent 与 MCP以 agent 为先的可视化 web 画布，通过 MCP 接入已连接的工具。

Arc labs preview

Arc labsAgent 与 MCPAI 求职工具套件，提供模拟技术面试助你练习。

Scira preview

SciraAgent 与 MCP精简的开源 AI 搜索引擎，用于在全网中查找答案。

Kombai preview

KombaiAgent 与 MCPAI 设计工程师，根据你给出的上下文编写 UI 代码。

Causal preview

CausalAgent 与 MCPAI 驱动的画布工作区，用于记录笔记与梳理规划。

03 / 03

部署与托管平台

Vercel preview

Vercel部署托管用于部署 Next.js 应用并将其发布到网上的云平台。

developers.cloudflare.com

Cloudflare preview

Cloudflare部署托管在全球边缘网络上运行无服务器 Workers 来部署应用。

Netlify preview

Netlify部署托管一个网站托管平台，通过持续部署流水线发布你的站点。

Railway preview

Railway部署托管一个基础设施平台，让部署应用和数据库更简单。

Fly.io preview

Fly.io部署托管将你的 Docker 容器运行在物理上靠近用户的服务器上。

面向前端开发者的 AI 开发工具（64） — Designeer