SeeCode
SeeCode 可将 Claude 或其他编码代理给出的简短 JSON 规格转化为带动画、可交互探索的图表，并输出为交互式 HTML，或导出为 SVG、PNG、GIF、MP4。
访问 Aryanutkarsh/SeeCode项目简介
SeeCode 是面向 Claude Code、Cursor、Codex、OpenCode 及其他 Agent Skills 宿主的 Agent Skill。它把简短 JSON 规格转换为具有编辑级质量的图表，可在单个自包含 HTML 文件中探索，也可导出用于文档、演示和社交媒体。
核心功能
- 将 Claude 及其他编码代理提供的简短 JSON 规格转换为带动画、可探索的图表。支持 45 种图表类型及 15 种变体，每种类型都有各自的动画方式，也可完全静态呈现。交互式 HTML 图表支持悬停追踪、点击聚焦、路径播放、透镜筛选、逐步演示、搜索、平移缩放、总览图和可分享的视图链接。可导出为交互式 HTML、SVG、PNG、JPEG、GIF 和 MP4；页面内导出菜单在浏览器中即可使用，无需安装额外工具。可重绘来自
适用场景
- 解释软件架构、部署、依赖、数据模型、流程、时序、状态机等技术系统。为 README、文档站点、Notion、Confluence、PDF、Word、PowerPoint、Keynote、Google Slides、Slack、社交帖子及演讲制作图表。按所需详细程度导入并重绘现有的 Mermaid、Graphviz、PlantUML、D2、draw.io、Excalidraw、Structurizr、BPMN、SQL、Prisma、DBML、OpenAPI
快速开始
- 在 Claude Code 中运行 /plugin marketplace add Aryanutkarsh/seecode，然后运行 /plugin install seecode@seecode。在 Cursor、Codex、OpenCode 及其他 Agent Skills 宿主中运行 npx skills add Aryanutkarsh/seecode -g。随后用自然语言要求代理使用 SeeCode 展示某个流程或系统，并继续提出高亮某条路径、切换深色模式或导出用于幻灯片等请求。
部署与要求
- 需要 Node 20 或更高版本。图表自带的导出菜单可在浏览器中生成 PNG、JPEG、SVG、GIF 和 MP4，无需安装额外工具。从命令行导出时，SVG 只需要 Node；其他导出格式使用机器上已安装的 Chrome 或 Edge。
采用前须知
- 许可证：MIT。在使用、修改或分发项目前，请确认其具体条款。
