> ## Documentation Index
> Fetch the complete documentation index at: https://product-guide-starter-mintlify-e6fe80ea.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# GitHub

> Embed a GitHub repository card that shows the description, stars, and forks.

Use the `GitHub.Repo` component to embed a live card for a GitHub repository. The card displays the repository name, description, star count, and fork count, and links to the repository on GitHub in a new tab.

<GitHub.Repo repo="mintlify/components" />

```mdx Example theme={null}
<GitHub.Repo repo="mintlify/components" />
```

Use `GitHub.Repo` when you want readers to discover a related open source project, such as an SDK, sample app, or starter template, without maintaining star and fork counts by hand.

## Reference the repository

Pass the repository as an `owner/repo` slug or as a full GitHub URL. Both of these render the same card:

```mdx Slug or URL theme={null}
<GitHub.Repo repo="mintlify/components" />

<GitHub.Repo repo="https://github.com/mintlify/components" />
```

## Layout variants

The component supports two layout variants:

* `inset`: The default. Renders the card content in a nested panel on a contrasting background.
* `flat`: Renders the card as a single flat panel with a plain border.

```mdx Flat variant theme={null}
<GitHub.Repo repo="mintlify/components" variant="flat" />
```

<GitHub.Repo repo="mintlify/components" variant="flat" />

## Loading and error behavior

The card fetches repository data from the public GitHub API in the reader's browser:

* While the request is in flight, the card shows skeleton placeholders for the description, stars, and forks.
* If the repository does not exist, or the `repo` value is not a valid slug or GitHub URL, the card renders in an error state with a "repo does not exist" message.
* If the GitHub API is unreachable, the card still renders the repository name as a link but hides the description and stats.

Results are cached per page load, so multiple cards for the same repository trigger only one request.

## Props

<ResponseField name="repo" type="string">
  The repository to display, as an `owner/repo` slug or a full GitHub URL.
</ResponseField>

<ResponseField name="variant" type="'inset' | 'flat'" default="inset">
  The layout variant of the card.
</ResponseField>
