# Scroll Area Augments native scroll functionality for custom, cross-browser styling. [Docs](https://bits-ui.com/docs/components/scroll-area) [API Reference](https://bits-ui.com/docs/components/scroll-area#api-reference) ```svelte

Tags

{#each tags as tag (tag)}

{tag}

{/each}

``` ## Installation ```bash pnpm dlx shadcn-svelte@latest add scroll-area ``` ```bash npx shadcn-svelte@latest add scroll-area ``` ```bash bun x shadcn-svelte@latest add scroll-area ``` ## Usage ```svelte Jokester began sneaking into the castle in the middle of the night and leaving jokes all over the place: under the king's pillow, in his soup, even in the royal toilet. The king was furious, but he couldn't seem to stop Jokester. And then, one day, the people of the kingdom discovered that the jokes left by Jokester were so funny that they couldn't help but laugh. And once they started laughing, they couldn't stop. ``` ## Examples ### Horizontal Scrolling Set the `orientation` prop to `"horizontal"` to enable horizontal scrolling. ```svelte

{#each works as artwork (artwork.artist)}

{/each}

``` ### Horizontal and Vertical Scrolling Set the `orientation` prop to `"both"` to enable both horizontal and vertical scrolling. ```svelte

Jokester began sneaking into the castle in the middle of the night and leaving jokes all over the place: under the king's pillow, in his soup, even in the royal toilet. The king was furious, but he couldn't seem to stop Jokester. And then, one day, the people of the kingdom discovered that the jokes left by Jokester were so funny that they couldn't help but laugh. And once they started laughing, they couldn't stop.

```