Slidev Maker

Domain knowledge for building Slidev presentations. Slidev turns Markdown into interactive, themeable slides using Vue 3, Vite, and UnoCSS.

Use this skill whenever you are scaffolding a deck, writing slide Markdown, adding interactivity, customizing themes/layouts, or exporting. Read the relevant rules/ file below for detailed explanations and copy-pasteable examples before generating Slidev code.

Quick Start

pnpm create slidev      # scaffold a new deck (also: npm init slidev)
slidev                  # dev server with hot reload (http://localhost:3030)
slidev build            # build a static SPA into dist/
slidev export           # export to PDF (also --format pptx|png|md)

Requires Node.js >= 18. Put static assets in public/ and reference them with absolute paths (/image.png). Full setup, project structure, and workflows are in rules/getting-started.md.

Rules

Read rules/anti-patterns.md first — it lists the critical, recurring mistakes that break decks.

Authoring:

• rules/core-syntax.md — slide separators, headmatter vs per-slide frontmatter, speaker notes, MDC syntax
• rules/layouts.md — built-in layouts, two-column slots, image/iframe layouts, custom layouts
• rules/code-blocks.md — Shiki highlighting, line highlighting, Monaco editor, Magic Move, TwoSlash
• rules/animations.md — v-click, v-after, v-clicks, v-motion, v-mark, slide transitions
• rules/components.md — built-in components: Arrow, Link, Toc, SlidevVideo, RenderWhen, LightOrDark, and more
• rules/diagrams.md — Mermaid and PlantUML integration and configuration
• rules/assets.md — images, video, fonts, icons — correct paths and the public folder
• rules/styling.md — UnoCSS utilities, custom & slide-scoped styles, dark mode, uno/vite config
• rules/features.md — LaTeX math, importing slides (src:), global layers, custom shortcuts

Setup & output:

• rules/getting-started.md — installation, CLI commands, project structure, workflows, tech stack
• rules/themes.md — using, configuring, overriding, and ejecting themes
• rules/export.md — PDF/PNG/PPTX export, SPA builds, and deployment (GitHub Pages, Netlify, Vercel)
• rules/presenter.md — presenter mode, speaker notes, timer, drawing, recording, remote control

Guidance:

• rules/anti-patterns.md — critical mistakes to avoid: deprecated features, wrong paths, non-existent layouts
• rules/troubleshooting.md — build/export/port/theme fixes plus authoring best practices

Official Links

• Docs: https://sli.dev/guide · Themes: https://sli.dev/resources/theme-gallery · GitHub: https://github.com/slidevjs/slidev