# Markdown Extended Features

> Canonical: [https://kirari-main.vercel.app/posts/markdown-extended/](<https://kirari-main.vercel.app/posts/markdown-extended/>)

## GitHub Repository Cards
You can add dynamic cards that link to GitHub repositories, on page load, the repository information is pulled from the GitHub API.

[Fabrizz/MMM-OnSpotify](<https://github.com/Fabrizz/MMM-OnSpotify>)

Create a GitHub repository card with the code `::github{repo="<owner>/<repo>"}`.

```markdown
::github{repo="saicaca/fuwari"}
```

## GitHub File Cards
You can add dynamic cards that link to a specific file in a GitHub repository, on page load, the file metadata is pulled from the GitHub API.

[Theme overview](<https://github.com/saicaca/fuwari/blob/HEAD/README.md>)

Create a GitHub file card with the code `::githubfile{repo="<owner>/<repo>" file="path/to/file.ext"}`.

Optional parameters: `description` (string) and `path` (alias for `file`).

```markdown
::githubfile{repo="saicaca/fuwari" file="README.md" description="Theme overview"}
```
## Admonitions

Following types of admonitions are supported: `note` `tip` `important` `warning` `caution`

**NOTE**

Highlights information that users should take into account, even when skimming.

**TIP**

Optional information to help a user be more successful.

**IMPORTANT**

Crucial information necessary for users to succeed.

**WARNING**

Critical content demanding immediate user attention due to potential risks.

**CAUTION**

Negative potential consequences of an action.

### Basic Syntax

```markdown
:::note
Highlights information that users should take into account, even when skimming.
:::

:::tip
Optional information to help a user be more successful.
:::
```

### Custom Titles

The title of the admonition can be customized.

**NOTE**

[MY CUSTOM TITLE]
This is a note with a custom title.

```markdown
:::note[MY CUSTOM TITLE]
This is a note with a custom title.
:::
```

### GitHub Syntax

> [!TIP]
> [The GitHub syntax](<https://github.com/orgs/community/discussions/16925>) is also supported.

```
> [!NOTE]
> The GitHub syntax is also supported.

> [!TIP]
> The GitHub syntax is also supported.
```

## PlantUML

PlantUML diagrams can be written as fenced code blocks and rendered through the configured PlantUML server.

```plantuml
@startuml
actor Reader
participant KIRARI
participant "PlantUML Server" as Server

Reader -> KIRARI: Open markdown demo
KIRARI -> Server: Render plantuml block
Server --> KIRARI: Diagram image
KIRARI --> Reader: Enhanced article
@enduml
```

### Spoiler

You can add spoilers to your text. The text also supports **Markdown** syntax.

The content is hidden **ayyy**!

```markdown
The content :spoiler[is hidden **ayyy**]!

```