GitHub
Open Github

Marquee

Infinite scrolling marquee component with customizable speed and direction.

Installation

pnpm dlx shadcn@latest add @spell/marquee

Examples

Pause on Hover

Vertical Scroll

Usage

import { Marquee } from "@/registry/spell-ui/marquee";
<Marquee>
  <div className="mx-6">Content 1</div>
  <div className="mx-6">Content 2</div>
  <div className="mx-6">Content 3</div>
</Marquee>

Props

PropTypeDefault
duration
number
20
pauseOnHover
boolean
false
direction
"left" | "right" | "up" | "down"
"left"
fade
boolean
true
fadeAmount
number
10
className
string
-
children
React.ReactNode
-