---
title: React Callout Component
name: Callout
description: React callout component provides presentation of content in a visually distinct manner. Includes a heading, icon and typically text-based content.
route: /components/callout/
other_frameworks: callout
---

## Examples

Callout component is prepared for any length of text, as well as an optional elements like icons, headings, etc. For a styling, use one of the **required** contextual props (e.g., `color="success"`).

<ExampleSnippet component="CalloutExample" componentName="React Callout" />

<Callout color="warning" type="colorAssistiveTechnologies" />

## API

Check out the documentation below for a comprehensive guide to all the props you can use with the components mentioned here.

- [&lt;CCallout /&gt;](./api/#ccallout)
