SoarStarter TanStack
Components

Callout

Display important messages and alerts.

Usage

A default callout with code and a link.

import { Callout } from 'fumadocs-ui/components/callout';

<Callout>
  A **default** callout with `code` and a [link](/).
</Callout>

With Title

Important Note

A callout with a custom title.

<Callout title="Important Note">
  A callout with a custom title.
</Callout>

Variants

An info callout with code and a link.

A warning callout with code and a link.

An error callout with code and a link.

<Callout type="info">
  An **info** callout.
</Callout>

<Callout type="warn">
  A **warning** callout.
</Callout>

<Callout type="error">
  An **error** callout.
</Callout>

Props

PropTypeDefault
titlestring-
type'info' | 'warn' | 'error''info'

On this page