When embedding model and sequence diagrams in documents, you can use images created with Draw.io, but it is easier if you can specify them in code, so we will create an environment for using PlantUML.

Since documents are often created in Markdown, it is assumed that PlantUML will be embedded in Markdown.

Markdown Extension

Markdown All in One extension is helpful to write a markdown. It's not necessary if you're not using it.

Markdown All in One - Visual Studio Marketplace

Setup PlantUML

Install PlantUML extension and write settings.json to render in the markdown preview.

PlantUML - Visual Studio Marketplace

{
  "plantuml.render": "PlantUMLServer",
  "plantuml.server": "https://www.plantuml.com/plantuml"
}

Here, an external server is specified in plantuml.server, but it is recommended to use a local server because large-size diagrams will cause errors. The PlantUML local server runs on Docker.

See the following article for details.

Use PlantUML Server as Render

How to write PlantUML

You can insert a diagram by specifying plantuml as the language, as if you were writing code in Markdown.

```plantuml
@startuml
Alice -> Bob : Hello
@enduml
```

The following is an image of this output.