Markdown ↔ HTML

El conversor <strong>Markdown ↔ HTML</strong> es bidireccional: convierte Markdown a HTML renderizado para publicar, y también HTML a Markdown para editar contenido con una sintaxis más simple. El preview en vivo muestra exactamente cómo quedará el resultado final.

Sintaxis Markdown soportada

Implementa CommonMark + extensiones GFM (tablas, tachado, checkbox lists). Compatible con GitHub, GitLab, Notion, Obsidian y la mayoría de static site generators.

La herramienta implementa CommonMark, el estándar más adoptado. Soporta headings (# H1 hasta ###### H6), negrita (**texto**), cursiva (*texto*), código inline (`código`), bloques de código con indicador de lenguaje (```javascript), listas ordenadas y no ordenadas, links ([texto](url)), imágenes (![alt](url)), citas (> texto) y separadores (---).

Para tablas, usa la sintaxis extendida GFM (GitHub Flavored Markdown): encabezados con | separadores y la línea de alineación con guiones. Ejemplo: | Col 1 | Col 2 | / |-------|-------|. Esta extensión también está disponible en plataformas como GitHub, GitLab, Notion y Obsidian.

Cuándo usar Markdown y cuándo HTML directo

Usa Markdown cuando escribes documentación técnica, READMEs de repositorios, artículos en plataformas como Dev.to o Hashnode, o cuando el contenido lo van a mantener personas sin conocimientos de HTML. La sintaxis es legible incluso sin renderizar.

Usa HTML directo cuando necesitas control fino sobre atributos (clases, IDs, data-attributes), cuando insertas componentes con JavaScript, o cuando el CMS recibe HTML directamente (como WordPress con el editor clásico o WooCommerce en descripciones de producto). La conversión HTML → Markdown es útil para limpiar HTML exportado de Word o Google Docs, que suele estar lleno de estilos inline innecesarios.

Casos prácticos de uso bidireccional

Un caso muy común: tienes el contenido de una página de aterrizaje en HTML y quieres moverlo a un sistema basado en Markdown (Jekyll, Hugo, Astro, VitePress). La dirección HTML → Markdown hace esa migración en segundos, generando Markdown limpio sin los divs y spans del HTML original.

En sentido inverso, si escribes documentación técnica en Markdown y necesitas publicarla como página HTML estática o enviarla como email HTML, la dirección Markdown → HTML genera el markup correcto con todos los elementos semánticos. Los bloques de código con resaltado de sintaxis son especialmente útiles para documentación de APIs o tutoriales técnicos.

• ▸El HTML generado usa tags semánticos: <strong> en vez de <b>, <em> en vez de <i>
• ▸Las URLs en links se sanitizan para prevenir XSS (se eliminan protocolos javascript:)
• ▸Para emails HTML, usa la opción de exportar con estilos inline — los clientes de correo ignoran CSS en <style>

Cómo funciona — paso a paso

1. 1
   Selecciona la dirección de conversión

   Elige Markdown → HTML o HTML → Markdown con el selector en la parte superior de la herramienta.
2. 2
   Ingresa el contenido

   Pega o escribe el texto en el panel izquierdo. El panel derecho muestra el resultado renderizado en tiempo real.
3. 3
   Revisa el preview

   Verifica que la estructura visual sea la esperada: headings, listas, código y links deben verse correctamente formateados.
4. 4
   Copia el resultado

   Usa el botón Copiar para llevar el HTML o Markdown resultante al portapapeles, listo para pegar en tu editor, CMS o repositorio.