flowchart
   node
   rounded(rounded)
   id1([This is the text in the box])
   id2((circle))
   id3(((double circle)))
   id4>Asymetrical]
   id5{This is the text in the box}
   id6{{This is the text in the box}}
   id7[/This is the text in the box/]
   id8[\This is the text in the box\]
   A[/Christmas\]
   B[\Christmas/]
   sub[[subroutine]]
   db[(Database)]
    

      

---
config: 
      theme: default
      look: classic
---
flowchart
   node
   rounded(rounded)
   id1([This is the text in the box])
   id2((circle))
   id3(((double circle)))
   id4>Asymetrical]
   id5{This is the text in the box}
   id6{{This is the text in the box}}
   id7[/This is the text in the box/]
   id8[\This is the text in the box\]
   B[/Christmas\]
   sub[[subroutine]]
   db[(Database)]
    

            

      

stateDiagram
    [*] --> Active
    Active --> Inactive
    Inactive --> Active
    Active --> [*]
    

flowchart
   a_a(Aftonbladet) --> b_b[gorilla]:::apa --> c_c{chimp}:::apa -->a_a
        a_a --> c --> d_d --> c_c
        classDef apa fill:#f9f,stroke:#333,stroke-width:4px;
        class a_a apa;
        click a_a "http://www.aftonbladet.se" "bookmark"
        click c_c callback "new tooltip"
      

flowchart LR
    id1(Start)-->id2(Stop)
    style id1 fill:#f9f,stroke:#333,stroke-width:4px
    style id2 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5

      
    

      flowchart LR
    A:::foo & B:::bar --> C:::foobar
    classDef foo stroke:#f00
    classDef bar stroke:#0f0
    classDef ash color:red
    class C ash
    style C stroke:#00f, fill:black

    

      stateDiagram
    A:::foo 
    B:::bar --> C:::foobar
    classDef foo stroke:#f00
    classDef bar stroke:#0f0
    style C stroke:#00f, fill:black, color:white