Ir a la guía de uso
md-slidespor Alireza Rezvani

MD Slides Skill.

Un skill de Claude Code y Codex para PPT y presentaciones: convierte un deck en Markdown en diapositivas con identidad de marca.

  • Presentations
  • Diapositivas 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
Encabezados de sección y metadatos leídos del archivo original el 14 de septiembre de 2026 · 6506 caracteres en total

01 Qué hace

Qué Hace el Skill md-slides en Claude Code y Codex

Resumen, flujo de trabajo y resultados, todo leído del SKILL.md del skill.

Del SKILL.mdLeído 2026-09-14 · no es una ejecución registrada

En los propios términos del Skill

md-slides convierte un deck en markdown en una presentación HTML de un solo archivo que se ejecuta en cualquier navegador. Un deck son diapositivas separadas por límites --- HR o encabezados # H1, con bloques opcionales de notas del presentador <!-- notes: ... -->. Un pipeline de tres scripts de Python de la stdlib: slide_splitter.py, presenter_notes_parser.py, deck_html_renderer.py.

El resultado incluye navegación por teclado, enlaces profundos mediante hash en la URL, una barra de progreso y contador de diapositivas, modo presentador con reloj y vista previa de la siguiente diapositiva, y una hoja de estilos de impresión para exportar a PDF con una diapositiva por página. Reutiliza el analizador de markdown de md-document y lee los tokens del design system mediante config_loader.py. Rechaza entradas sin límites de diapositiva claros, decks de 1 diapositiva, archivos con menos de 100 líneas, y decks que no superan la cobertura del 50% de --strict-notes.

Qué produce

  • El deck HTML renderizado, escrito como deck-{slug}.html en el directorio de salida predeterminado resuelto, con -2, -3, etc. añadidos en caso de colisiones.
  • Archivos JSON intermedios que contienen las diapositivas divididas y luego las diapositivas con sus notas adjuntas.
  • Un PDF con una diapositiva por página, producido mediante la hoja de estilos de impresión al imprimir desde el navegador.
Ver el ejemplo de prompt ↗

Cómo funciona

  1. 01
    Dividir el Deck en Diapositivas Ordenadas

    slide_splitter.py lee el markdown de origen y lo divide en líneas --- HR o encabezados H1, detectando automáticamente el estilo de límite por defecto, y escribe una lista ordenada de diapositivas.

  2. 02
    Adjuntar Notas del Presentador por Diapositiva

    presenter_notes_parser.py analiza cada diapositiva en busca de bloques de notas y las adjunta a esa diapositiva, para que el modo presentador tenga algo que mostrar en el panel de la derecha.

  3. 03
    Renderizar el Deck HTML de un Solo Archivo

    deck_html_renderer.py combina las diapositivas con los tokens del design system y genera el deck, tomando un título y una ruta de salida desde la línea de comandos.

  4. 04
    Aplicar Tokens del Design System

    Doce propiedades personalizadas de CSS de marca provienen del design system, y design_style cambia la densidad de los diseños de las diapositivas.

  5. 05
    Rechaza Entradas que no Son Presentaciones

    El skill se cierra en lugar de convertir cuando la entrada no tiene límites de diapositiva claros, generaría una sola diapositiva, o falla la verificación de cobertura de notas bajo --strict-notes.

02 Encuentra tu caso de uso

Cuándo Usar el Skill md-slides

Usa el skill md-slides en Claude Code o Codex cuando el trabajo sea PPT y decks de diapositivas de este tipo. La idoneidad y límites a continuación se toman del propio archivo del skill.

Buen caso de uso

  • Un orquestador clasificó la entrada como SLIDES y la dirigió aquí.
  • Alguien invoca el skill directamente sobre un archivo markdown con el comando de barra.
  • El markdown ya tiene 3 o más líneas HR ---, o 5 o más encabezados H1 con cuerpos cortos.
  • La presentación se mostrará en vivo, que es exactamente cuando las notas del presentador importan y la lectura autónoma las hace opcionales.

Conozca los límites

  • La entrada es una especificación extensa en lugar de una presentación; eso debería ir a md-document.
  • La entrada es una revisión de código, que pertenece a md-review.
  • No es una herramienta de diseño gráfico: Keynote y PowerPoint dominan ese espacio, mientras que este maneja presentaciones escritas en markdown y proyectadas desde un navegador.

Qué proporcionar

  • El archivo markdown de la presentaciónSu ruta se pasa a slide_splitter.py con --input, y el resultado dividido se escribe en un archivo JSON con --output.
  • Estilo de límiteLas diapositivas deben ser distinguibles, ya sea por límites HR --- o por encabezados H1, para que el divisor tenga algo por donde cortar.
  • Notas de presentador opcionalesLas notas se proporcionan como bloques de comentarios HTML dentro de las diapositivas y se analizan y adjuntan por diapositiva en el segundo paso del pipeline.

03 Dentro del skill

Reglas que el Skill md-slides le Da a Claude Code y Codex

8 instrucciones concretas, valores por defecto y límites que SKILL.md fija para el agente: la parte del archivo que cambia el resultado.

  1. Requisito de Límite

    El modo automático necesita al menos 3 líneas HR o al menos 5 encabezados H1 en la fuente; si no hay ninguno presente, el skill se niega y la entrada debería ir a md-document en su lugar.

  2. Sin Salida de una Sola Diapositiva

    Una presentación que se renderiza en una sola diapositiva se rechaza como un póster, no como una presentación, con código de salida 5.

  3. Mínimo 100 Líneas de Origen

    Se rechazan las entradas de menos de 100 líneas, usando el mismo umbral Shihipar aplicado en todos los conversores.

  4. Puerta de Incorporación

    El skill se niega a ejecutarse sin incorporación, la misma puerta que usa cada conversor.

  5. Cobertura Estricta de Notas

    Con --strict-notes, el skill rechaza una presentación en la que menos del 50% de las diapositivas tienen notas, porque no está configurada para el modo presentador; ese rechazo sale con código 7.

  6. Advertir sobre Diapositivas Demasiado Largas

    Las diapositivas con más de 40 líneas de origen generan una advertencia leve sobre la relación señal-ruido; la presentación se sigue renderizando, pero se muestra el recuento.

  7. Mantener la salida en un solo archivo

    Todo el CSS y el JS están incrustados; el único recurso externo es el CSS de Google Fonts, y Prism.js es opcional a través de --syntax en lugar de incluirse por defecto.

  8. Sin runtime de framework

    La presentación usa JS puro y controladores de eventos de teclado únicamente, sin runtime de React, Vue ni Svelte involucrado.

04 Ponlo a trabajar

Instalar md-slides en Claude Code o Codex

Un comando npx skills add, luego una primera tarea en tu agente y una lista de verificación para el resultado.

Añadir md-slides a Claude Code, Codex o tu agente

Ejecútelo en su proyecto; el instalador pregunta a qué agente añadirlo.

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

Forma genérica de la CLI de skills para markdown-html/skills/md-slides/SKILL.md; el repositorio puede documentar su propia ruta.

Dale a la skill una primera tarea de PPT y presentaciones

Redactado en los términos del propio skill; sustituya las partes entre corchetes por su material.

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].

Fuente: redactado a partir del SKILL.md en los términos del propio skill.

Revisa el primer resultado

Lo que el propio SKILL.md indica que debe ser un resultado correcto:

  • Abra la presentación en un navegador y pruebe las teclas: flechas, Espacio y PgDn avanzan, PgUp retrocede, Home y End saltan, P activa el modo presentador, Esc lo cierra.
  • Pruebe el enlace directo: #3 debería saltar a la diapositiva 3, el botón de retroceso y avance del navegador debería recorrer las diapositivas, y un deck.html#5 compartido debería abrirse directamente en la diapositiva 5.
  • Compruebe el contador de diapositivas en la esquina inferior derecha, que muestra algo como "3 / 12", frente a la longitud de la presentación.
  • Confirme que se respeta la media query de movimiento reducido, de modo que la animación se omita para quienes solicitan menos movimiento.

En OpenDesign importe md-slides desde su enlace SKILL.md: Plugins → Add → Skill → Import from link, y luego selecciónelo en la barra superior.

05 Código abierto, rastreable

Fuente, Licencia y Verificación

De dónde provienen los datos de esta página y cuándo se verificaron por última vez.

Archivo de skill
markdown-html/skills/md-slides/SKILL.md Checksum de contenido registrado en verificación; commit 19392f7
License
MIT De LICENSE.
Estrellas del repositorio
25,934 Instantánea de GitHub tomada el 2026-09-14 para todo el repositorio alirezarezvani/claude-skills, que contiene 5 skills en este catálogo. No es una calificación ni un conteo de uso para md-slides.
Verificado por OpenDesign
14/09/2026 Se verificaron el archivo fuente, la ruta, el texto de licencia y el recuento de estrellas. No incluido en OpenDesign principal (verificado el 28/08/2026); no se ha registrado una ejecución en vivo en esta página.

Dentro del SKILL.md

  1. Cuándo invocarloSíntomas de enrutamiento, además de qué entradas deben rechazarse o enviarse a otro lugar.
  2. PipelineTres comandos que dividen, analizan las notas y renderizan la presentación.
  3. Qué incluye el HTMLNavegación, enlaces directos, modo presentador, hoja de estilos de impresión, tokens, reutilización del parser.
  4. Reglas estrictasUmbrales de rechazo, advertencias leves y restricciones de salida en un solo archivo.
  5. Biblioteca de preguntas forzadas (disciplina de interrogatorio de Matt Pocock)Cinco preguntas por resolver antes de convertir un archivo de origen.
  6. Se diferencia deEn qué se diferencia de md-document, md-review, landing pages y Keynote.
  7. Producto de salidaResolución de la ruta de salida y la convención de sufijo por colisión.
  8. ReferenciasFuentes y referencias canónicas detrás de las convenciones de la presentación.
La descripción propia del Skill
Convierte un deck de markdown (diapositivas separadas por límites HR `---` o por encabezados H1 `# `, con bloques opcionales de notas del presentador ``) en una presentación HTML de un solo archivo con navegación por teclado con flechas / espacio / AvPág / RePág / Inicio / Fin / P / Esc, modo presentador (vista dividida con diapositiva actual + notas del orador + reloj + vista previa de la siguiente diapositiva), enlace profundo por hash de URL, y `@media print` página por diapositiva para exportación a PDF. Se activa cuando el markdown-html-orchestrator clasifica una entrada como SLIDES, o cuando se invoca directamente mediante /cs:md-slides. Reutiliza el analizador de markdown de md-document para renderizar el cuerpo de las diapositivas y lee los tokens de design-system mediante config_loader.py. Rechaza si la entrada no tiene límites claros de diapositivas, produce un deck de 1 diapositiva, o `--strict-notes` está activado con < 50% de cobertura de notas. Usar después del enrutamiento del orquestador.

Descripción del front-matter de SKILL.md. El archivo completo tiene aproximadamente 6,506 caracteres. Lee el archivo completo en GitHub.

06 Antes de instalar

Preguntas sobre el skill md-slides

Las respuestas provienen del SKILL.md tal como se leyó el 2026-09-14, no de una ejecución registrada.

¿Qué agentes de código pueden ejecutar este skill?

El archivo enumera claude-code, codex-cli, cursor, antigravity, opencode y gemini-cli como herramientas compatibles, y también puede activarse cuando el markdown-html-orchestrator clasifica una entrada como SLIDES.

¿Qué pasa si mi markdown no tiene límites claros entre diapositivas?

El skill se niega en lugar de adivinar y termina con el código 6; el siguiente paso documentado es enrutar ese archivo a md-document, que gestiona un documento continuo en lugar de diapositivas discretas.

¿Cómo obtengo un PDF a partir de la presentación?

Utilice la hoja de estilos de impresión: imprimir desde el navegador genera un PDF con una diapositiva por página, de modo que la exportación no requiere herramientas adicionales.

MD Slides

Ejecuta md-slides en una tarea real de PPT y presentaciones.

Descarga OpenDesign, importa md-slides desde su enlace SKILL.md, pega el prompt anterior y lee el plan antes del resultado.

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

OpenDesign Desktop

Un sistema de diseño. Tu marca, coherente en cada resultado

En el Vibe Design Workspace completo, aplica las mismas reglas de marca a sitios web, presentaciones, prototipos interactivos, dashboards, imágenes y vídeo HTML. Conecta Codex, Claude Code, Cursor y otros agentes de código locales y crea gratis.

  • Web, presentaciones, prototipos, dashboards, imágenes y vídeo
  • Más de 140 sistemas de diseño y la biblioteca completa de plantillas y skills
  • Codex local y más de 21 agentes de código · Gratis
Descargar gratis

Disponible para macOS y Windows