Convierte Markdown a HTML y muestra el código fuente listo para copiar
Snippets rápidos
También podrías necesitar
Markdown es el formato de escritura por defecto en herramientas como GitHub, Notion, Obsidian, Confluence y casi todo editor moderno. Sin embargo, para usar el contenido en un CMS, en un template de email HTML, en documentación estática o en una API, necesitás el HTML real que genera ese Markdown. Esta herramienta toma cualquier texto Markdown y lo convierte al HTML correspondiente usando la librería marked (la misma que usa GitHub Pages), con resaltado de sintaxis en bloques de código usando highlight.js y sanitización del output con DOMPurify para prevenir XSS. El modo 'Código HTML' muestra el HTML raw con formato y resaltado de sintaxis, listo para copiar y pegar en tu proyecto. El modo 'Vista previa' muestra el resultado renderizado exactamente como lo vería un usuario final. Los estilos de la vista previa están inspirados en el tema GitHub Markdown para máxima legibilidad. Esta herramienta cierra el bidireccional del cluster Markdown de Kuvron: el Markdown Preview (texto → visual), el HTML to Markdown (HTML → Markdown) y este Markdown to HTML (Markdown → código HTML copiable). Ningún dato sale de tu navegador — todo se procesa localmente.
¿Qué diferencia hay con el Markdown Preview de Kuvron?
El Markdown Preview muestra el resultado visual renderizado — es para verificar cómo se verá el contenido al usuario final. Esta herramienta (Markdown to HTML) expone el código HTML generado para que lo copies y uses en tu código, CMS o plantilla. El toggle 'Vista previa / Código HTML' te permite ver ambos en la misma herramienta. Si lo que necesitás es el código fuente HTML para pegarlo en otro sistema, esta es la herramienta correcta.
¿El HTML generado es seguro para insertar directamente en mi web?
Sí, si usás la opción de sanitización (activa por defecto). DOMPurify elimina todos los atributos y etiquetas que podrían ejecutar JavaScript o causar XSS: event handlers (onclick, onerror), etiquetas script, iframes sin sandbox, javascript: URLs en href, y otros vectores de inyección. El HTML resultante es seguro para insertar con innerHTML. Si desactivás la sanitización (avanzado), el HTML incluirá todo lo que marked genere — útil si tu Markdown proviene de fuentes confiables o si DOMPurify está eliminando algo que necesitás.
¿Qué elementos Markdown están soportados?
Marked implementa la especificación CommonMark más GitHub Flavored Markdown (GFM): encabezados H1-H6, párrafos, negrita, cursiva, tachado, código inline y bloques de código (con fence ```), links, imágenes, listas ordenadas y desordenadas, listas de tareas (- [ ]), blockquotes, tablas GFM, líneas horizontales y HTML inline. Los bloques de código con lenguaje especificado (```javascript) reciben highlighting automático de highlight.js.
¿Puedo usar el HTML generado directamente en un email?
Con ajustes, sí. El HTML generado usa etiquetas semánticas modernas (h1, ul, table, pre, code) que funcionan en clientes de email modernos. Sin embargo, los emails HTML tradicionales requieren inline CSS (muchos clientes como Outlook no soportan stylesheets externos o etiquetas <style>). Para emails, deberás convertir los estilos de la vista previa a CSS inline. Herramientas como Juice (Node.js) o Foundation for Emails automatizan esta conversión. Para boletines o emails simples con solo texto y links, el HTML generado suele funcionar bien directamente.
¿Cómo funciona el syntax highlighting de bloques de código?
highlight.js analiza el contenido de cada bloque de código fenced (``` con lenguaje especificado) y añade clases CSS que mapean a los tokens del lenguaje: palabras clave, strings, comentarios, números, etc. Los estilos de color se aplican vía una stylesheet de highlight.js. Si no especificás el lenguaje (``` sin etiqueta), highlight.js intenta detectarlo automáticamente — funciona para la mayoría de lenguajes comunes. Lenguajes soportados: JavaScript, TypeScript, Python, PHP, SQL, Bash, JSON, YAML, Markdown, HTML, CSS, Go, Rust, Java, C++, y ~200 más.