Slidev: Themes, Beispiele und der Export nach PowerPoint
Slidev ist das quelloffene, entwicklerorientierte Präsentationstool mit 47,6k GitHub-Sternen – du schreibst Folien in Markdown mit eingebetteten Vue-Komponenten und präsentierst sie im Browser. Hier ist ein ehrlicher Leitfaden: wie Themes und Beispiele funktionieren, wie sich der Export nach PDF und PowerPoint wirklich verhält, wie es sich gegen Marp und reveal.js schlägt und wo ein Agent-Native Design Workspace ins Bild passt.
Wenn du Code schreibst und lieber kein PowerPoint öffnen möchtest, bist du wahrscheinlich schon über Slidev gestolpert. Es bezeichnet sich als „Präsentationsfolien für Entwickler" – und genau das ist es: Du schreibst jede Folie in Markdown, streust dort, wo du sie brauchst, Vue-Komponenten und Codeblöcke ein und präsentierst das Ganze als Webseite – mit Hot Reload, Syntax-Highlighting, Sprechernotizen und interaktiven Einbettungen von Haus aus. Mit 47,6k Stars auf GitHub und einer MIT-Lizenz ist es eine der Standardantworten auf die Frage „Wie mache ich aus Markdown eine gut aussehende Präsentation?"
Dieser Leitfaden ist eine ehrliche Landkarte davon. Was Slidev tatsächlich ist, wie Themes und Beispiele zusammenpassen, wie sich der Export nach PDF und PowerPoint wirklich verhält (es gibt einen Haken), wie es sich gegen die anderen Open-Source-Kandidaten schlägt und – der Teil, den die meisten Artikel auslassen – wo ein solches Werkzeug aufhört, das richtige zu sein, und etwas anderes übernimmt. Wenn du deine Optionen für einen KI- und agentengestützten Präsentations-Workflow abwägst, hilft es, genau zu wissen, was Slidev ist und was nicht.
Was Slidev ist
Slidev läuft im Browser und behandelt deine Präsentation als Projekt, nicht als Dokument. Du schreibst die Folien in einer einzigen Markdown-Datei und trennst sie mit ---, und das Entwicklerwerkzeug ist der Kern: Hot Reload beim Tippen, erstklassiges Code-Highlighting mit Zeilenfokus, LaTeX und Diagramme, ein Sprechermodus mit Notizen und ein Dev-Server, den du aus deinem Terminal startest. Wo reines Markdown an seine Grenzen stößt, bettest du Vue-Komponenten direkt in eine Folie ein – so kann ein Diagramm, ein Live-Zähler oder dein eigenes interaktives Widget inline neben deinen Stichpunkten stehen. Weil die Ausgabe eine Web-App ist, kann alles, was das Web kann, auf einer Folie leben.
Der Kompromiss steckt direkt in der Positionierung: Dies ist ein Entwicklerwerkzeug, keine grafische Oberfläche. Dein Workflow ist ein Code-Editor und ein Dev-Server, keine Leinwand mit Ziehpunkten – genau deshalb greifen Entwickler, die Markdown und Web-Komponenten ohnehin mögen, danach, und genau deshalb prallt ein Nicht-Programmierer daran ab. Es ist außerdem wirklich kostenlos: kein Konto, kein Wasserzeichen, keine Exportgrenze, keine Bezahlung pro Platz. Das Markdown und das Projekt drumherum gehören dir.
Themes & Beispiele
Bei den meisten Suchen rund um Slidev geht es eigentlich darum, es gut aussehen zu lassen, ohne jede Folie von Grund auf zu gestalten – hier also, wie die Teile zusammenpassen.
Slidev-Themes sind der eingebaute Ausgangspunkt und eine echte Stärke. Du setzt ein Theme mit einer einzigen Zeile in deinem Frontmatter (zum Beispiel theme: seriph), und Slidev zieht es herein. Es gibt eine offizielle Theme-Galerie plus eine solide Auswahl an Community-Themes, die als npm-Pakete veröffentlicht sind – von cleanen redaktionellen Looks bis zu dunklen Entwicklerkonferenz-Stilen. Weil ein Theme Code ist, bedeutet ein „eigenes Slidev-Theme", ein Theme-Paket mit deinen eigenen Layouts, Schriften und Farben zu erstellen oder zu forken – aufwendiger als das Austauschen eines Stylesheets, aber vollständig versionierbar.
Slidev-Beispiele leben in der Dokumentation und der Community, nicht in einer einzigen Ausfüll-Galerie. Die offizielle Seite (sli.dev) ist selbst mit Slidev gebaut, das Repository liefert Starter-Präsentationen, und GitHub ist voll von echten Konferenzvorträgen, deren Quelltext du lesen und klonen kannst. Wenn du nach „slidev examples" suchst, sind die aussagekräftigsten die offiziellen Demos und der Doku-Quelltext – sie zeigen nahezu jede Funktion im Einsatz. Der Haken für Einsteiger ist derselbe wie bei jedem code-first-Werkzeug: Ein „Beispiel" ist hier ein Repository zum Klonen und Bearbeiten, keine Vorlage, die du über eine Oberfläche ausfüllst.
Slidev nach PowerPoint & PDF exportieren
Der PDF-Export ist eine erstklassige, unterstützte Funktion und funktioniert gut. Slidev hat einen eingebauten Befehl slidev export (auf Basis von Playwright), der jede Folie in ein sauberes PDF mit einer Seite pro Folie rendert – der unterstützte Weg, und das PDF sieht genau aus wie deine Präsentation. Auf dieselbe Weise kannst du auch als PNG-Bilder exportieren.
Beim Export von Slidev nach PowerPoint müssen die Erwartungen jedoch gesteuert werden. Slidev kann eine .pptx erzeugen, aber das Ergebnis ist verlustbehaftet: Jede Folie kommt in PowerPoint als flaches Bild an, nicht als bearbeitbare Textfelder, Formen und Layouts. Wenn also jemand nachgelagert deine Präsentation in PowerPoint öffnen und bearbeiten muss – eine Überschrift neu tippen, ein Diagramm umgestalten, einen Stichpunkt umfließen lassen – dann gibt ihm die Slidev-.pptx das nicht. Slidev ist dafür gebaut, aus dem Browser präsentiert zu werden, und seine bearbeitbare Quelle ist Markdown plus Vue, nicht .pptx. Das vorher zu wissen erspart dir eine schmerzhafte Überraschung an dem Tag, an dem eine Kollegin nach „der bearbeitbaren PowerPoint" fragt.
Slidev vs. Marp vs. reveal.js
Slidev ist nicht die einzige Möglichkeit, Folien als Code zu schreiben. Die beiden nächstliegenden Open-Source-Optionen – die, die Leute mit „Slidev-Alternative" meinen – sind reveal.js und Marp, und es lohnt sich ehrlich festzuhalten, dass Open Design in einer ganz anderen Ebene sitzt, statt frontal zu konkurrieren.
| Werkzeug | Erstellung | Bearbeitbare .pptx | Vorlagen | Lizenz |
|---|---|---|---|---|
| Slidev | Markdown + Vue | Nein (PPTX/PDF als Bilder) | Vue-Komponenten + Themes | MIT |
| reveal.js | HTML oder Markdown | Nein (PDF→PPTX als verlustbehaftete Bilder) | Themes = CSS/Sass; Community-Vorlagen | MIT |
| Marp | Nur Markdown | Nein (PDF/PPTX als Bilder) | Markdown-Themes (CSS) | MIT |
| Open Design | Beschreibe es deinem Agenten | Ja – bearbeitbare Ausgabe gegen ein Design-System | Eigene Präsentationsvorlagen | Apache-2.0 |
reveal.js ist der ältere, rohere Bruder: Du erstellst in HTML (oder Markdown) und verdrahtest Übergänge mit Data-Attributen, tauschst also Slidevs Markdown-Ergonomie gegen tieferliegende HTML-Kontrolle. Wenn du maximale Freiheit willst und das Schreiben von Markup nicht scheust, ist reveal.js die naheliegende Wahl. Marp geht in die andere Richtung – nur Markdown, bewusst minimalistisch, keine Komponenten – was es zum schnellsten Weg macht, wenn deine Folien überwiegend Text sind und du nie an ein Framework denken willst. Slidev sitzt in der Mitte: Markdown-first für Tempo, mit Vue-Komponenten auf Abruf, wenn eine Folie mehr leisten muss.
Alle drei sind code-first-Werkzeuge mit derselben Grundform: Du schreibst die Präsentation, du präsentierst im Browser, und eine bearbeitbare PowerPoint-Ausgabe ist nicht wirklich das Ziel. Die Wahl zwischen ihnen dreht sich vor allem darum, welche Erstellungsoberfläche du willst – Markdown plus Vue, rohes HTML oder reines Markdown – und nicht um Fähigkeiten, die die eine hat und die anderen nicht.
Wo Open Design hineinpasst
Hier ist die ehrliche Grenze. Slidev verlangt von dir, die Präsentation zu schreiben – jede Folie, in Markdown und Vue. Das ist ein Vorteil, wenn du handgeschriebene, versionierte Folien mit Live-Komponenten willst, und nichts hier ersetzt das, wenn das dein Ziel ist.
Open Design ist eine andere Ebene, und es ist ein Produkt, das wir machen – lies das also mit diesem Hinweis im Kopf. Es ist ein quelloffenes (Apache-2.0), lokal-orientiertes Agent-Native Design Workspace mit Bring-your-own-Key, das außerhalb des Coding-Agenten sitzt, den du ohnehin schon nutzt – Claude Code, Codex oder Cursor. Statt Markdown und Komponenten von Hand zu schreiben, beschreibst du die gewünschte Präsentation, und der Agent generiert eine bearbeitbare gegen ein Design-System, sodass sie markenkonform herauskommt und bearbeitbar bleibt, statt als gerendertes Artefakt einzufrieren. Open Design liefert außerdem eigene Präsentationsvorlagen, mit denen du starten kannst.
Es ist kein Ersatz für Slidev, wenn du Folien als Code mit Vue-Komponenten und voller Kontrolle schreiben willst – das ist Slidevs Heimspiel, und es ist darin hervorragend. Open Design ist für den Fall, dass du einem Agenten lieber ein Briefing gibst, als Markup zu schreiben, dass die Ausgabe über viele Präsentationen hinweg zu einem Design-System passen soll und dass du am Ende bearbeitbare Dateien willst, die dir gehören. Greif zu Slidev, wenn die Präsentation das Markdown ist, das du schreibst; greif zu einem Workspace, wenn die Präsentation eine von vielen markenkonformen Ausgaben ist, die ein Agent für dich erzeugt.
FAQ
Ist Slidev kostenlos? Ja. Slidev ist Open Source unter der MIT-Lizenz – frei auch kommerziell nutzbar, ohne Konto, ohne Wasserzeichen und ohne Exportgrenzen. Du betreibst es selbst aus deinem eigenen Projekt.
Wie nutze ich Slidev-Themes? Setze ein Theme im Frontmatter deiner Folie (zum Beispiel theme: seriph), und Slidev installiert und wendet es an. Es gibt eine offizielle Galerie plus Community-Themes auf npm. Ein eigenes Theme bedeutet, ein Theme-Paket mit deinen eigenen Layouts, Schriften und Farben zu erstellen oder zu forken – es ist Code, kein Stylesheet, das du austauschst.
Kann ich Slidev nach PowerPoint exportieren? Slidev kann nach .pptx exportieren, aber verlustbehaftet – jede Folie landet als flaches Bild, nicht als bearbeitbarer Text und Formen. Der PDF- und PNG-Export (über slidev export) ist der saubere, erstklassige Weg. Wenn du eine bearbeitbare PowerPoint brauchst, ist Slidev nicht die richtige Quelle.
Slidev vs. Marp vs. reveal.js – was soll ich nehmen? Alle drei sind Open Source, code-first und MIT-lizenziert. Nimm Slidev für Markdown plus Vue-Komponenten (großartig, wenn Folien interaktiv sein müssen), reveal.js für rohe HTML-Kontrolle und Marp für die einfachsten Markdown-only-Präsentationen. Keines zielt auf eine bearbeitbare PowerPoint-Ausgabe.
Muss ich programmieren können, um Slidev zu nutzen? Faktisch ja. Slidev ist ein Entwicklerwerkzeug – du arbeitest in einem Texteditor und einem Terminal mit Markdown, Vue und einem Dev-Server, nicht in einer Drag-and-drop-Oberfläche. Wenn du eine Präsentation lieber in einfacher Sprache beschreibst, ist genau das die Lücke, die ein agent-natives Workspace wie Open Design füllt.
Das Fazit
Slidev verdient seine 47,6k Stars: Es ist eine kostenlose, MIT-lizenzierte, entwicklerorientierte Art, aus Markdown gut aussehende Präsentationen zu bauen – mit echten Themes, Hot Reload, lebenden Vue-Komponenten und sauberem PDF-Export. Geh nur mit offenen Augen hinein – es ist ein Werkzeug, in dem du schreibst, keine App, durch die du klickst, und „Export in eine bearbeitbare PowerPoint" ist nichts, was es gut kann. Wenn du Präsentationen als Code erstellen willst, ist Slidev (oder reveal.js / Marp) ein großartiges Zuhause. Wenn du lieber eine Präsentation beschreibst und deinen Agenten eine bearbeitbare, markenkonforme erstellen lässt, die dir gehört, dann übernimmt genau dort ein Agent-Native Design Workspace.