ASCII Mermaid Guideline

Learn the basics of creating ASCII Mermaid diagrams. This guide covers the most commonly used diagram types with simple examples.

Basic Flowchart

Flowcharts are one of the most common diagram types. They represent processes and decision flows.

Code:

graph TD
    A[Start] --> B{Decision}
    B -->|Yes| C[Action]
    B -->|No| D[End]
    C --> D

ASCII Preview:

Failed to render diagram

State Diagram

State diagrams show the different states of a system and transitions between them.

Code:

stateDiagram-v2
    [*] --> Idle
    Idle --> Processing: start
    Processing --> Complete: done
    Complete --> [*]

ASCII Preview:

Failed to render diagram

Sequence Diagram

Sequence diagrams illustrate interactions between objects over time.

Code:

sequenceDiagram
    Alice->>Bob: Hello Bob!
    Bob-->>Alice: Hi Alice!
    Alice->>Bob: How are you?
    Bob-->>Alice: Great, thanks!

ASCII Preview:

Failed to render diagram

Class Diagram

Class diagrams represent object-oriented system structures. They show classes with their attributes and methods, inheritance relationships (using <|--), and associations.

Code:

classDiagram
    Animal <|-- Duck
    Animal <|-- Fish
    Animal: +int age
    Animal: +String gender
    Animal: +isMammal() bool
    Animal: +mate()
    Duck: +String beakColor
    Duck: +swim()
    Duck: +quack()
    Fish: -int sizeInFeet
    Fish: +canEat()
    Fish: +swim()

ASCII Preview:

Failed to render diagram

Entity Relationship Diagram

ER diagrams model database structures showing entities (tables), their attributes (columns), and relationships between them.

Code:

erDiagram
    CUSTOMER ||--o{ ORDER : places
    ORDER ||--|{ LINE_ITEM : contains
    PRODUCT ||--o{ LINE_ITEM : "is in"
    CUSTOMER {
        string name
        string email
        int phone
    }
    ORDER {
        int orderNumber
        date orderDate
    }
    PRODUCT {
        string productCode
        string description
        float price
    }

ASCII Preview:

Failed to render diagram

Want to Try It Out?

Try creating your own ASCII Mermaid diagrams using our interactive tool.

Go to ASCII Mermaid Tool →