browser-canvas
Browser Canvas 让 Claude Code 通过简单的文件操作就能在浏览器中渲染交互式 UI。无需复杂 API，只需编写 App.jsx 或 index.html 文件，就能自动打开浏览器窗口并实现热更新。支持 React 和原生 HTML/CSS/JS 两种模式，是你的前端原型设计神器。
功能简介
Browser Canvas 让 Claude Code 通过简单的文件操作就能在浏览器中渲染交互式 UI。无需复杂 API，只需编写 App.jsx 或 index.html 文件，就能自动打开浏览器窗口并实现热更新。支持 React 和原生 HTML/CSS/JS 两种模式，是你的前端原型设计神器。
适用能力
[{"title":"写文件，出界面，就这么简单","desc":"无需搭建环境，直接进入开发状态，大幅提升前端原型设计效率"},{"title":"复用项目上下文","desc":"结合已有文件、规则和输入材料，减少每次重新说明背景的成本。"},{"title":"输出可交付结果","desc":"适合生成分析结果、执行步骤、代码修改建议或可复制的内容草稿。"}]
输入说明
需求描述、项目文件、参考资料、截图或用户指定的执行规则。
输出说明
分析结果、执行步骤、生成内容、代码修改或可复制的交付文档。
示例提示词
["使用 browser-canvas 帮我处理这个任务","调用 browser-canvas，按当前项目规则给出执行方案","用 browser-canvas 生成一版可以直接交付的结果"]
安装命令
codex skill add parkerhancock/browser-canvas