# Mouse Spark

> The MouseSpark component is a visually appealing, interactive cursor particle effect for web applications. It automatically adjusts to light and dark themes, seamlessly blending with white or black backgrounds. When the user moves their mouse, colorful particles are spawned at the cursor position, leaving smooth, fading trails that create a dynamic, sparkling effect. The component is fully responsive, covering the entire viewport and adapting to window resizing, while remaining non-intrusive with pointer-events disabled so it doesn’t interfere with user interactions. Designed for elegance and performance, it continuously removes old particles to ensure smooth animation, providing a modern and engaging visual enhancement for websites or applications without requiring any props or configuration.

- Author: [Ruixen UI](https://21st.dev/@ruixen.ui)
- Library: [Ruixen UI](https://21st.dev/@ruixen.ui/library/ruixen-ui)
- License: unknown
- Live preview: https://21st.dev/@ruixen.ui/components/mouse-spark

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/ruixen.ui/mouse-spark?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
