---
id: Empty state
section: components
cssPrefix: pf-v6-c-empty-state
propComponents: ['EmptyState', 'EmptyStateBody', 'EmptyStateFooter', 'EmptyStateActions']
---

import { useState } from 'react';
import CubesIcon from '@patternfly/react-icons/dist/esm/icons/cubes-icon';
import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';

## Examples
### Basic

```ts file="EmptyStateBasic.tsx"
```

### Extra small

```ts file="EmptyStateExtraSmall.tsx"
```

### Small

```ts file="EmptyStateSmall.tsx"
```

### Large

```ts file="EmptyStateLarge.tsx"
```

### Extra large

```ts file="EmptyStateExtraLarge.tsx"
```

### With status
```ts file="EmptyStateWithStatus.tsx"
```

### Spinner

```ts file="EmptyStateSpinner.tsx"
```

### No match found

```ts file="EmptyStateNoMatchFound.tsx"
```