---
title: Encadrés
slug: docs/fr/encadres
createdAt: 2026-06-05T12:32:42.012Z
---

[Avertissement](docId\:OL_gxdn7xBLaPFqLQ3n-7) les blocs mettent en évidence des informations importantes à l’aide de conteneurs colorés. Ils sont utiles pour afficher des astuces, des confirmations, des avertissements et des avis critiques.

## Syntaxe

Vous pouvez ajouter ce composant en utilisant soit Markdown soit MDX.

::::Tabs
:::Tab{title="Markdown"}
```markdown
:::::hint{type="info"}
Votre contenu ici.
:::
```
:::

:::Tab{title="MDX"}
```javascript
<hint type="info">
Votre contenu ici.
</hint>
```
:::
::::

Les encadrés prennent en charge les types suivants :

- `infos`
- `succès`
- `avertissement`
- `danger`

## Exemple MDX

L’exemple suivant crée quatre types d’encadrés différents.

```html
<hint type="info">
Use **info** callouts for helpful tips and additional context.
</hint>

<hint type="success">
Use **success** callouts for positive outcomes or confirmations.
</hint>

<hint type="warning">
Use **warning** callouts for things users should be careful about.
</hint>

<hint type="danger">
Use **danger** callouts for critical warnings or destructive actions.
</hint>
```