ClawHub

Slidev Maker

Other

Use this skill when creating, editing, or exporting Slidev presentations — the Markdown + Vue web-based slide framework for developers. Covers installation and CLI commands, slide syntax and frontmatter, layouts, click animations and transitions, code highlighting (Shiki/Monaco/Magic Move), built-in components, diagrams (Mermaid/PlantUML), images/video/fonts, UnoCSS styling, LaTeX, themes, presenter mode, and exporting to PDF/PPTX/PNG. Prevents common mistakes like incorrect asset paths, deprecated features (Prism), and non-existent layouts.

Install

openclaw skills install slidev-maker

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