[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-1739":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":9,"language":9,"languages":9,"totalLinesOfCode":9,"stars":10,"forks":11,"watchers":12,"openIssues":13,"contributorsCount":14,"subscribersCount":14,"size":14,"stars1d":15,"stars7d":16,"stars30d":17,"stars90d":14,"forks30d":14,"starsTrendScore":18,"compositeScore":19,"rankGlobal":9,"rankLanguage":9,"license":9,"archived":20,"fork":20,"defaultBranch":21,"hasWiki":22,"hasPages":20,"topics":23,"createdAt":9,"pushedAt":9,"updatedAt":24,"readmeContent":25,"aiSummary":26,"trendingCount":14,"starSnapshotCount":14,"syncStatus":27,"lastSyncTime":28,"discoverSource":29},1739,"marp-slides","robonuggets\u002Fmarp-slides","robonuggets","MARP presentation skill for Claude Code — 22 curated example decks, SVG charts, dark\u002Flight themes, dashboard components",null,231,53,168,1,0,6,13,61,18,5.2,false,"master",true,[],"2026-06-12 02:00:32","# MARP Slides\n\nA Claude Code skill for creating beautiful presentations using [MARP](https:\u002F\u002Fmarp.app) — SVG charts, dashboard components, dark\u002Flight themes, and 22 curated example decks to learn from.\n\n## What it does\n\nGive Claude Code a topic and it builds a polished MARP deck. The skill teaches it how to compose slides using SVG charts, metric cards, gauges, sparklines, progress bars, expandable sections, and more — all in raw HTML inside Markdown.\n\nThe 22 example decks are the secret sauce. Instead of just knowing the building blocks, Claude reads real decks that look good and matches that quality bar.\n\n## Quick start\n\n### 1. Install the skill\n\n```bash\ngit clone https:\u002F\u002Fgithub.com\u002Frobonuggets\u002Fmarp-slides\n```\n\n### 2. Add it to Claude Code\n\nPoint Claude Code at the skill folder:\n\n```bash\nclaude --add-dir .\u002Fmarp-slides\n```\n\nOr add it manually to your project's `.claude\u002Fskills\u002F` directory.\n\n### 3. Install the VS Code extension\n\nInstall **Marp for VS Code** and enable these settings:\n\n```json\n{\n  \"markdown.marp.enableHtml\": true,\n  \"markdown.marp.allowLocalFiles\": true\n}\n```\n\n### 4. Ask for a presentation\n\n```\nCreate a MARP presentation reviewing my Q1 sales data. Dark theme, include stat cards and a bar chart.\n```\n\n```\nMake me a deck about my favorite coffee brewing methods. Editorial style, warm tones.\n```\n\n```\nBuild a fitness dashboard presentation from this CSV data.\n```\n\n## What's included\n\n```\nmarp-slides\u002F\n├── SKILL.md              # The skill — rules, components, design system\n└── examples\u002F             # 22 curated reference decks\n    ├── marp_facebook-ads.md    # Data dashboard with SVG charts\n    ├── marp_coffee.md          # Editorial lifestyle deck\n    ├── marp_fitness.md         # Health tracking dashboard\n    ├── marp_wine-tasting.md    # Tasting notes with ratings\n    ├── marp_travel.md          # Travel guide with maps\n    ├── marp_kids-party.md      # Fun creative deck\n    └── ... 16 more examples\n```\n\n## Example categories\n\n| Category | Examples | Style |\n|---|---|---|\n| Data \u002F dashboard | facebook-ads, fitness, comparison | SVG charts, stat cards, gauges |\n| Lifestyle \u002F editorial | coffee, wine-tasting, cocktail | Warm tones, photography, ratings |\n| Guide \u002F how-to | garden, houseplant, home-gym | Step-by-step, tips, checklists |\n| Fun \u002F creative | kids-party, board-game, film-director | Playful, colorful, interactive |\n| Travel \u002F location | travel, walking-tour, road-trip | Maps, itineraries, photo backgrounds |\n| Showcase | hero, apartment, wardrobe | Visual-first, minimal text |\n\n## Features\n\n- **Dark and light themes** with tested font pairings (Outfit + Raleway, DM Serif + DM Sans, Space Grotesk + IBM Plex Mono, and more)\n- **SVG charts** — line\u002Farea, donut\u002Fpie, gauges, sparklines, bar charts, radar\n- **Dashboard components** — metric cards with gradient borders, status dots, verdict tags, hover rows\n- **Interactive elements** — collapsible `\u003Cdetails>` sections, tooltips, progress bars\n- **Layout components** — before\u002Fafter splits, terminal mockups, chat bubbles, timelines, flowcharts\n- **SVG icon library** — 16+ inline icons (dollar, heartbeat, check, arrow, lightning, etc.)\n\n## Export\n\n```bash\n# PDF\nnpx @marp-team\u002Fmarp-cli slides.md --pdf --allow-local-files\n\n# PowerPoint\nnpx @marp-team\u002Fmarp-cli slides.md --pptx --allow-local-files\n\n# HTML (keeps animations and interactive elements)\nnpx @marp-team\u002Fmarp-cli slides.md --html --allow-local-files\n```\n\n## How the examples help\n\nThe skill file (SKILL.md) teaches the building blocks — CSS variables, chart math, icon paths. But the examples teach **composition** — how to combine those blocks into slides that actually look good. When Claude reads the examples before generating, it matches the spacing, density, and visual rhythm of a real polished deck instead of just stacking components.\n\n## License\n\nMIT\n","MARP Slides 是一个用于创建精美演示文稿的 Claude Code 技能，支持 SVG 图表、仪表板组件、深色\u002F浅色主题，并提供22个精选示例模板供参考。该项目的核心功能包括通过 Markdown 中嵌入的原始 HTML 来构建包含各种图表和交互元素（如可折叠部分、进度条等）的幻灯片。技术特点涵盖多种视觉风格的主题设计、丰富的 SVG 图表类型以及多种布局组件。适用于需要快速生成高质量报告或展示材料的场景，无论是数据分析、生活方式分享还是旅行指南等，都能找到合适的模板来匹配内容需求。",2,"2026-06-11 02:45:44","CREATED_QUERY"]