# GitHub (/fr/components/github)

<!-- agent-signals: reading_time_min: 1 · est_tokens: 412 · updated: 2026-09-23 -->
Related: [Accordion](/fr/components/accordions.md), [Badge](/fr/components/badge.md), [Bannière](/fr/components/banner.md), [Encarts](/fr/components/callouts.md), [Cartes](/fr/components/cards.md), [Groupes de code](/fr/components/code-groups.md)

Utilisez le composant `<GitHub.Repo>` pour intégrer une carte qui renvoie vers un dépôt GitHub public. La carte récupère la description du dépôt, le nombre d'étoiles et de forks depuis l'API publique de GitHub au chargement de la page.

<div id="basic-repository-card">
  ## Carte de dépôt de base [#carte-de-dépôt-de-base]
</div>

Indiquez un dépôt sous la forme d'un slug `owner/name` ou d'une URL GitHub complète.

```mdx title="react"
<GitHub.Repo repo="mintlify/docs" />
```

<div id="variants">
  ## Variantes [#variantes]
</div>

Choisissez entre les mises en page `inset` et `flat` pour vous adapter à la page environnante.

<div id="inset">
  ### Inset [#inset]
</div>

La variante par défaut. Elle encapsule les détails du dépôt dans une surface intérieure arrondie.

```mdx
<GitHub.Repo repo="mintlify/docs" variant="inset" />
```

<div id="flat">
  ### Flat [#flat]
</div>

Une mise en page à surface unique avec un espacement plus resserré. Utilisez `flat` lorsque vous placez la carte à côté d'autres éléments avec bordure.

```mdx
<GitHub.Repo repo="mintlify/docs" variant="flat" />
```

<div id="properties">
  ## Propriétés [#propriétés]
</div>

<ResponseField name="repo" type="string">
  Le dépôt GitHub à afficher. Accepte un slug `owner/name` (par exemple, `mintlify/docs`) ou une URL GitHub complète (par exemple, `https://github.com/mintlify/docs`).
</ResponseField>

<ResponseField name="variant" type="string" default="inset">
  Mise en page de la carte.

  Options : `inset`, `flat`.
</ResponseField>

<ResponseField name="className" type="string">
  Classes CSS supplémentaires appliquées à la carte.
</ResponseField>