Softonic

Convertidor de Markdown a HTML

Paso 1 / 3
Siguiente

Pega Markdown y obtén HTML semántico limpio, <h1> a <h6>, <ul>, <ol>, <table>, <pre><code> con sintaxis resaltada, <blockquote>, URLs autoenlazadas. Elige documento completo (con <html>, <head> y una hoja de estilos mínima) o fragmento (solo el contenido del cuerpo) dependiendo de si lo estás integrando en una página existente o produciendo un archivo independiente.

Cómo convertir Markdown a HTML

  1. 1

    Pega Markdown

    Documento completo o fragmento. El front-matter YAML se elimina automáticamente si está presente.

  2. 2

    Elige conjunto de extensiones

    Solo CommonMark, GFM (tablas, listas de tareas, autolinks), o GFM + matemáticas.

  3. 3

    Elige modo de salida

    Fragmento para incrustar, o documento HTML completo con head y CSS mínimo.

  4. 4

    Copia o descarga HTML

    Obtén el HTML como texto o guárdalo como un archivo `.html`.

Tabla de mapeo

Markdown HTML
# Encabezado 1 <h1>Encabezado 1</h1>
**negrita** <strong>negrita</strong>
*cursiva* <em>cursiva</em>
`código` <code>código</code>
Código cercado con lang <pre><code class="language-js">
- elemento <ul><li>elemento</li></ul>
1. elemento <ol><li>elemento</li></ol>
> cita <blockquote><p>cita</p></blockquote>
[texto](url) <a href="url">texto</a>
![alt](src) <img src="src" alt="alt">
--- <hr>
Tabla GFM <table><thead>...</thead>...
- [x] hecho <input type="checkbox" checked disabled>

Resaltado de sintaxis

Los bloques de código cercados con pistas de lenguaje obtienen un atributo class="language-xxx" en el elemento <code>. El convertidor también incluye la salida tokenizada de highlight.js cuando activas “pre-resaltado”, útil si la página de destino no carga un runtime de resaltador.

Documento completo vs. fragmento

  • Fragmento es solo el HTML interno, comienza con <h1> o lo que sea el primer elemento. Pega en un bloque CMS existente, cuerpo de correo electrónico o componente frontend.
  • Documento completo envuelve el fragmento en <!DOCTYPE html>, <html>, <head> con una pequeña hoja de estilos predeterminada (tipografía, bloques de código, tablas). Guárdalo como .html y se abrirá en cualquier navegador, sin archivos adicionales necesarios.

CSS en línea vs. externo

  • Estilos en línea (activar) colocan todo el CSS directamente en los elementos. Feo pero a prueba de fallos para plantillas de correo electrónico.
  • Clases (predeterminado) mantienen el HTML limpio y esperan que la hoja de estilos de tu sitio maneje el estilo.

Notas de accesibilidad

  • Los encabezados se renderizan como <h1>–<h6> semánticos preservando tu jerarquía. No saltes niveles en la fuente.
  • Las imágenes sin texto alternativo producen <img alt=""> (un alt vacío intencional para imágenes decorativas), pero añade texto alternativo a menos que la imagen realmente sea decoración.
  • Las tablas obtienen un <thead> para la fila de encabezado, mejorando la navegación del lector de pantalla.

Preguntas frecuentes

Sí. El HTML en bruto en la fuente se pasa con las etiquetas de script y atributos de evento eliminados. Si necesitas salida no saneada (confías en la entrada), hay un interruptor, no lo uses en contenido proporcionado por el usuario.

Las listas de tareas GFM (- [x], - [ ]) se convierten en elementos <input type="checkbox" disabled>. El atributo disabled previene cambios de estado accidentales en la vista renderizada.

Sí, activa estilos en línea. El convertidor incluye un atributo de estilo mínimo en cada bloque, que es lo que necesitan los clientes de correo electrónico (Outlook, Gmail) ya que eliminan bloques <style>.

Activa la extensión de matemáticas y los bloques $x^2$ o $$...$$ se renderizan a través de KaTeX. El convertidor genera SVG o HTML estático, no se requiere runtime de MathJax.

No. El análisis y la generación de HTML ocurren en tu navegador. La fuente y la salida nunca abandonan tu dispositivo.

Herramientas relacionadas

Referencia de la tabla ASCII

Tabla ASCII completa del 0 al 127 con decimal, hex, octal, binario y referencia numérica HTML para cada carácter, incluidos los códigos de control como NUL, LF y DEL.

Referencia de caracteres HTML

Lista buscable de entidades HTML, sus códigos nombrados y numéricos, y una copia con un clic para caracteres y símbolos especiales.

Referencia de atajos de teclado

Busca los atajos predeterminados documentados de VS Code, Chrome y Bash con GNU Readline en macOS, Windows y Linux.

Generador de letras aleatorias

Genera letras aleatorias A-Z. Elige la cantidad, usa mayúsculas, minúsculas o mezcla de ambas, y aplica el resultado en juegos, consignas o clase.

Generador de Paletas de Color

Genera paletas monocromáticas, análogas, complementarias, triádicas o tetrádicas desde un color base HEX y exporta variables CSS listas para copiar.

Generador de EditorConfig

Genera un archivo .editorconfig con tu estilo y tamaño de indentación, fin de línea, charset y reglas de espacios para un formato consistente en IDEs y editores.

Herramienta disponible en otros idiomas