Cómo previsualizar un README en Markdown antes de subirlo a GitHub

Q: ¿Cómo se previsualiza un README antes de subirlo a GitHub?

Pega el contenido de tu README.md en el editor de la herramienta de vista previa de Markdown, o impórtalo directamente desde tu ordenador. El panel de la derecha muestra al instante cómo se renderizarán los títulos, tablas, listas de tareas y bloques de código — así detectas errores de formato antes del commit, sin necesidad de subirlo primero a GitHub para comprobarlo.

Q: ¿Por qué mi tabla Markdown no se ve bien?

El error más común es olvidar la fila de separación (| --- | --- |) justo debajo del encabezado, o no dejar el mismo número de columnas en cada fila. Si una fila tiene menos barras verticales | que las demás, la tabla se rompe o se desalinea. Usa la vista previa en directo para ver el resultado real antes de guardar el archivo.

Q: ¿Cómo se marca una tarea como completada en una lista de tareas Markdown?

Escribe «- [ ] Tarea» para una tarea pendiente y «- [x] Tarea» (con una x minúscula entre corchetes) para una tarea completada. GitHub y esta herramienta la muestran como una casilla marcada. En la vista previa de esta página puedes incluso hacer clic sobre la casilla renderizada para alternar su estado.

Q: ¿Puedo convertir mi Markdown a un archivo HTML independiente?

Sí. Después de escribir o pegar tu Markdown, usa el botón «Descargar .html» para obtener un archivo HTML completo con el contenido ya renderizado, o «Copiar el HTML» para pegar solo el fragmento en un CMS o en un correo electrónico. Todo el proceso ocurre en tu navegador, sin subir el texto a ningún servidor.

Q: ¿Cómo añado una nota al pie en un artículo Markdown?

Coloca una referencia como [^1] en el punto del texto donde quieras la llamada, y en cualquier otro lugar del documento define su contenido con [^1]: tu explicación. La herramienta las numera automáticamente por orden de aparición y las agrupa en una sección «Notas al pie» al final de la vista previa, con enlaces de ida y vuelta.

Inicio > Blog > Cómo previsualizar un README en Markdown antes de subirlo a GitHub

Cómo previsualizar un README en Markdown antes de subirlo a GitHub

Si alguna vez has subido un README con una tabla rota o una lista de tareas mal formateada, sabes lo frustrante que es corregirlo a base de commits. Esta guía explica cómo comprobar el resultado exacto de tu Markdown — tablas, listas de tareas, notas al pie y bloques de código — antes de publicarlo, usando la vista previa en directo del navegador.

Por qué previsualizar antes de subir el README

Respuesta corta Previsualizar antes de subir evita el ciclo de «commit → revisar en GitHub → corregir → volver a subir». Al escribir el Markdown en un editor con vista previa en directo, ves de inmediato cómo se renderizarán los títulos, las tablas y las listas, y puedes corregir errores de sintaxis antes de que lleguen al repositorio.

Un README, una entrada de blog o unas notas de reunión escritas en Markdown parecen simples mientras las escribes, pero el resultado renderizado puede sorprender: un asterisco mal cerrado convierte medio párrafo en cursiva, una tabla sin la fila de separación no se muestra como tabla, o una lista numerada se reinicia porque falta una línea en blanco. Detectar esto en tu propio navegador — antes de hacer git push — ahorra idas y venidas.

La vista previa de Markdown de ToolPico muestra el resultado exacto mientras escribes, con soporte para la sintaxis GitHub Flavored Markdown (GFM) que usan los README, issues y pull requests: tablas, listas de tareas, texto tachado y bloques de código con resaltado de sintaxis.

Cómo evitar tablas Markdown rotas

Respuesta corta Una tabla GFM necesita tres partes: la fila de encabezado, una fila de separación con guiones (| --- | --- |) y las filas de datos, todas con el mismo número de columnas. Olvidar la fila de separación es el error más frecuente.

Por ejemplo, para documentar los campos aceptados por un formulario ficticio, una tabla bien formada se ve así (todos los valores son de ejemplo, no datos reales):

Campo	Tipo	Obligatorio
`nombre`	Texto	Sí
`email`	Texto	Sí
`edad`	Número	No

El código markdown correspondiente sería | Campo | Tipo | Obligatorio | en la primera línea, | --- | --- | --- | en la segunda, y después una línea por fila de datos. Si escribes esto en el editor de la herramienta, la tabla renderizada aparece al instante en el panel derecho — así confirmas la alineación de columnas antes de pegarla en tu README real.

Dato clave: los dos puntos en la fila de separación controlan la alineación — :--- alinea a la izquierda, :---: centra, y ---: alinea a la derecha.

Listas de tareas y notas al pie en Markdown

Respuesta corta Escribe - [ ] Tarea para una tarea pendiente o - [x] Tarea para una completada; para una nota al pie, usa [^1] en el texto y define [^1]: explicación en cualquier parte del documento.

Las listas de tareas (checklists) son habituales en README de proyectos para mostrar el estado de un roadmap: por ejemplo, una entrada de ejemplo podría listar «- [x] Configurar el repositorio», «- [x] Escribir los tests iniciales» y «- [ ] Publicar la versión 1.0». En la vista previa de esta herramienta puedes incluso hacer clic sobre la casilla renderizada para alternar su estado y ver cómo cambia el código markdown en el editor — útil para comprobar visualmente antes de fijar el estado real de cada tarea.

Las notas al pie son útiles en artículos que citan fuentes: en lugar de saturar el párrafo con paréntesis, colocas la referencia numerada y defines su contenido al final del documento. La herramienta numera las notas automáticamente por orden de aparición y las agrupa en una sección al final de la vista previa, con enlaces de ida y vuelta entre la llamada y la nota.

GitHub Flavored Markdown (GFM): la variante de Markdown usada por GitHub, que añade tablas, listas de tareas, texto tachado (~~texto~~) y detección automática de enlaces sobre la sintaxis estándar de Markdown. Los archivos README, issues y pull requests de GitHub están escritos en GFM.

Exportar el resultado a HTML o PDF

Respuesta corta Usa «Copiar el HTML» para pegar el fragmento renderizado en un CMS o correo electrónico, «Descargar .html» para un archivo independiente, o «Imprimir / PDF» para guardar la vista previa como documento PDF — todo desde el mismo navegador, sin subir el texto a ningún servidor.

Además del README, esta misma vista previa sirve para preparar una entrada de blog, unas notas de reunión o un documento que después quieras convertir a PDF para compartir con alguien que no usa Markdown. El botón «Imprimir / PDF» oculta el editor y la interfaz, dejando solo el contenido renderizado en el resultado — ideal para un documento limpio y legible.

Comprueba tu propio Markdown ahora

Pega tu README, entrada de blog o notas y mira la vista previa en directo — gratis, sin registro, en tu navegador.

Probar la herramienta →

Preguntas frecuentes

¿Cómo se previsualiza un README antes de subirlo a GitHub?

Pega el contenido de tu README.md en el editor de la herramienta de vista previa de Markdown, o impórtalo directamente desde tu ordenador. El panel de la derecha muestra al instante cómo se renderizarán los títulos, tablas, listas de tareas y bloques de código — así detectas errores de formato antes del commit, sin necesidad de subirlo primero a GitHub para comprobarlo.

¿Por qué mi tabla Markdown no se ve bien?

El error más común es olvidar la fila de separación (| --- | --- |) justo debajo del encabezado, o no dejar el mismo número de columnas en cada fila. Si una fila tiene menos barras verticales | que las demás, la tabla se rompe o se desalinea. Usa la vista previa en directo para ver el resultado real antes de guardar el archivo.

¿Cómo se marca una tarea como completada en una lista de tareas Markdown?

Escribe «- [ ] Tarea» para una tarea pendiente y «- [x] Tarea» (con una x minúscula entre corchetes) para una tarea completada. GitHub y esta herramienta la muestran como una casilla marcada. En la vista previa de esta página puedes incluso hacer clic sobre la casilla renderizada para alternar su estado.

¿Puedo convertir mi Markdown a un archivo HTML independiente?

Sí. Después de escribir o pegar tu Markdown, usa el botón «Descargar .html» para obtener un archivo HTML completo con el contenido ya renderizado, o «Copiar el HTML» para pegar solo el fragmento en un CMS o en un correo electrónico. Todo el proceso ocurre en tu navegador, sin subir el texto a ningún servidor.

¿Cómo añado una nota al pie en un artículo Markdown?

Coloca una referencia como [^1] en el punto del texto donde quieras la llamada, y en cualquier otro lugar del documento define su contenido con [^1]: tu explicación. La herramienta las numera automáticamente por orden de aparición y las agrupa en una sección «Notas al pie» al final de la vista previa, con enlaces de ida y vuelta.

Guías relacionadas

Nota sobre esta guía: los ejemplos numéricos y de contenido de esta página son ilustrativos, no datos reales de ningún proyecto. Esta guía es informativa y no sustituye la documentación oficial de Markdown o de GitHub Flavored Markdown.