Aller au guide d’utilisation
md-slidespar Alireza Rezvani

MD Slides Skill.

Un skill Claude Code et Codex pour PPT et présentations : convertit un deck Markdown en slides brandées.

  • Presentations
  • Slides HTML
alirezarezvani/claude-skills · markdown-html/skills/md-slides/SKILL.mdSKILL.md
--- name: md-slides description: Converts a markdown deck (slides separated by `---` HR boundaries or by `# ` H1 headings, with optional `<!-- notes: ... -->` presenter notes blocks) into a single-file HTML presentation with arrow-key / space / PgDn / PgUp / Home / End / P / Esc keyboard navigation, presenter mode (split view with current slide + speaker notes + clock + next-slide preview), URL-hash deep linking, and `@media print` page-per-slide … --- ## When to invoke ## Pipeline ## What ships in the HTML ## Hard rules ## Forcing-question library (Matt Pocock grill discipline) ## Distinct from
En-tête et titres de section lus depuis le fichier source le 14/09/2026 · 6 506 caractères au total

01 Ce qu'il fait

Ce que fait le Skill md-slides dans Claude Code et Codex

Résumé, workflow et sorties, tous lus dans le SKILL.md du skill.

D'après le SKILL.mdLu le 14-09-2026 · pas une exécution enregistrée

Dans les termes du Skill

md-slides convertit un deck markdown en une présentation HTML monofichier qui s'exécute dans n'importe quel navigateur. Un deck est constitué de diapositives séparées par des frontières HR --- ou des titres H1, avec des blocs optionnels de notes de présentateur <!-- notes: ... -->. Un pipeline de trois scripts Python stdlib : slide_splitter.py, presenter_notes_parser.py, deck_html_renderer.py.

Le résultat intègre une navigation au clavier, un lien profond via hash d'URL, une barre de progression et un compteur de diapositives, un mode présentateur avec horloge et aperçu de la diapositive suivante, ainsi qu'une feuille de style d'impression pour l'export PDF à une diapositive par page. Il réutilise l'analyseur markdown de md-document et lit les tokens du design system via config_loader.py. Il refuse les entrées sans frontières de diapositives claires, les decks d'une seule diapositive, les fichiers de moins de 100 lignes et les decks échouant à la couverture de 50 % en --strict-notes.

Ce qu'il produit

  • Le deck HTML généré, écrit sous forme de deck-{slug}.html dans le répertoire de sortie par défaut résolu, avec -2, -3, etc. ajoutés en cas de collision.
  • Fichiers JSON intermédiaires contenant les diapositives découpées puis les diapositives avec leurs notes associées.
  • Un PDF avec une diapositive par page, produit via la feuille de style d'impression en imprimant depuis le navigateur.
Voir l'exemple de prompt ↗

Fonctionnement

  1. 01
    Découper le Deck en Diapositives Ordonnées

    slide_splitter.py lit le markdown source et le découpe sur les lignes HR --- ou les titres H1, en détectant automatiquement le style de frontière par défaut, puis écrit une liste ordonnée de diapositives.

  2. 02
    Associer les Notes de Présentateur à Chaque Diapositive

    presenter_notes_parser.py analyse chaque diapositive à la recherche de blocs de notes et les associe à cette diapositive afin que le mode présentateur ait quelque chose à afficher sur le panneau de droite.

  3. 03
    Rendre le Deck HTML Monofichier

    deck_html_renderer.py combine les diapositives avec les tokens du design system et génère le deck, en prenant un titre et un chemin de sortie en ligne de commande.

  4. 04
    Appliquer les Tokens du Design System

    Douze propriétés CSS personnalisées de marque proviennent du design system, et design_style modifie la densité des mises en page des diapositives.

  5. 05
    Refuser les entrées qui ne sont pas des présentations

    Le skill s'arrête plutôt que de convertir lorsque l'entrée n'a pas de limites de diapositives claires, produirait une seule diapositive, ou échoue le contrôle de couverture des notes sous --strict-notes.

02 Trouvez celui qui vous convient

Quand utiliser le skill md-slides

Utilisez le skill md-slides dans Claude Code ou Codex lorsque la tâche concerne les présentations PPT et diaporamas de ce type. L'ajustement et les limites ci-dessous proviennent du fichier propre au skill.

Bon choix

  • Un orchestrateur a classé l'entrée comme SLIDES et l'a acheminée ici.
  • Quelqu'un invoque le skill directement sur un fichier markdown avec la commande slash.
  • Le markdown comporte déjà 3 lignes --- HR ou plus, ou 5 titres H1 ou plus avec des corps courts.
  • La présentation sera projetée en direct, ce qui est précisément le contexte où les notes du présentateur importent, alors qu'une lecture autonome les rend facultatives.

Connaître les limites

  • L'entrée est une spécification longue plutôt qu'une présentation ; cela devrait aller vers md-document.
  • L'entrée est une revue de code, qui relève de md-review.
  • Ce n'est pas un outil de design graphique : Keynote et PowerPoint occupent cet espace, tandis que celui-ci traite les présentations rédigées en markdown et projetées depuis un navigateur.

Quoi fournir

  • Le fichier de présentation markdownSon chemin est transmis à slide_splitter.py avec --input, et le résultat de la découpe est écrit dans un fichier JSON avec --output.
  • Style de limiteLes diapositives doivent être distinguables, soit par des limites --- HR, soit par des titres H1, afin que le splitter ait un critère de découpe.
  • Notes de présentateur facultativesLes notes sont fournies sous forme de blocs de commentaires HTML à l'intérieur des diapositives, puis sont analysées et attachées à chaque diapositive par la deuxième étape du pipeline.

03 Dans le skill

Règles que le skill md-slides Donne à Claude Code et Codex

8 instructions concrètes, valeurs par défaut et limites que le SKILL.md fixe pour l'agent — la partie du fichier qui change le résultat.

  1. Exigence de Limite

    Le mode automatique nécessite au moins 3 lignes HR ou au moins 5 titres H1 dans la source ; si aucun des deux n'est présent, le skill refuse et l'entrée doit plutôt aller vers md-document.

  2. Pas de Sortie à Diapositive Unique

    Une présentation qui se réduit à une seule diapositive est rejetée comme une affiche, pas comme une présentation, avec le code de sortie 5.

  3. Minimum 100 Lignes Source

    Les entrées de moins de 100 lignes sont refusées, en appliquant le même seuil Shihipar utilisé dans tous les convertisseurs.

  4. Verrou d'Onboarding

    Le skill refuse de s'exécuter sans onboarding, le même verrou utilisé par tous les convertisseurs.

  5. Couverture Stricte des Notes

    Avec --strict-notes, le skill refuse une présentation où moins de 50 % des diapositives comportent des notes, car il n'est pas configuré pour le mode présentateur ; ce refus se termine avec le code de sortie 7.

  6. Avertir en Cas de Diapositives Trop Longues

    Les diaporamas de plus de 40 lignes source déclenchent un avertissement doux sur le rapport signal/bruit ; le deck s'affiche quand même, mais le nombre est signalé.

  7. Conserver une sortie en fichier unique

    Tout le CSS et le JS sont intégrés en ligne ; la seule ressource externe est le CSS Google Fonts, et Prism.js est activable via --syntax plutôt que fourni par défaut.

  8. Aucun runtime de framework

    Le deck utilise uniquement du JS vanilla et des gestionnaires d'événements clavier, sans runtime React, Vue ou Svelte.

04 Mettez-le en pratique

Installer md-slides dans Claude Code ou Codex

Une commande npx skills add, puis une première tâche dans votre agent et une checklist pour le résultat.

Ajouter md-slides à Claude Code, Codex ou votre agent

Exécutez-la dans votre projet ; l'installateur demande à quel agent l'ajouter.

Terminal
npx skills add https://github.com/alirezarezvani/claude-skills --skill md-slides

Forme générique de la CLI skills pour markdown-html/skills/md-slides/SKILL.md ; le dépôt peut documenter son propre chemin.

Donner à la skill une première tâche PPT et diaporamas

Rédigé dans les termes propres du skill ; remplacez les parties entre crochets par votre contenu.

Starter prompt
Convert [deck.md] into a presentation. It uses --- HR boundaries for slides and each slide has a <!-- notes: ... --> block. Title it "[Talk title]" and run it with --strict-notes, since it will be presented live rather than read on its own. Write the result to [output/deck.html].

Source : rédigé à partir du SKILL.md, dans les termes propres du skill.

Vérifiez le premier résultat

Ce que le SKILL.md lui-même présente comme un résultat correct :

  • Ouvrez le deck dans un navigateur et testez les touches : les flèches, Espace et PgDn avancent, PgUp recule, Home et End sautent, P active le mode présentateur, Échap le quitte.
  • Testez le lien profond : #3 doit sauter à la diapositive 3, les boutons précédent et suivant du navigateur doivent parcourir les diapositives, et un deck.html#5 partagé doit s'ouvrir directement sur la diapositive 5.
  • Vérifiez le compteur de diapositives en bas à droite, qui affiche quelque chose comme « 3 / 12 », par rapport à la longueur du deck.
  • Confirmez que la media query reduced-motion est respectée, afin que l'animation soit supprimée pour les spectateurs qui demandent moins de mouvement.

Dans OpenDesign importez md-slides depuis son lien SKILL.md : Plugins → Add → Skill → Import from link, puis sélectionnez-le dans la barre supérieure.

05 Open source, traçable

Source, licence et vérification

D'où proviennent les faits de cette page et quand ils ont été vérifiés pour la dernière fois.

Fichier du skill
markdown-html/skills/md-slides/SKILL.md Somme de contrôle du contenu enregistrée à la vérification ; commit 19392f7
License
MIT D'après LICENSE.
Étoiles du dépôt
25 934 Capture GitHub prise le 14/09/2026 pour l'ensemble du dépôt alirezarezvani/claude-skills, qui contient 5 skills dans ce catalogue. Pas une note ou un compteur d'utilisation pour md-slides.
Vérifié par OpenDesign
2026-09-14 Le fichier source, le chemin, le texte de licence et le nombre d'étoiles ont été vérifiés. Non intégré dans OpenDesign main (vérifié le 2026-08-28) ; aucune exécution en conditions réelles n'a été enregistrée sur cette page.

Dans le SKILL.md

  1. Quand l'invoquerSymptômes de routage, ainsi que les entrées à refuser ou à envoyer ailleurs.
  2. PipelineTrois commandes qui découpent, analysent les notes et rendent le deck.
  3. Ce qui est livré dans le HTMLNavigation, lien profond, mode présentateur, feuille de style d'impression, tokens, réutilisation du parseur.
  4. Règles strictesSeuils de refus, avertissements doux, et contraintes de sortie en fichier unique.
  5. Bibliothèque de questions cadrantes (discipline du grill Matt Pocock)Cinq questions à trancher avant de convertir un fichier source.
  6. Distinct deEn quoi cela diffère de md-document, md-review, des landing pages, Keynote.
  7. Artefact de sortieRésolution du chemin de sortie et convention de suffixe en cas de collision.
  8. RéférencesSources et canon derrière les conventions du deck.
Description du skill lui-même
« Convertit un deck markdown (slides séparées par des limites HR `---` ou par des titres H1 `# `, avec blocs optionnels de notes de présentation `<!-- notes: ... -->`) en une présentation HTML mono-fichier avec navigation clavier flèches / espace / PgDn / PgUp / Home / End / P / Esc, mode présentateur (vue partagée avec slide actuelle + notes du présentateur + horloge + aperçu de la slide suivante), deep linking par hash d'URL, et `@media print` page par slide pour export PDF. Se déclenche quand le markdown-html-orchestrator classifie une entrée comme SLIDES, ou lors d'une invocation directe via /cs:md-slides. Réutilise le parser markdown de md-document pour le rendu du corps de slide et lit les tokens du design-system via config_loader.py. Refuse si l'entrée n'a pas de limites de slide claires, produit un deck d'1 slide, ou si `--strict-notes` est activé avec moins de 50% de couverture de notes. À utiliser après le routage de l'orchestrateur. »

Description front-matter tirée de SKILL.md. Le fichier complet fait environ 6 506 caractères. Lire le fichier complet sur GitHub.

06 Avant d'installer

Questions sur le skill md-slides

Les réponses proviennent du SKILL.md tel que lu le 2026-09-14, et non d'une exécution enregistrée.

Quels agents de code peuvent exécuter ce skill ?

Le fichier liste claude-code, codex-cli, cursor, antigravity, opencode et gemini-cli comme outils compatibles, et il peut aussi être déclenché lorsque le markdown-html-orchestrator classe une entrée comme SLIDES.

Que se passe-t-il si mon markdown n'a pas de limites de diapositives claires ?

Le skill refuse plutôt que de deviner et se termine avec le code 6 ; l'étape suivante documentée consiste à router ce fichier vers md-document, qui traite un document continu plutôt que des diapositives distinctes.

Comment puis-je obtenir un PDF à partir du diaporama ?

Utilisez la feuille de style d'impression : imprimer depuis le navigateur produit un PDF avec une diapositive par page, si bien que l'export ne nécessite aucun outillage séparé.

MD Slides

Exécuter md-slides sur une vraie tâche de PPT et diaporamas.

Téléchargez OpenDesign, importez md-slides depuis son lien SKILL.md, collez le prompt ci-dessus, et lisez le plan avant le résultat.

Terminal
npx skills add https://github.com/alirezarezvani/claude-skills --skill md-slides

OpenDesign Desktop

Un seul design system. Votre marque, cohérente partout

Dans le Vibe Design Workspace complet, appliquez les mêmes règles de marque aux sites, slides, prototypes interactifs, dashboards, images et vidéos HTML. Connectez Codex, Claude Code, Cursor et vos autres agents de code locaux, puis créez gratuitement.

  • Sites, slides, prototypes, dashboards, images et vidéos
  • Plus de 140 design systems et la bibliothèque complète de modèles et skills
  • Codex local et plus de 21 agents de code · Gratuit
Télécharger gratuitement

Disponible sur macOS et Windows