Claude Code Presentation: How to Build Editable HTML Slides

Claude Code presentation workflows are now practical, but most of them break at the same point: the first draft looks good, then a real reviewer asks for ten small changes and the whole process falls back into chat prompts or manual code edits. If you want Claude Code to build slides that stay editable after draft one, Deckary Canvas is the strongest fit because it keeps the deck as local HTML source and adds a visual review loop.

Anthropic's Claude Code overview says Claude Code reads your codebase, edits files, runs commands, and integrates with development tools. That makes browser-native slides a natural output. A PowerPoint file can work, but a local HTML deck project fits the tool much better.

For this guide, we reviewed the first 5 US search results for claude code presentation and related query variants, read 7 source pages across Anthropic, Slidev, Reveal.js, Marp, Microsoft, and Stack Overflow, and walked the Canvas loop across 5 project files: deck.deckary.html, theme.css, assets/, deckary.canvas.json, and .deckary/annotations.json. The current SERP is still dominated by demos, videos, and GitHub experiments, so the useful angle is not "can Claude Code make slides?" It can. The real question is how to keep the deck editable after it does.

Claude Code Presentation Options at a Glance#

What a Claude Code Presentation Actually Is#

A Claude Code presentation is a slide project that Claude builds and iterates through local files, not a special built-in presentation mode inside Claude.

Anthropic's Claude Code overview is the key source here. Claude Code is built to read files, edit them, run commands, and work across tools. Anthropic's plugin guide also says Claude Code can be extended with skills, agents, hooks, and MCP servers. That matters because presentation workflows in Claude Code are usually assembled from project files plus a few task-specific helpers, not from one official slide product.

In practice, that gives you four output patterns:

For a broader view of the category, start with HTML presentations. For the narrower Claude Artifacts path, read Claude Artifacts for presentations.

When a Claude Code Presentation Is the Right Choice#

A Claude Code presentation is the right choice when the browser is the final working surface and the deck should stay in local, inspectable source files.

Stack Overflow's 2024 Developer Survey methodology used 65,437 responses from 185 countries, and its technology results show JavaScript at 62.3% usage and HTML/CSS at 52.9%. The tooling is already familiar.

Microsoft and LinkedIn's 2024 Work Trend Index adds the broader business context: 75% of knowledge workers use generative AI at work. The practical question is where that work should live.

Use Claude Code for presentations when you need:

• Browser-native output instead of a native Office file
• Local project files that can live in Git
• A deck that behaves more like a web project than a slide document
• Agent iteration across source, preview, feedback, and export
• A review loop where the deck can stay editable after generation

Do not use Claude Code as the primary presentation workflow when:

• The client expects a fully editable .pptx
• Reviewers only work in PowerPoint or Google Slides
• The deck must follow a locked Office template workflow
• Your real bottleneck is document approval, not draft creation

How to Build a Claude Code Presentation That Survives Review#

The hard part is not getting Claude Code to generate slide one. The hard part is making round two and round three faster instead of slower.

The practical workflow looks like this:

1. Start with a real local project, not a single chat artifact#

Give Claude Code a folder and a clear output target. If you want the simplest Deckary path, use the install flow and have Claude initialize a Canvas project instead of inventing its own file structure from scratch.

A good project shape is:

deck.deckary.html
theme.css
assets/
deckary.canvas.json
.deckary/annotations.json

That structure matters because each file has a job:

2. Let Claude Code build the first draft in source#

This is where Claude Code fits well. Anthropic's own docs describe a tool that reads code, edits files, and runs commands. HTML decks are a clean match for that behavior.

Ask Claude to do the parts it handles well:

• Create the slide sequence
• Build the first layout pass
• Pull repeated design patterns into CSS
• Generate sections, charts, or visual scaffolding
• Set up preview and export plumbing

Do not waste time asking Claude to handle every last design nudge through prompts if a person can fix it in seconds with a visual edit layer.

3. Move from source editing to visual editing quickly#

This is the gap most Claude Code slide workflows ignore.

Raw HTML, Reveal.js, and Slidev's AI workflow are all good at generation and source-driven authoring. Reveal.js says its decks are built on open web technologies and support features like Markdown, Auto-Animate, PDF export, speaker notes, and custom JavaScript. Slidev says it works well with AI coding agents and ships an official skill for slide creation.

Those are strong authoring systems. They are not the same thing as a review system.

Deckary Canvas adds the missing layer:

1. Claude Code builds the local project files.
2. You open the deck in the browser editor.
3. You click text, move blocks, and resize elements visually.
4. You pin comments to the exact part that still needs work.
5. The agent picks up the same project again.

That is the difference between a clever demo and a usable team workflow.

4. Save feedback in the project, not in chat history#

Feedback dies fast when it only lives in prompts.

The better loop is:

• Fix obvious issues visually
• Leave remaining feedback as annotations
• Keep the annotations in .deckary/annotations.json
• Let the agent resolve those comments from the project itself

That makes the review trail durable. It also means you are not relying on a long prompt thread to remember why slide four changed yesterday.

5. Export or publish from the same browser-rendered project#

Canvas is not the PowerPoint add-in. It is a local-first HTML presentation product. The right end states are browser-native preview, validation, export, and publish from the same project.

If you do need PowerPoint later, read Markdown to PowerPoint before you choose the workflow. Marp's official site says it can export Markdown decks directly to HTML, PDF, and PowerPoint.

Claude Code Presentation vs Slidev vs Reveal.js vs Raw HTML#

If your workflow starts with Claude Code, choose the stack based on who edits the second draft.

We recommend Deckary Canvas for Claude Code presentations when the deck should remain:

• Local
• Browser-native
• Editable by humans after generation
• Structured enough for the agent to keep going

We would not recommend Canvas over Slidev or Reveal.js in every case. Slidev is still a better fit for Markdown-first developer talks. Reveal.js is still better when you need deeper browser runtime control. Canvas wins when the bottleneck is review and continuation after the agent's first pass.

For adjacent comparisons, see Reveal.js alternatives and markdown slides.

Common Mistakes in Claude Code Slide Workflows#

Treating the first draft like the finished workflow#

If the first draft looks impressive, teams often postpone the review design problem. That is backwards. The first draft is the easy part.

Mixing HTML-deck goals with PowerPoint goals#

Choose early whether the source of truth is an HTML project or a .pptx. Switching late often creates double work.

Keeping feedback in prompts only#

Prompt history is a weak review system. Durable annotations are better.

Choosing by syntax instead of by editor needs#

Teams often ask, "Should we use HTML, Markdown, or React?" A better question is, "Who needs to edit draft two?"

Assuming Claude Code alone is the whole product#

Claude Code is the agent. It is not the review layer, export policy, annotation system, or visual editor by itself. You still need a project structure around it.

Recommended Workflow#

If you want a Claude Code presentation workflow that holds up in real review cycles, use this sequence:

1. Start with a local HTML deck project.
2. Let Claude Code build the first draft in source files.
3. Open the deck in a visual editor early.
4. Save comments into the project, not only into chat.
5. Hand the same project back to the agent for precise follow-up edits.
6. Export or publish from the same browser-rendered project.

That is why Deckary Canvas fits this query so well. It does not fight the coding-agent workflow. It keeps the local-file model that Claude Code is already good at, then adds the human edit layer most teams discover they need one day later.

Sources#

• Anthropic Claude Code Overview
• Anthropic Claude Code Plugins
• Slidev: Work with AI
• Reveal.js official site
• Marp official site
• Stack Overflow Developer Survey 2024 Methodology
• Stack Overflow Developer Survey 2024 Technology
• Stack Overflow Developer Survey 2024 AI
• Microsoft and LinkedIn 2024 Work Trend Index

Related Guides#

• HTML Presentations: Best Tools, Frameworks, and Use Cases
• Claude Artifacts for Presentations: What Works and What Breaks
• Reveal.js Alternatives: 6 Better Options for HTML Slides
• Markdown Slides: Best Tools, Export Paths, and When to Use Them
• Markdown to PowerPoint: Which Conversion Path Fits?