Skip to main content
UtilityStack

Conversor de Markdown a HTML

Escribe Markdown a la izquierda y mira el HTML renderizado o la vista previa en vivo a la derecha. Impulsado por marked, soportando CommonMark más extensiones GitHub Flavored Markdown.

Markdown
HTML
<h1>Hello, Markdown!</h1>
<p>Markdown is a <strong>lightweight</strong> markup language with plain-text formatting syntax.</p>
<h2>Features</h2>
<ul>
<li>Headings, paragraphs, lists</li>
<li>Links: <a href="https://example.com">example</a></li>
<li>Inline code: <code>const x = 1</code></li>
<li>Code blocks:</li>
</ul>
<pre><code class="language-js">function greet(name) {
  return `Hello, ${name}!`
}
</code></pre>
<blockquote>
<p>Blockquotes work too.</p>
</blockquote>
<table>
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
</tr>
</thead>
<tbody><tr>
<td>Cell A</td>
<td>Cell B</td>
</tr>
</tbody></table>

¿Qué es Markdown?

Markdown es una sintaxis de formato de texto plano ligera inventada por John Gruber en 2004. Te permite escribir documentos estructurados (encabezados, listas, enlaces, código, tablas) usando puntuación que se lee naturalmente — # para un encabezado, ** para negrita, > para una cita — en lugar de los corchetes angulares HTML. Es el formato de facto para archivos README, posts de sitios estáticos, documentación técnica y herramientas como Notion o Slack.

CommonMark es el dialecto estandarizado de Markdown que la mayoría de parsers modernos implementan; GitHub Flavored Markdown (GFM) lo extiende con tablas, listas de tareas, bloques de código vallados con pistas de lenguaje, tachado y autoenlaces. Este conversor soporta ambos.

Cómo usar esta herramienta

  1. Escribe o pega Markdown en el área de entrada izquierda. Haz clic en «Ejemplo» para probar con contenido de ejemplo.
  2. Cambia el panel derecho entre HTML (la salida cruda) y Vista previa (el resultado renderizado).
  3. Usa «Copiar HTML» para poner la salida en tu portapapeles, o «Descargar .html» para guardar un archivo independiente.

Preguntas frecuentes

¿Qué sabor de Markdown se soporta?

CommonMark más las extensiones GFM más útiles: tablas, bloques de código vallados (con lenguaje), tachado, autoenlaces. Las listas de definición, notas al pie y HTML dentro del Markdown no están habilitadas por defecto.

¿La entrada se envía a un servidor?

No. La conversión sucede enteramente en tu navegador — tu fuente Markdown nunca sale de tu máquina.

¿Puedo incluir HTML crudo en el Markdown?

El HTML inline se preserva tal cual. Ten cuidado al copiar la salida de vuelta a un contexto donde las etiquetas script o atributos inseguros podrían importar — sanitízala (con DOMPurify o un sanitizador del lado del servidor) antes de renderizar salida no confiable.

¿Los bloques de código tienen resaltado de sintaxis?

La salida produce bloques ```lenguaje``` limpios con el marcado estándar `<pre><code class="language-xxx">`. No incluimos un resaltador de sintaxis para mantener el HTML pequeño y portable. Conecta highlight.js, Prism o Shiki en el lado receptor para colorear los bloques — todos leen la clase de lenguaje de forma nativa.

¿Cómo maneja documentos grandes?

La conversión es completamente del lado cliente y se ejecuta en una sola pasada, así que un documento típico de longitud de libro de 50 000 palabras se renderiza en menos de un segundo en un laptop moderno. El cuello de botella es la pasada de layout del navegador cuando pegas salida extremadamente larga en un contenteditable. Para entradas enormes, prefiere descargar el HTML en vez de dejar que la página re-renderice la vista previa en vivo.

Casos de uso comunes

Tareas donde convertir Markdown a HTML en el navegador ahorra tiempo real.

Migrar un README a un CMS

Pega un README de proyecto y copia el HTML directamente en un bloque de WordPress, Ghost o Notion — sin necesidad de instalar pandoc.

Componer un email HTML

Escribe el cuerpo en Markdown, convierte y pega el HTML en una plantilla de email transaccional. Mantén la fuente en texto plano para facilitar las ediciones.

Previsualizar una PR antes de pushear

GitHub renderiza Markdown del lado servidor; esto te da la misma vista previa localmente, así una errata en un encabezado no sorprende al revisor.

Convertir fragmentos de documentación

Saca un trozo de docs internas escritas en Markdown y pega el HTML en un artículo de centro de ayuda, una respuesta de soporte o un wiki que no entienda Markdown.

Consejos y atajos

Pequeños ajustes que hacen la salida más útil.

Etiqueta tus bloques de código

Especifica siempre el lenguaje tras los backticks de apertura (ej. ```ts). La salida recibe una clase language-xxx que highlight.js o Prism pueden colorear sin más configuración.

Sanitiza antes de renderizar entrada no confiable

Si el Markdown viene de un usuario, pasa el HTML por DOMPurify antes de renderizarlo — Markdown permite HTML crudo, etiquetas script incluidas.

Las tablas funcionan; los layouts complejos no

Las tablas GFM se convierten limpiamente. Para layouts multi-columna o muy diseñados, mete HTML directo dentro del Markdown en vez de pelearte con la sintaxis.

Mantén el alt en las imágenes

![](url) renderiza, pero el alt vacío daña SEO y accesibilidad. Cinco segundos para escribir `![Una breve descripción](url)` — tu yo futuro te lo agradecerá.

Herramientas relacionadas