# Markdoc tag library

This page contains a comprehensive list of Markdoc tags with links to deeper resources where you can see how to use them.

## Admonition

Use the Admonition tag to highlight important information.
Choose from multiple pre-defined types like info, warning, and success.

Additional information and syntax: [Admonition tag](/docs/realm/content/markdoc-tags/admonition)

**Example admonition element:**

Read this thing!
This tag is useful for drawing attention.

## Card and cards

Use the Cards tag to help users navigate your documentation by grouping information and links in a pre-built UI card.
Choose from several pre-defined styles and formats.

Additional information and syntax: [Card and cards tag](/docs/realm/content/markdoc-tags/cards)

**Example cards element:**

Card title
Add content *inside the card*.

Card title
Use links, Markdown, even other **Markdoc tags**.

## Code snippet

Use the Code Snippet tag to render a code sample from an external file in a configurable code block element.

Additional information and syntax: [Code Snippet tag](/docs/realm/content/markdoc-tags/code-snippet)

**Example code snippet element:**

museum-redocly.yaml
products:
  tickets:
    name: Museum Tickets
    icon: images/ticket-logo.png
    folder: products/tickets/
  events:
    name: Museum Events
    icon: ./images/event-logo.svg
    folder: ./products/events
navbar:
## Code walkthrough

Use code walkthroughs to interactively explain complex code examples to your users.
Code walkthroughs combine steps with explanatory text and downloadable code samples with interactive highlighting.
As users select different steps, the corresponding code from the code samples highlights, drawing their focus where you want it.

Additional information and syntax: [Code walkthrough tag](/docs/realm/content/markdoc-tags/code-walkthrough)

**Example code walkthrough element:**

A screenshot of the project using a single file and the smallest required configuration
## Image tag

Use the Image tag to embed images into your content with various customization options.

Additional information and syntax: [Image tag](/docs/realm/content/markdoc-tags/img)

**Example image element:**

Basic example image
## Inline SVG

Use the inline SVG tag to render an SVG element inline with your writing.

Additional information and syntax: [Inline SVG tag](/docs/realm/content/markdoc-tags/inline-svg)

**Example inline SVG element:**

.

## JSON Schema

Use the JSON Schema tag to render an existing or inline schema in a configurable, readable layout.

Additional information and syntax: [JSON Schema tag](/docs/realm/content/markdoc-tags/json-schema)

**Example JSON schema element:**

## Markdoc example

Use the Markdoc example tag to display Markdoc syntax simultaneously with the rendered output, separated by introductory text that can be removed or customized.

Additional information and syntax: [Markdoc example tag](/docs/realm/content/markdoc-tags/markdoc-example)

**Example Markdoc example element:**


```markdown about.md
{% admonition type="warning" name="Important" %}
  This is an important message about this product.
{% /admonition %}
```

## OpenAPI code sample

Use the OpenAPI code sample tag to render a code sample for an API operation from an OpenAPI description.

Additional information and syntax: [OpenAPI code sample tag](/docs/realm/content/markdoc-tags/openapi-code-sample)

## Partial

Use the Partial tag to render the content from another file.

Additional information and syntax: [Partial tag](/docs/realm/content/markdoc-tags/partial)

## Replay OpenAPI

Use the Replay OpenAPI tag to allow users to send live calls to your API.

Additional information and syntax: [Replay OpenAPI tag](/docs/realm/content/markdoc-tags/replay-openapi)

**Example Replay OpenAPI element:**

## Table

Use the Table tag to create tables using a list-based syntax that allows for easy injection of rich content, like bulleted lists and code samples.

Additional information and syntax: [Table tag](/docs/realm/content/markdoc-tags/table)

**Example table element:**

| Heading 1 | Heading 2 |
|  --- | --- |
| Row 1 Cell 1 | Row 1 Cell 2 |
| Row 2 Cell 1 | Row 2 cell 2 |


## Tabs

Use the tabs tag to organize content into a series of tabs that users can switch between.

Additional information and syntax: [Tabs tag](/docs/realm/content/markdoc-tags/tabs)

**Example tabs tag element:**

Fruits
- Tomato (it's both!)
- Blueberry
- Kiwi
- Banana


Vegetables
- Tomato (it's both!)
- Broccoli
- Spinach
- Asparagus