Redactaste una publicación en Markdown pero la plataforma del blog solo acepta HTML. Quieres colocar un cuerpo con formato Markdown dentro de una plantilla de correo. Estás llevando contenido Markdown a un editor WYSIWYG de un CMS. Todos estos escenarios terminan en el mismo paso: convertir Markdown a HTML.
Pandoc o un script de compilación pueden hacerlo localmente, pero escribir un comando para cada pegado rápido se vuelve tedioso, y muchas personas prefieren no pegar borradores internos en una herramienta online de terceros. Esta guía cubre la relación entre Markdown y HTML, cuándo aparece la conversión en la práctica y cómo hacerla directamente en el navegador.
Respuesta rápida
Pega tu Markdown en Markdown a HTML y pulsa Run. El HTML aparece al instante. No hay nada que instalar, y la conversión se ejecuta por completo en el navegador: tus datos nunca salen de tu equipo.
La salida sigue dos especificaciones: CommonMarkSe abre en una pestaña nueva para la sintaxis básica, y la especificación de GitHub Flavored MarkdownSe abre en una pestaña nueva para tablas, listas de tareas, tachado y autoenlaces. Para ver en qué se diferencian ambas, consulta CommonMark vs GFM.
Cómo se relacionan Markdown y HTML
Markdown es un lenguaje de marcado ligero que prioriza la legibilidad para las personas sin dejar de expresar estructura. HTML es el formato que los navegadores realmente renderizan, con etiquetas que envuelven cada fragmento de contenido. Ambos se corresponden con claridad entre sí. Este Markdown:
# Heading
This is a paragraph with **bold** and _italic_.
- Item 1
- Item 2
se convierte en este HTML:
<h1>Heading</h1>
<p>This is a paragraph with <strong>bold</strong> and <em>italic</em>.</p>
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
Markdown se diseñó pensando en la salida HTML, y la correspondencia entre sintaxis y etiquetas es en gran medida uno a uno.
Cuándo surge la conversión
Plataformas de blog y CMS sin soporte para Markdown
El editor clásico de WordPress, varios CMS heredados y muchas herramientas de publicación internas todavía esperan HTML directamente. Redactar en Markdown y convertir al introducirlo es más rápido que pelearse con un editor WYSIWYG para mantener la coherencia del diseño.
Correo en HTML
Las plataformas de boletines aceptan cuerpos en HTML. Escribir el origen en Markdown mantiene el borrador legible y, al mismo tiempo, te permite enviar el HTML final a una plantilla.
Sitios estáticos y pipelines de documentación
Algunos generadores de sitios estáticos o herramientas de documentación no analizan Markdown directamente y esperan HTML prerrenderizado como parte del paso de compilación.
Convertir con FormatArc
Markdown a HTML toma el Markdown pegado y produce HTML. No hay nada que instalar.
Paso 1: Abre la herramienta
Ve a Markdown a HTML.
Paso 2: Pega tu Markdown
Pega el origen Markdown en el panel izquierdo. Se admiten encabezados, listas, enlaces, imágenes, bloques de código delimitados y el resto de la sintaxis común.
Paso 3: Pulsa Run
Pulsa Run y el HTML aparece en el panel derecho.
GitHub Flavored Markdown está habilitado, así que las tablas con barras (| col1 | col2 |) y las casillas de las listas de tareas (- [x]) se convierten en los elementos HTML correspondientes.
La conversión se ejecuta por completo en el navegador. Los borradores sin publicar y los documentos internos permanecen en tu equipo.
Sintaxis admitida
Se cubren las principales características de GFM:
- Encabezados (
#hasta######) - Párrafos y saltos de línea
- Énfasis (
**bold**,_italic_,~~strikethrough~~) - Listas ordenadas y sin ordenar
- Listas de tareas (
- [ ],- [x]) - Enlaces e imágenes
- Código en línea y bloques de código delimitados
- Tablas
- Citas
- Líneas horizontales
La notación matemática (KaTeX, MathJax) no se admite.
Para profundizar en cómo se escriben las tablas de Markdown (barras, alineación, escape de celdas, contenido de varias líneas), consulta la chuleta de sintaxis de tablas en Markdown.
Markdown a HTML en código: cuándo necesitas una librería
Una herramienta de navegador es ideal para conversiones puntuales, pero si estás construyendo un pipeline, un sitio estático o integrando la conversión dentro de una aplicación, una librería de JavaScript o una CLI es la opción adecuada. Estas son las opciones a las que recurren la mayoría de los desarrolladores.
marked.js (navegador y Node)
Un analizador de Markdown pequeño y rápido que se ejecuta tanto en el navegador como en Node. Instálalo con npm install marked y convierte en una sola línea:
import { marked } from 'marked';
const html = marked.parse('# Hello\n\nThis is **bold**.');
GFM está habilitado de forma predeterminada, así que las listas de tareas, las tablas con barras y los bloques de código delimitados siguen la especificación sin configuración adicional.
¿Sin paso de compilación? Cárgalo desde un CDN y convierte directamente en la página — combínalo con un sanitizador como DOMPurify siempre que la entrada no sea tu propio texto:
<script type="module">
import { marked } from 'https://cdn.jsdelivr.net/npm/marked/lib/marked.esm.js';
document.body.innerHTML = marked.parse('# Hello from the browser');
</script>
markdown-it (analizador extensible)
Otro analizador popular de Markdown a HTML, construido en torno a un sistema de plugins. Recurre a él cuando necesites notas al pie, bloques contenedores, contenedores personalizados o cualquier sintaxis no estándar:
import MarkdownIt from 'markdown-it';
const md = new MarkdownIt({ html: true, linkify: true });
const html = md.render('# Hello\n\nThis is **bold**.');
Para tablas y listas de tareas, instala los plugins equivalentes de GFM (markdown-it-task-lists, etc.), ya que no están habilitados de forma predeterminada.
remark (pipeline unificado)
marked y markdown-it te devuelven una cadena HTML en un solo paso. remarkSe abre en una pestaña nueva toma otro camino: analiza el Markdown en un árbol de sintaxis que los plugins transforman antes de serializar nada a HTML. La conversión se convierte en un pipeline: remark-gfm para tablas y listas de tareas, remark-rehype para pasar al árbol HTML, luego rehype-sanitize o cualquier otra transformación que necesites, terminando en rehype-stringify:
import { remark } from 'remark';
import remarkGfm from 'remark-gfm';
import remarkRehype from 'remark-rehype';
import rehypeSanitize from 'rehype-sanitize';
import rehypeStringify from 'rehype-stringify';
const html = await remark()
.use(remarkGfm)
.use(remarkRehype)
.use(rehypeSanitize)
.use(rehypeStringify)
.process('# Hello\n\nThis is **bold**.');
Eso son más piezas en movimiento que un marked.parse() de una línea, y ese es exactamente el compromiso: elige remark cuando la conversión es una etapa dentro de una transformación más grande (sanear, anclas de encabezado, una tabla de contenidos generada) y no el trabajo completo. Así es también como FormatArc divide internamente el trabajo: la herramienta Markdown a HTML convierte el texto pegado con marked, mientras que el blog que estás leyendo se renderiza con un pipeline remark + rehype (GFM, saneado, anclas de encabezado para la tabla de contenidos).
Pandoc (CLI)
El conversor universal de documentos. La mejor opción para pipelines de compilación, trabajos por lotes o cuando necesitas convertir entre formatos más allá de Markdown ↔ HTML:
pandoc -f markdown -t html input.md -o output.html
Pandoc admite CommonMark, GFM, MultiMarkdown y más mediante flags. Es más lento que las librerías de JS para una sola conversión, pero insuperable por su cobertura de formatos y su salida a PDF / DOCX.
De forma predeterminada, Pandoc genera un fragmento HTML. Estas flags del manual de PandocSe abre en una pestaña nueva cubren la mayoría de las necesidades de conversión a HTML:
| Flag | Qué hace |
|---|---|
-f gfm | Analiza la entrada como GitHub Flavored Markdown en lugar del Markdown extendido de Pandoc |
--standalone | Genera un documento HTML completo con <html> y <head> en lugar de un fragmento |
--toc | Genera una tabla de contenidos a partir de los encabezados (solo tiene efecto con --standalone) |
--template FILE | Renderiza la salida usando tu propia plantilla HTML |
--embed-resources | Incrusta imágenes, CSS y scripts para producir un único archivo autocontenido |
--highlight-style STYLE | Elige un tema de resaltado de sintaxis para los bloques de código (pygments, kate, ...) |
Comparación
| Herramienta | Se ejecuta en el navegador | Tablas GFM integradas | Requiere instalación | Ideal para |
|---|---|---|---|---|
| FormatArc (esta herramienta) | Sí | Sí | No | Conversión puntual al pegar |
| marked.js | Sí | Sí | Sí (npm) | Conversión integrada en una app |
| markdown-it | Sí | Mediante plugin | Sí (npm) | Extensiones de sintaxis personalizadas |
| remark | Sí | Mediante plugin (remark-gfm) | Sí (npm) | Pipelines multi-etapa (saneado, TOC, transformaciones personalizadas) |
| Showdown | Sí | Mediante opción (tables: true) | Sí (npm) | Proyectos veteranos; también convierte de HTML a Markdown |
| Pandoc | No | Sí | Sí (binario) | Pipelines de compilación, lotes multiformato |
Si solo necesitas pegar Markdown y copiar HTML, la herramienta de navegador anterior es suficiente. Para compilaciones automatizadas, Pandoc. Para la integración en una app o para incluir un analizador en un bundle de frontend, marked.js o markdown-it.
Cosas a tener en cuenta al usar la salida
Sanea por separado la entrada no confiable
Markdown permite HTML sin procesar, lo que significa que cualquier etiqueta <script> del origen pasa directamente a la salida. Si estás convirtiendo tus propios textos, esto no supone problema. Si estás convirtiendo entrada de usuarios o de cualquier origen no confiable, pasa el resultado por DOMPurify o un sanitizador similar antes de renderizarlo.
No incluye estilos
La salida es solo HTML estructural. No se añade CSS. La idea es que el lugar donde lo pegues (un blog, un CMS, una plantilla de correo) aporte los estilos visuales.
Resaltado de sintaxis en los bloques de código
Especificar un lenguaje con ```js añade class="language-js" al elemento <code> renderizado, pero el resaltado de sintaxis real requiere cargar algo como Prism.js o highlight.js en la página que lo renderiza.
Preguntas frecuentes
¿Admite GitHub Flavored Markdown (tablas, listas de tareas, código delimitado)?
Sí. El conversor sigue la especificación de GitHub Flavored Markdown, así que las tablas con barras (| col1 | col2 |), las casillas de las listas de tareas (- [x]), el tachado (~~text~~) y los bloques de código delimitados con indicación opcional de lenguaje se convierten todos en los elementos HTML correspondientes.
¿La conversión se hace en el navegador?
Sí. Tanto el análisis como la generación de HTML se ejecutan por completo en tu navegador mediante JavaScript. No se sube nada a un servidor, así que los borradores internos y los documentos sin publicar permanecen en tu equipo.
¿Debería sanear la salida HTML antes de publicarla?
Si el origen son tus propios textos, la salida es segura para usarla directamente. Si el Markdown proviene de un origen no confiable, como entrada de un formulario o contenido de terceros, pasa el resultado por un sanitizador como DOMPurify antes de renderizarlo. El HTML sin procesar incrustado en Markdown, incluidas las etiquetas <script>, pasa a la salida tal cual.
¿En qué se diferencia de Pandoc?
Pandoc es un potente conversor de línea de comandos que maneja muchos formatos y produce una salida altamente personalizable, pero requiere instalación y una terminal. Esta herramienta de navegador es más rápida para conversiones puntuales: pegar, hacer clic en Run, copiar el resultado. Para pipelines de compilación y trabajos por lotes, Pandoc sigue siendo la mejor opción.
¿Puedo convertir HTML de vuelta a Markdown?
Sí. Para la dirección inversa, usa el conversor de HTML a Markdown, que reduce las etiquetas HTML a un origen Markdown limpio. El artículo complementario es la guía de HTML a Markdown.
Si tus archivos Markdown incluyen frontmatter YAML, consulta Frontmatter YAML a JSON en Markdown para ver la matriz de compatibilidad con SSG y los cinco tipos que se rompen durante la conversión.
Para terminar
Convertir Markdown a HTML es algo con lo que todo usuario de Markdown se topa tarde o temprano. Para conversiones puntuales, una herramienta de navegador como Markdown a HTML es más rápida que instalar y recordar una CLI.
Para la dirección inversa, consulta HTML a Markdown. Para convertir CSV en una tabla de Markdown, consulta la guía de CSV a Markdown. Si quieres la misma conversión desde la barra de herramientas de tu navegador, revisa la guía 2026 de la extensión de Chrome de FormatArc.