> For AI agents: the complete documentation index is available at https://rspress.rs/llms.txt, the full documentation bundle is available at https://rspress.rs/llms-full.txt.

# HomeHero

This component is part of the [homepage](https://rspress.rs/guide/basic/home-page.md). `HomeHero` renders the Hero section on the homepage.

## Usage

Modify or override through [custom theme](https://rspress.rs/guide/basic/custom-theme.md).

```tsx
import { HomeHero as BasicHomeHero } from '@rspress/core/theme-original';

export default function HomeHero() {
  return <BasicHomeHero />;
}
```

The `HomeHero` component reads the `hero` configuration from frontmatter through [`useFrontmatter`](https://rspress.rs/ui/hooks/use-frontmatter.md). For detailed `hero` configuration options, refer to [Frontmatter Configuration](https://rspress.rs/api/config/config-frontmatter.md#hero).

### Custom slots

Use the `beforeHeroActions` and `afterHeroActions` props to insert custom content before and after the action buttons:

```tsx title="index.mdx"
import { HomeHero } from '@rspress/core/theme';

<HomeHero
  beforeHeroActions={<div>Content before buttons</div>}
  afterHeroActions={<div>Content after buttons</div>}
/>;
```

## Props

### beforeHeroActions

- **Type:** `React.ReactNode`

Custom content to insert before the Hero buttons.

### afterHeroActions

- **Type:** `React.ReactNode`

Custom content to insert after the Hero buttons.