Cheat Sheet completa de Markdown

28 oct 2025

Esta cheat sheet de Markdown es tu guía de referencia rápida para dominar el lenguaje de marcado más popular. Desde formato básico hasta elementos avanzados, aquí encontrarás todo lo esencial con ejemplos claros y visuales.

Encabezados

Los encabezados crean jerarquía visual en tus documentos usando el símbolo #.

# Encabezado 1 (H1)

## Encabezado 2 (H2)

### Encabezado 3 (H3)

#### Encabezado 4 (H4)

##### Encabezado 5 (H5)

###### Encabezado 6 (H6)

Resultado:

Encabezado 1 (H1)

Encabezado 2 (H2)

Encabezado 3 (H3)

Encabezado 4 (H4)

Encabezado 5 (H5)

Encabezado 6 (H6)

Formato de texto

Aplica estilos visuales a tu contenido para enfatizar información importante.

**Texto en negrita**
_Texto en cursiva_
**_Texto en negrita y cursiva_**
~~Texto tachado~~
`Código inline`
++Texto subrayado++ (extensión)
==Texto destacado== (extensión)

Resultado:

Texto en negrita
Texto en cursiva
Texto en negrita y cursiva
~~Texto tachado~~
Código inline
++Texto subrayado++
==Texto destacado==

Párrafos y saltos de línea

Controla el espaciado y la estructura de tu contenido.

Este es un párrafo normal.

Este es otro párrafo separado por una línea en blanco.

Para un salto de línea simple,  
agrega dos espacios al final de la línea.

---

Para crear una línea horizontal usa tres guiones.

Listas

Organiza información de manera clara y estructurada.

<!-- Lista desordenada -->
- Elemento 1
- Elemento 2
  - Sub-elemento 2.1
  - Sub-elemento 2.2
- Elemento 3

<!-- Lista ordenada -->
1. Primer elemento
2. Segundo elemento
  1. Sub-elemento ordenado
  2. Otro sub-elemento
3. Tercer elemento

<!-- Lista de tareas -->
- [x] Tarea completada
- [ ] Tarea pendiente
- [ ] Ot

## Enlaces

Conecta tu contenido con recursos externos o internos.

```markdown
<!-- Enlace básico -->

[Texto del enlace](https://ejemplo.com)

<!-- Enlace con título -->

[Enlace con tooltip](https://ejemplo.com "Título del enlace")

<!-- Enlace de referencia -->

[Texto del enlace][referencia]

[referencia]: https://ejemplo.com "Título opcional"

<!-- Enlace automático -->

https://ejemplo.com

<!-- Enlace de email -->

<correo@ejemplo.com>

<!-- Enlaces internos -->

[Ir a la sección de imágenes](#imágenes)

Imágenes

Incluye elementos visuales en tu documentación.

<!-- Imagen básica -->

![Texto alternativo](ruta/imagen.jpg)

<!-- Imagen con título -->

![Alt text](ruta/imagen.jpg "Título de la imagen")

<!-- Imagen de referencia -->

![Alt text][logo]

[logo]: ruta/logo.png "Título del logo"

<!-- Imagen como enlace -->

[![Alt text](ruta/imagen.jpg)](https://ejemplo.com)

<!-- Imagen con HTML (más control) -->
<img src="ruta/imagen.jpg" alt="Descripción" width="300" height="200">

Ejemplo de sintaxis:

![Logo de Markdown](https://markdown-here.com/img/icon256.png "Logo oficial")

Citas

Destaca texto importante o referencias de otros autores.

> Esta es una cita simple.

> Esta es una cita
> en múltiples líneas
> que se ve muy bien.

> Cita anidada
>
> > Cita dentro de otra cita
> >
> > > Y otra más profunda

> **Autor:** Albert Einstein
>
> "La imaginación es más importante que el conocimiento."

Resultado:

Esta es una cita simple.

Esta es una cita en múltiples líneas que se ve muy bien.

Cita anidada

Cita dentro de otra cita

Y otra más profunda

Bloques de código

Muestra código de manera clara y legible.

<!-- Código inline -->

Usa la función `console.log()` para imprimir en consola.

<!-- Bloque de código con lenguaje -->

```javascript
const nombre = "JavaScript";
console.log(`¡Hola ${nombre}!`);
```

Tablas

Presenta datos de forma organizada y estructurada.

<!-- Tabla básica -->

| Columna 1 | Columna 2 | Columna 3 |
| --------- | --------- | --------- |
| Fila 1    | Dato A    | Dato B    |
| Fila 2    | Dato C    | Dato D    |

<!-- Tabla con alineación -->

| Izquierda | Centrado | Derecha |
| :-------- | :------: | ------: |
| Texto     |  Texto   |   Texto |
| Más texto |   Más    |     Más |

<!-- Tabla con formato -->

| Elemento | **Negrita** | _Cursiva_ | `Código` |
| -------- | ----------- | --------- | -------- |
| Ejemplo  | **Texto**   | _Texto_   | `var x`  |

Resultado:

Columna 1	Columna 2	Columna 3
Fila 1	Dato A	Dato B
Fila 2	Dato C	Dato D

HTML integrado

Combina Markdown con HTML para mayor flexibilidad.

<!-- Elementos HTML básicos -->

<strong>Texto en negrita con HTML</strong>

<em>Texto en cursiva con HTML</em>

<mark>Texto destacado</mark>

<del>Texto eliminado</del>

<ins>Texto insertado</ins>

<!-- Contenedores con clases -->
<div class="mi-clase">
Contenido con clase CSS personalizada
</div>

<!-- Salto de línea forzado -->

Primera línea<br>
Segunda línea

<!-- Comentarios HTML -->
<!-- Este comentario no se mostrará -->

Caracteres de escape

Muestra caracteres especiales literalmente.

<!-- Escapar caracteres especiales -->

\* No es cursiva \*
\# No es encabezado
\[No es enlace\]
\`No es código\`

<!-- Mostrar backslashes -->

\\Backslash literal\\

<!-- Otros caracteres especiales -->

\! \@ \# \$ \% \^ \& \* \( \) \_ \+ \= \{ \} \| \[ \] \: \; \" \' \< \> \, \. \? \/

Resultado:

* No es cursiva *
# No es encabezado
[No es enlace]
`No es código`

Elementos avanzados

Funcionalidades adicionales para casos específicos.

<!-- Notas al pie -->

Este texto tiene una nota al pie[^1].

[^1]: Esta es la nota al pie.

<!-- Abreviaciones -->

_[HTML]: HyperText Markup Language
_[CSS]: Cascading Style Sheets

HTML y CSS son tecnologías web.

<!-- Definición de términos -->

Término
: Definición del término
: Otra definición del mismo término

<!-- Elementos colapsables (GitHub) -->
<details>
<summary>Haz clic para expandir</summary>

Contenido oculto que se puede mostrar/ocultar.

```javascript
console.log("Código dentro de detalles");
```

</details>

<!-- Alertas (GitHub/extensiones) -->

> **Note**
> Esta es una nota importante.

> **Warning**
> Esta es una advertencia.

---

## Matemáticas (extensiones)

Incluye fórmulas matemáticas usando LaTeX.

```markdown
<!-- Matemáticas inline -->

La fórmula $E = mc^2$ es famosa.

<!-- Bloque de matemáticas -->

$$
\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n
$$

<!-- Ecuación compleja -->

$$
\begin{aligned}
f(x) &= ax^2 + bx + c \\
&= a(x^2 + \frac{b}{a}x) + c \\
&= a(x + \frac{b}{2a})^2 - \frac{b^2}{4a} + c
\end{aligned}
$$
```

Emojis y símbolos

Añade expresividad visual a tu contenido.

<!-- Emojis con códigos -->

:smile: :heart: :thumbsup: :rocket: :fire: :100:

<!-- Emojis Unicode directos -->

😀 💖 👍 🚀 🔥 💯

<!-- Símbolos especiales -->

© ® ™ § ¶ † ‡ • ‰ ′ ″ ‴ ※ ‼ ⁇ ◊ ♠ ♣ ♥ ♦

<!-- Flechas y símbolos matemáticos -->

→ ← ↑ ↓ ↔ ⇒ ⇐ ⇑ ⇓ ⇔
≠ ≤ ≥ ± ∞ π α β γ δ ε

Metadatos y front matter

Configura propiedades del documento (dependiente del procesador).

---
title: "Título del documento"
author: "Nombre del autor"
date: "2025-10-22"
tags: ["markdown", "documentación"]
categories: ["tutoriales"]
description: "Descripción del contenido"
---

# Contenido del documento

El front matter va al inicio del archivo y define metadatos.

Mejores prácticas

Consejos para escribir Markdown efectivo y mantenible.

<!-- ✅ BUENAS PRÁCTICAS -->

<!-- Usar líneas en blanco para separar elementos -->

## Encabezado

Párrafo de contenido.

- Lista item 1
- Lista item 2

<!-- Ser consistente con la sintaxis -->

**Negrita** (no **negrita**)
_Cursiva_ (no _cursiva_)

<!-- Usar enlaces descriptivos -->

[Descargar la documentación oficial](https://ejemplo.com)

<!-- No: [Haz clic aquí](https://ejemplo.com) -->

<!-- Añadir texto alternativo a imágenes -->

![Diagrama del proceso de desarrollo](imagen.png)

<!-- Usar encabezados jerárquicos -->

# H1 - Solo uno por documento

## H2 - Secciones principales

### H3 - Subsecciones

<!-- ❌ EVITAR -->
<!-- No saltar niveles de encabezados -->

# H1

### H3 (❌ Saltó H2)

<!-- No usar demasiados niveles de anidación -->

- Nivel 1
  - Nivel 2
    - Nivel 3
      - Nivel 4 (❌ Demasiado profundo)

Herramientas y extensiones

Ecosistema para trabajar con Markdown de forma eficiente.

<!-- EDITORES POPULARES -->

- **Visual Studio Code** - Extensión "Markdown All in One"
- **Typora** - Editor WYSIWYG para Markdown
- **Mark Text** - Editor en tiempo real
- **Obsidian** - Para notas y conocimiento
- **Notion** - Incluye soporte Markdown

<!-- PROCESADORES COMUNES -->

- **CommonMark** - Especificación estándar
- **GitHub Flavored Markdown (GFM)** - Con tablas y listas de tareas
- **Markdown Extra** - Con tablas, notas al pie y más
- **MultiMarkdown** - Con metadatos y referencias cruzadas

<!-- HERRAMIENTAS EN LÍNEA -->

- **Dillinger** - Editor Markdown online
- **StackEdit** - Editor con sincronización en la nube
- **Markdown Live Preview** - Vista previa en tiempo real
- **Tables Generator** - Generador de tablas Markdown

Compatibilidad

Diferencias entre procesadores de Markdown más comunes.

<!-- FUNCIONALIDADES UNIVERSALES (✅ Soportado en todos) -->

# Encabezados

**Negrita** y _cursiva_
[Enlaces](url)
![Imágenes](url)

- Listas
  > Citas
  > `Código`

<!-- GITHUB FLAVORED MARKDOWN (GFM) -->

| Tablas | Support |
| ------ | ------- |
| ✅     | Sí      |

- [x] Listas de tareas
      ~~Texto tachado~~

```javascript
Bloques de código con sintaxis
```

<!-- EXTENSIONES COMUNES -->

[^1]:
    Notas al pie (no todos)
    ==Texto destacado== (algunos)
    $LaTeX$ matemáticas (algunos)

<!-- ELEMENTOS HTML -->

<details>Detalles colapsables</details> (GitHub, algunos)
<mark>Texto marcado</mark> (algunos) ```

---

## 🎯 Resumen

Esta cheat sheet de Markdown cubre todo lo esencial para crear documentación profesional:

- **Formato básico** - Encabezados, texto y párrafos
- **Estructura** - Listas, enlaces e imágenes
- **Organización** - Tablas, citas y bloques de código
- **Elementos avanzados** - HTML, matemáticas y metadatos
- **Mejores prácticas** - Consejos para Markdown mantenible

¡Markdown es simple pero poderoso. Con estos elementos puedes crear desde documentación técnica hasta blogs completos de forma rápida y eficiente!