# Callout

Edit callouts, notes, tips, warnings, and alerts for Astro Starlight, Fumadocs, and Prosefly documentation.

import ContentEditor from '@/components/editor/ContentEditor.astro';

Use Prosefly’s MDX component editor to edit callouts while keeping the syntax used by your Astro, Starlight, Fumadocs, or Prosefly site.

## Supported profiles

The same editor supports the [Astro](/frameworks/astro/), [Starlight](/frameworks/starlight/), [Fumadocs](/frameworks/fumadocs/), and [Prosefly](/frameworks/lotus/) profiles. Select the profile that matches your site to see the component syntax and controls available for that integration.

## Edit in Visual

Insert a Callout from `/` when it is available in the Collection profile, or select an existing callout. Edit the body directly. Its controls let you change the supported type and title; icon controls appear where the profile supports them.

<ContentEditor content="callout" />

## Source example

```mdx
import { Aside } from '@astrojs/starlight/components';

## Review before publishing

<Aside type="caution" title="Check the file diff">
  Confirm the changed content before publishing the page.
</Aside>
```

## Profile differences

| Profile   | Supported form                                            |
| --------- | --------------------------------------------------------- |
| Starlight | Aside components and note/tip/caution/danger directives   |
| Fumadocs  | Callout components with Fumadocs type values              |
| Prosefly  | Callout components and note/tip/warning/danger directives |

For example, Starlight uses `caution` where Prosefly uses `warning`. Use the values offered by the selected profile rather than copying properties between libraries. Expressions or custom callout components without a visual control remain editable in Source.

## Related MDX guides

Read next: [Accordion](/docs/editor/components/accordion/) · [Tabs](/docs/editor/components/tabs/) · [Steps](/docs/editor/components/steps/).