zarazhangrui/frontend-slides

Frontend Slides — Claude Code 插件 + Agent Skill，用 AI 生成零依赖单文件 HTML 演示文稿，或将 PPTX 转换为网页版。20.4k stars，JavaScript 实现。

核心特点

• 零依赖：单文件 HTML，内联 CSS/JS，无 npm/构建工具/框架
• 视觉风格发现：不会描述审美？生成预览图让你选，“show, don’t tell”
• PPT 转换：PPTX → HTML，保留图片和内容
• Anti-AI-Slop：精选特色风格，规避通用 AI 美学（紫色渐变白底）
• Bold Template Pack：可选设计感强的模板，来自 beautiful-html-templates
• 生产级质量：16:9 固定比例，无障碍，代码可二次定制

安装方式

Claude Code Plugin（推荐）：

/plugin marketplace add https://github.com/zarazhangrui/frontend-slides
/plugin install frontend-slides@frontend-slides

使用：/frontend-slides:frontend-slides

手动安装：

git clone https://github.com/zarazhangrui/frontend-slides.git ~/.claude/skills/frontend-slides

仓库结构

SKILL.md              # 核心 AI 指令
STYLE_PRESETS.md      # 风格预设
viewport-base.css     # 基础样式
html-template.md      # HTML 模板
animation-patterns.md # 动效模式
bold-template-pack/   # 设计感强模板
scripts/
  extract-pptx.py     # PPTX 解析脚本
  deploy.sh           # 部署脚本
  export-pdf.sh       # PDF 导出

关联页面

• guizang-ppt-skill — 另一款 HTML PPT Skill，双风格（电子杂志/瑞士国际主义）
• skills-cli — npx skills 安装方式