marp-html-to-png

Ryunosuke-Tanaka-sti/claude_and_blog_seminar

Create HTML diagrams for Marp slides and capture them as PNG screenshots using Playwright MCP

2 stars

1 forks

HTML

247 views

View on GitHub Add to Favorites

Installation

Option 1: Use slash command in Claude Code

/install-skill https://github.com/Ryunosuke-Tanaka-sti/claude_and_blog_seminar/tree/main/.claude/skills/marp-html-to-png

Option 2: Clone to skills directory

# Global (all projects)

git clone https://github.com/Ryunosuke-Tanaka-sti/claude_and_blog_seminar/tree/main/.claude/skills/marp-html-to-png ~/.claude/skills/claude_and_blog_seminar

# Project-specific

git clone https://github.com/Ryunosuke-Tanaka-sti/claude_and_blog_seminar/tree/main/.claude/skills/marp-html-to-png .claude/skills/claude_and_blog_seminar

Add MCP server to .cursor/mcp.json:

{
  "mcpServers": {
    "skillz": {
      "command": "npx",
      "args": ["-y", "skillz-mcp", "https://github.com/Ryunosuke-Tanaka-sti/claude_and_blog_seminar/tree/main/.claude/skills/marp-html-to-png"]
    }
  }
}

Restart Cursor after adding the configuration.

Option 1: Use Gemini CLI command

gemini extensions install https://github.com/Ryunosuke-Tanaka-sti/claude_and_blog_seminar/tree/main/.claude/skills/marp-html-to-png

Option 2: Clone to extensions directory

git clone https://github.com/Ryunosuke-Tanaka-sti/claude_and_blog_seminar/tree/main/.claude/skills/marp-html-to-png ~/.gemini/extensions/claude_and_blog_seminar

Topics

Related Skills

html-ppt

HTML PPT Studio — author professional static HTML presentations in many styles, layouts, and animations, all driven by templates. Use when the user asks for a presentation, PPT, slides, keynote, deck, slideshow, "幻灯片", "演讲稿", "做一份 PPT", "做一份 slides", a reveal-style HTML deck, a 小红书图文, or any kind of multi-slide pitch/report/sharing document that should look tasteful and be usable with keyboard navigation. Triggers include keywords like "presentation", "ppt", "slides", "deck", "keynote", "reveal", "slideshow", "幻灯片", "演讲稿", "分享稿", "小红书图文", "talk slides", "pitch deck", "tech sharing", "technical presentation".