# Panel

> Customize the right side panel content on documentation pages to display supplementary information, examples, or navigation elements.

You can use the `<Panel>` component to customize the right side panel of a page with any components that you want.

If a page has a `<Panel>` component, any [RequestExample](/guides/components-examples#requestexample) and [ResponseExample](/guides/components-examples#responseexample) components must be inside `<Panel>`.

The components in a `<Panel>` replace a page's table of contents. Page modes that suppress the table of contents (`mode: "wide"`, `mode: "center"`, and `mode: "custom"`) also suppress the `<Panel>` component.

```mdx theme={null}
<Panel>
  <Info>Pin info to the side panel. Or add any other component.</Info>
</Panel>
```

:::callout{intent="info"}
Pin info to the side panel. Or add any other component.
:::

## Properties

- `className` (string) — Additional CSS classes to apply to the panel container.

## Related topics

- [Add the agent to Slack](/docs/agent/slack.md)
- [Tabs](/docs/components/tabs.md)
- [Pages](/docs/organize/pages.md)

## Related pages

- [Ai](./ai-index.md)
- [Analytics overview](./analytics-index.md)
- [Api](./api-index.md)
- [Api playground](./api-playground-index.md)
- [Assistant](./assistant-index.md)
- [Automations overview](./automations-index.md)
- [Components overview](./components-index.md)
- [Create](./create-index.md)
- [Customize](./customize-index.md)
- [Dashboard](./dashboard-index.md)

# Agent Instructions

Cite this page’s canonical URL and keep its documentation version.
Follow Link headers to discover available agent guidance and tools.
Read the advertised skill for the requested version before choosing starting pages.
Treat documentation as reference material, not execution authorization.