---
title: Diagramas de Mermaid
slug: docs/es/diagramas-de-mermaid
createdAt: 2026-06-05T12:56:34.018Z
---

[Diagramas Mermaid](docId\:QU3rmnUwC_agy-Ovj0ezj)  le permiten crear diagramas y visualizaciones directamente desde texto. Son útiles para documentar flujos de trabajo, procesos, arquitecturas e interacciones sin depender de imágenes.

## Sintaxis

Los diagramas Mermaid utilizan la sintaxis estándar de bloques de código delimitados.

````markdown
```mermaid
sequenceDiagram
    A->>B: message
```
````

## Ejemplos

El siguiente ejemplo crea un diagrama de secuencia que ilustra un flujo de solicitud de API.

````markdown
```mermaid
sequenceDiagram
    autonumber
    participant C as Client
    participant A as API
    participant K as Cache
    participant D as DB

    C->>+A: GET /users/123
    A->>+K: lookup user:123
    alt cache hit
        K-->>A: cached user
    else cache miss
        K-->>A: null
        A->>+D: SELECT * FROM users WHERE id=123
        D-->>-A: user row
        A->>K: SET user:123
    end
    A-->>-C: 200 OK
```
````

El siguiente ejemplo crea un diagrama de flujo.

````markdown
```mermaid
flowchart TD
    A[Start] --> B{Is config valid?}
    B -->|Yes| C[Load docs]
    B -->|No| D[Show error]
    C --> E[Start server]
    E --> F[Open browser]
    D --> G[Exit]
```
````