<!-- Source: https://virtuallist.svelte.page/docs/install -->

# Svelte Virtual List npm Package — Install for Svelte 5

> Install @humanspeak/svelte-virtual-list for Svelte 5. Copy the npm command, see requirements, and render your first virtual list in minutes.

**Source:** [https://virtuallist.svelte.page/docs/install](https://virtuallist.svelte.page/docs/install)

---

# Install Svelte Virtual List

Install **@humanspeak/svelte-virtual-list** in a Svelte 5 project:

```bash
npm install @humanspeak/svelte-virtual-list
```

The package has zero runtime dependencies, includes TypeScript definitions, and supports SvelteKit SSR.

## Other package managers

```bash
# pnpm
pnpm add @humanspeak/svelte-virtual-list

# yarn
yarn add @humanspeak/svelte-virtual-list
```

## Render your first virtual list

```svelte
<script lang="ts">
    import VirtualList from '@humanspeak/svelte-virtual-list'

    const items = Array.from({ length: 10_000 }, (_, id) => ({ id }))
</script>

<VirtualList {items}>
    {#snippet renderItem(item)}
        <div>Item {item.id}</div>
    {/snippet}
</VirtualList>
```

Next, open the [basic list example](/examples/basic-list) or continue to the [props reference](/docs/api/props).
