# Scroll Legend

> A sleek, interactive scroll legend component inspired by the elegant UI of Raycast. Built with accessibility and performance in mind, this component enhances user experience by providing clear visual guidance during scroll interactions. Fully responsive, theme-aware (light/dark), and easy to integrate into any React or Next.js project. Perfect for dashboards, documentation sites, or any interface where progressive scrolling needs a little extra magic.

- Author: [Taher  Hathi](https://21st.dev/@tahermaxse)
- License: unknown
- Live preview: https://21st.dev/@tahermaxse/components/scroll-legend

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/tahermaxse/scroll-legend?api_key=$API_KEY_21ST"
```

Requires a 21st API key (generate one at https://21st.dev/mcp) passed as `API_KEY_21ST`. Free accounts get a limited number of installs per day; unlimited on a paid plan — see https://21st.dev/pricing.

Full component directory: https://21st.dev/llms.txt