---
title: Markdown-It Kroki
parent: Markdown-It Plugins
created: 2025-09-09T19:23
updated: 2025-09-22T13:27
---

# markdown-it-kroki

> This library was designed to embed [Kroki.io](https://kroki.io/) diagram into [Marp](https://marp.app/) slide decks!!

This library is a plugin for markdown-it to embed figure created by textual syntax.
To use this package, you can embed **Software Diagram** (like UML) written by **code** in Marp slide decks.

## Sample

```

@startuml
left to right direction
actor Guest as g
package Professional {
actor Chef as c
actor "Food Critic" as fc
}
package Restaurant {
usecase "Eat Food" as UC1
usecase "Pay for Food" as UC2
usecase "Drink" as UC3
usecase "Review" as UC4
}
fc --> UC4
g --> UC1
g --> UC2
g --> UC3
@enduml

```

![alt text](pictures/plugin-kroki.png)

If you want to write diagrams, you can use various syntaxes (such as [PlantUML](https://plantuml.com/) or [Mermaid](https://mermaid-js.github.io/mermaid/#/)) within fenced code blocks.


> [!NOTE]  
> This package depends on [Kroki.io](https://kroki.io).   
> If you want to know which **diagram languages are supported**,
> please check the official website at [https://kroki.io/](https://kroki.io/).

## References

- [markdown-it-kroki](https://github.com/kazumatu981/markdown-it-kroki)