frontend-slides: 16K Stars for Claude-Powered Slide Creation

Look, I’ve seen plenty of AI presentation tools by now. But slides built using Claude’s “frontend skills”? That’s a genuinely fresh concept. frontend-slides has pulled 16.4K stars, so clearly a lot of people find it intriguing.

What This Actually Does

In short, it lets you write slides the same way you’d write HTML/CSS. No PowerPoint, no Keynote — just code that renders into beautiful presentations. For developers, this basically merges “writing code” and “making decks” into one workflow.

The core idea: you provide a topic or outline, Claude generates frontend code (HTML/CSS/JS), and it renders as polished slides. The whole thing runs in the browser, meaning your deck is essentially a web page.

What Stood Out to Me

Fully code-driven. Unlike traditional tools where you drag and drop, every slide here is code. That means version control, code reuse, and team collaboration all become straightforward. Git-managed presentations — sounds nerdy, and it is.

Unlimited styling freedom. Since it’s a web page, anything CSS can do, this can do. Gradient backgrounds, animated transitions, responsive layouts — effects that need plugins in traditional tools take a few lines of CSS here.

Native Claude integration. The project name literally says “frontend,” clearly designed around Claude’s frontend capabilities. You can drop Claude-generated HTML code straight in, tweak it a bit, and you have a complete deck. The pipeline feels smooth.

Browser-native presentation. No software installation needed — just a URL and you’re presenting. Cross-device, cross-platform, works on phones too. For traveling or using borrowed machines, this is huge.

Export support. While the core is web-based, it can export to PDF or images for printing and offline sharing.

Quick Start

The README has detailed instructions. Basic flow:

1. Clone the repo
2. Write your slide structure in Markdown or JSON following the templates
3. Let Claude generate the frontend code
4. Open in browser to preview

git clone https://github.com/zarazhangrui/frontend-slides.git
cd frontend-slides
# Follow docs to prepare your content
# Then let Claude generate the code

Pros and Cons

Pros:

• Developer-friendly, code-as-slides approach
• Complete styling control, CSS is your ceiling
• Runs natively in browser, zero installation
• Easy version control and collaboration
• Smooth Claude integration

Cons:

• Extremely unfriendly to non-programmers, high barrier to entry
• No WYSIWYG editor, changing a slide means changing code
• Layout requires frontend knowledge, beginners will struggle
• Animations need to be coded, not point-and-click
• High star count but update frequency is mediocre (last updated April 2026)

Comparison

Tool	Learning Curve	Visual Ceiling	Collaboration	Cross-platform	Price
frontend-slides	High	Very High	Git	✅	Free
PowerPoint	Low	Medium	Office 365	✅	Paid
Keynote	Low	High	iCloud	Apple only	Free
Google Slides	Low	Medium	Real-time	✅	Free
Reveal.js	Medium	High	Git	✅	Free

It’s similar to Reveal.js but adds an “AI generation” layer. If you’re already using Reveal.js, this tool could speed up your content creation workflow.

Who Should Use It

Two types of people mainly:

1. Tech nerds — hate dragging mice, just want to code their way through everything
2. Heavy AI users — already using Claude for coding and docs, want it to handle decks too

Honestly, while I think the concept is cool, for an important business presentation I’d probably still reach for Keynote first. Aesthetics through code takes more brainpower than handing it to a designer.

---

About the Author

Liudingyu is a full-stack developer and heavy GitHub user. With 900+ starred repos over the past 3 years, this site only covers tools I’ve actually used or deeply researched.

📧 Found a great tool to recommend? Email [email protected]