# Callout

A callout can be used to attract attention to important information on your page.

## Examples

{% code overflow="wrap" %}

```
[bsv-callout style="info" heading="My Callout"]This is important information[/bsv-callout]
```

{% endcode %}

<figure><img src="https://2850223474-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOT4oO0pn3LrvJLuVbRqg%2Fuploads%2Fgit-blob-ab7075058663284befa54bbd57ea4b4eac9d04d3%2Fscreenshot-callout-1.png?alt=media" alt=""><figcaption></figcaption></figure>

{% code overflow="wrap" %}

```
[bsv-callout style="danger" heading="My Callout"]This is important information[/bsv-callout]
```

{% endcode %}

<figure><img src="https://2850223474-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOT4oO0pn3LrvJLuVbRqg%2Fuploads%2Fgit-blob-2a2786dc667a67c340586da74c1b5c42b3db3876%2Fscreenshot-callout-2.png?alt=media" alt=""><figcaption></figcaption></figure>

## Format

{% code overflow="wrap" %}

```
[bsv-callout parameter="value" ...]your content here[/bsv-callout]
```

{% endcode %}

## Parameters

| Parameter | Description                                                                                                                                | Value      |
| --------- | ------------------------------------------------------------------------------------------------------------------------------------------ | ---------- |
| style     | <p>Defines the Bootstrap style. Supported values:</p><ul><li>danger</li><li>info</li><li>primary</li><li>success</li><li>warning</li></ul> | primay     |
| heading   | A heading if you want one                                                                                                                  | *no value* |