Vista previa de Markdown
Edita el campo Markdown y observa cómo se actualiza el panel Preview. La herramienta parsea con marked (GFM y saltos de línea), sanea el HTML con DOMPurify y muestra estados como Preview updated.
Actualizado 2026-08-04 · developer
Empty preview
Sobre esta herramienta
Esta vista previa enlaza un textarea a HTML en vivo. La entrada vacía muestra Empty preview en cursiva. Los fallos de parseo vacían la vista y muestran Parse error con detalle. El ejemplo incluye encabezados, negrita, listas, enlaces, código en línea y un bloque con vallas para probar formato de inmediato.
Cómo usar
- Abrir el previsualizador: Carga esta página para ver el editor Markdown y el panel Preview.
- Editar Markdown: Cambia el Markdown de muestra o pega el tuyo en el campo Markdown.
- Ver la vista previa: El panel Preview se refresca al escribir; el estado pasa a Preview updated.
- Corregir errores de parseo: Si el estado muestra Parse error: …, ajusta el Markdown y sigue escribiendo.
Casos de uso
- Previsualizar Markdown estilo README antes de pegarlo en un repo o CMS.
- Comprobar listas, enlaces y bloques de código al redactar documentación.
- Confirmar el formato sin abrir un editor de escritorio.
Consejos
- El estado bajo la vista previa confirma cuándo termina o falla el render.
- La salida está saneada; úsala como ayuda de vista previa, no como pipeline CMS completo.
FAQ
¿Hace falta un botón Preview?
No. La vista previa se actualiza en vivo cuando cambia el Markdown.
¿Se admite Markdown con sabor GitHub?
El parseo usa opciones GFM y breaks para saltos de línea, adecuado a sintaxis README habitual.
¿Por qué se sanea el HTML?
DOMPurify reduce marcado arriesgado para que la vista previa en la página sea más segura.
¿Se sube mi Markdown?
El parseo corre en tu navegador mientras escribes; no necesitas cuenta.