Repolode
Enviar
QingYunA

QingYunA/answer-me-with-html

Una skill para agentes que convierte la respuesta de una IA a una pregunta compleja en una página HTML sin conexión, con diagramas, tablas y diseño.

Ver en GitHubSitio web
Estrellas
3,953
Forks
275
Issues abiertos
8
Último commit
hace 8 horas

¿Qué es?

Answer me with HTML es una skill para agentes de programación como Claude Code, Codex y Cursor. Cuando una pregunta requiere más de un párrafo, el agente redacta un borrador breve en Markdown y se lo pasa a una CLI incluida, que lo convierte en un único archivo HTML independiente. La CLI se encarga del diseño, el tema, los diagramas SVG y la ubicación de los diagramas de flujo, para que el modelo solo tenga que escribir el contenido.

La página admite diagramas de flujo, diagramas de secuencia, diagramas ER, árboles, cronologías, gráficos, tablas comparativas y frases anotadas, con los temas blueprint, shadcn y paper. Cada página incluye su Markdown de origen y no depende de CDN ni de fuentes web, por lo que puede abrirse sin conexión. El proyecto también incluye un modo opcional de video explicativo que crea una página con un reproductor narrado y paso a paso.

La CLI funciona con Node.js 20 o posterior y no requiere pasos de instalación aparte de añadir la skill. Una revisión de escritura basada en ASD-STE100 advierte sobre las frases largas, la voz pasiva y las expresiones imprecisas.

Funciones clave

  • 01Convierte un borrador en Markdown en un único archivo HTML que funciona sin conexión y no tiene dependencias externas.
  • 02Distribuye automáticamente los diagramas de flujo y espacia los diagramas de secuencia según el ancho de las etiquetas.
  • 03Ofrece los temas blueprint, shadcn y paper, cada uno con modo claro y oscuro.
  • 04Admite tablas con marcas de verificación y cruces, código citado de archivos fuente y gráficos.
  • 05Puede generar páginas de videos explicativos narrados que se pueden exportar desde el navegador.

Casos de uso

  • Explicar un protocolo o el diseño de un sistema con diagramas de secuencia y de estados.
  • Mostrar cómo se conectan los módulos de una base de código mediante un árbol de carpetas y un grafo de llamadas.
  • Comparar opciones tecnológicas, como bases de datos, en una sola página fácil de leer.
  • Revisar un plan o un borrador y responder a las decisiones directamente en la página para luego pegar las respuestas en el agente.

Inicio rápido

  1. 1

    Instala Node.js 20 o una versión posterior

  2. 2

    Instala el plugin de Claude Code (ejecútalo dentro de Claude Code)

    /plugin marketplace add QingYunA/answer-me-with-html
  3. 3

    Instala el plugin desde el marketplace

    /plugin install answer-me-with-html@answer-me-with-html
  4. 4

    O instálalo en cualquier agente con el instalador de skills

    npx skills add QingYunA/answer-me-with-html

Antes de usarlo

  • Para usar la CLI y la skill, necesitas tener instalado Node.js 20 o una versión posterior.
  • El modo siempre activo está desactivado de forma predeterminada y requiere añadir una regla al archivo de reglas de tu agente.
  • Las actualizaciones son manuales; la CLI solo busca nuevas versiones en segundo plano.

Temas

#agent-skill#ai-agent#claude-code#html#diagram#markdown#cli#visualization#claude-code-skill#claude-skill

Preguntas frecuentes

¿Qué es answer-me-with-html?
Una skill para agentes que convierte la respuesta de una IA a una pregunta compleja en una página HTML sin conexión, con diagramas, tablas y diseño. Answer me with HTML es una skill para agentes de programación como Claude Code, Codex y Cursor. Cuando una pregunta requiere más de un párrafo, el agente redacta un borrador breve en Markdown y se lo pasa a una CLI incluida, que lo convierte en un único archivo HTML independiente. La CLI se encarga del diseño, el tema, los diagramas SVG y la ubicación de los diagramas de flujo, para que el modelo solo tenga que escribir el contenido.
¿answer-me-with-html es gratuito? ¿Qué licencia tiene?
answer-me-with-html es open source bajo la licencia MIT. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿answer-me-with-html sigue mantenido?
Mantenimiento activo. El último commit de answer-me-with-html fue el 20 oct 2026.
¿Para qué puedo usar answer-me-with-html?
Explicar un protocolo o el diseño de un sistema con diagramas de secuencia y de estados. Mostrar cómo se conectan los módulos de una base de código mediante un árbol de carpetas y un grafo de llamadas. Comparar opciones tecnológicas, como bases de datos, en una sola página fácil de leer. Revisar un plan o un borrador y responder a las decisiones directamente en la página para luego pegar las respuestas en el agente.
¿Cómo se instala answer-me-with-html?
Instala Node.js 20 o una versión posterior Instala el plugin de Claude Code (ejecútalo dentro de Claude Code): /plugin marketplace add QingYunA/answer-me-with-html Instala el plugin desde el marketplace: /plugin install answer-me-with-html@answer-me-with-html O instálalo en cualquier agente con el instalador de skills: npx skills add QingYunA/answer-me-with-html
¿Dónde consigo answer-me-with-html?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/QingYunA/answer-me-with-html

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados