Marp Slide Studio

A Claude Code skill for creating professional, visually polished presentations using Marp (Markdown Presentation Ecosystem). Write slides in Markdown and export to HTML, PDF, or PPTX with pre-designed themes, layout options, and consistent styling.

When to Use This Skill

Choose Marp Slide Studio when:

• You want to create presentations using Markdown syntax
• You need to version-control your presentations alongside code
• You want consistent, professional slides without design tools
• You need to export presentations in multiple formats (HTML, PDF, PPTX)
• You want to include code snippets with syntax highlighting in slides

Consider alternatives when:

• You need complex animations or video in slides (use PowerPoint/Keynote)
• You want collaborative real-time editing (use Google Slides)
• You need a drawing or diagramming tool (use a draw framework skill)

Quick Start

Copy
# Install Marp CLI
npm install -g @marp-team/marp-cli

# Install the skill
claude install marp-slide-studio

# Create a presentation
claude "Create a 10-slide Marp presentation about our Q1 product roadmap. Use the default theme with dark slides"

# Convert to PDF
claude "Export my presentation.md as a PDF with 16:9 aspect ratio"

# Design a custom theme
claude "Create a custom Marp theme matching our brand: colors #1E40AF and #F59E0B, Inter font"

Core Concepts

Marp Markdown Syntax

Copy
---
marp: true
theme: default
paginate: true
---

# Slide Title

Content goes here. Standard Markdown works.

---

## Second Slide

- Bullet points
- **Bold text**
- `inline code`

<!-- Speaker notes go here -->

---

![bg right:40%](image.jpg)

## Image Slide

Image fills the right 40% of the slide.
Content stays on the left.

Built-In Themes

Theme	Style	Best For
default	Clean, light background	General presentations
gaia	Bold, colorful headers	Conference talks
uncover	Minimal, typography-focused	Keynote speeches
Custom	Your brand colors and fonts	Company presentations

Slide Layout Directives

Directive	Effect	Example
![bg]	Full background image	
![bg right:50%]	Split layout with image	
![bg left:40%]	Split layout, image on left	
![bg contain]	Fit image without cropping	
![bg blur]	Blurred background	
<!-- _class: lead -->	Center content	Title slides
<!-- _color: white -->	Change text color	Dark background slides

Configuration

Parameter	Type	Default	Description
theme	string	"default"	Theme: default, gaia, uncover, custom
aspect_ratio	string	"16:9"	Ratio: 16:9, 4:3
paginate	boolean	true	Show page numbers
header	string	""	Header text on all slides
footer	string	""	Footer text on all slides
output_format	string	"html"	Export: html, pdf, pptx

Best Practices

1. One idea per slide — Each slide should communicate a single point. If you need more than 6 lines of text, split it into two slides. Audiences read faster than you speak, so less text keeps them listening to you.

2. Use the split layout for impact — The ![bg right:50%] directive creates a professional split layout instantly. Put an image on one side and your key message on the other. This is Marp's most powerful visual tool.

3. Include speaker notes — Add <!-- Your notes here --> to each slide. These appear in presenter mode but not on the projected slides. They keep you on track without cluttering the visible content.

4. Version control your slides — Since Marp uses Markdown, store presentations in Git. Diff changes, collaborate via PRs, and maintain a history of your presentation's evolution.

5. Export to PDF for sharing, HTML for presenting — PDF ensures consistent rendering on any device for sharing. HTML gives you the smoothest presentation experience with transitions and speaker notes.

Common Issues

Images don't render in export — Use absolute paths or URLs for images. Relative paths may break depending on the export format and working directory. For reliable results, place images in the same directory as the Markdown file.

Custom theme not applying — Ensure the theme CSS file is referenced in the Marp configuration. Use --theme ./my-theme.css in the CLI command. The theme must follow Marp's CSS structure with @import 'default' as a base.

Code blocks are too small — Marp auto-scales content, which can shrink code blocks. Reduce the amount of code per slide (15 lines maximum), increase font size in your theme, or use the <!-- _class: --> directive to adjust specific slides.