幻灯片
](https://www.npmjs.com/package/slideshot) ](https://www.npmjs.com/package/slideshot) ](https://www.npmjs.com/package/slideshot-mcp) ](https://github.com/06ketan/slideshot)      ](https://lobehub.com/mcp/06ketan-slideshot)
将AI生成的HTML旋转木马转换为高分辨率PNG、WebP、PDF和PPTX——通过 命令行界面, 网页应用, MCP服务器,或 REST API.
建筑
slideshot/
packages/
cli/ ← Core Puppeteer rendering engine + CLI
mcp-server/ ← MCP stdio server for AI tools
webapp/ ← Next.js web app with live preview
prompts/
generic.md ← Clean minimal
branded.md ← Ketan Slides design system
instagram-carousel.md ← Bold vibrant IG style
infographic.md ← Data-heavy charts
pitch-deck.md ← Professional presentations
dark-modern.md ← Neon glassmorphism
editorial.md ← Magazine serif快速开始
命令行界面
npx slideshot ./my-carousel.html --formats png,webp,pdf --scale 4选项:
| 标志 | 默认值 | 描述 |
|---|---|---|
-s, --selector | .slide | 幻灯片元素的CSS选择器 |
-W, --width | 540 | 幻灯片宽度(CSS像素) |
-H, --height | 675 | 幻灯片高度(CSS像素) |
--scale | 4 | 设备规模(4x=2160x2700) |
-f, --formats | png,webp,pdf | 输出格式(png、webp、pdf、pptx) |
-q, --quality | 95 | WebP质量(0-100) |
-o, --out | ./slides | 输出目录 |
网页应用
直播: 幻灯片.vercel.app
或者在本地运行:
cd packages/webapp && npm install && npm run dev打开 http://localhost:3000 --粘贴HTML、预览、导出。
MCP服务器
添加到Claude桌面或光标配置:
{
"mcpServers": {
"slideshot": {
"command": "npx",
"args": ["-y", "slideshot-mcp"]
}
}
}工具:
create_slides--具有7个主题和输出预设的指导性创建工作流程render_html_to_images--将HTML渲染为PNG/WebP/PDF/PPTXget_slide_prompt--获取任何主题变体的AI提示模板health_check--验证Puppeteer/Chromium的可用性
提示(7个主题):
generic-slides--清洁度最低branded-slides--科坦幻灯片设计系统instagram-carousel-slides--大胆而充满活力的IG风格infographic-slides--数据量大的图表和统计数据pitch-deck-slides--专业演讲dark-modern-slides--氖玻璃态editorial-slides--带有金色点缀的杂志衬线字体
REST API(ChatGPT操作/OpenWebUI)
web应用程序在上公开了与OpenAPI兼容的REST API https://slideshot.vercel.app.
终点:
| 方法 | 路径 | 描述 |
|---|---|---|
POST | /api/render | 将HTML幻灯片渲染为PNG/WebP/PDF(返回ZIP) |
GET | /api/prompt?variant=generic | 获取AI提示模板 |
GET | /api/openapi.json | OpenAPI 3.1.0规范 |
平台支持:
| 平台 | 方法 | 设置 |
|---|---|---|
| 光标 | MCP | npx slideshot-mcp 在 .cursor/mcp.json |
| 克劳德桌面 | MCP | npx slideshot-mcp 在配置中 |
| ChatGPT | OpenAPI操作 | 导入 /api/openapi.json |
| OpenWebUI | OpenAPI工具 | 导入 /api/openapi.json |
AI提示模板
7种快速变体 prompts/ --复制粘贴或通过使用 get_slide_prompt 工具:
| 变量 | 文件 | 样式 |
|---|---|---|
| 通用 | prompts/generic.md | 干净最小,Inter字体 |
| 品牌化 | prompts/branded.md | 太空单色、青色/珊瑚色 |
prompts/instagram-carousel.md | 大胆的渐变,Poppins | |
| 信息图表 | prompts/infographic.md | DM Sans,统计卡 |
| 球场甲板 | prompts/pitch-deck.md | 专业KPI卡 |
| 黑暗现代 | prompts/dark-modern.md | 霓虹灯,玻璃化 |
| 社论 | prompts/editorial.md | Playfair显示屏,金色 |
构建全部
npm install # from root — installs all workspaces
npm run build # builds cli → mcp-server
cd packages/webapp && npm run build # builds webapp separately链接
| 表面 | URL |
|---|---|
| Web应用程序 | 幻灯片.vercel.app |
| npm命令行界面 | |
| npm MCP | |
| GitHub | |
| API规范 | 幻灯片.vercel.app/api/openapi.son |
许可证
麻省理工学院
