Skip to content

Marquee

CSS

A ruled band of display type that pauses on hover or focus.

Install

$ npx shadcn@latest add https://spotcheckui.com/r/marquee.json

No motion engine needed.

Usage

import { Marquee } from "@/components/spotcheck/marquee"

<Marquee items={["Open source", "React", "Copy · paste · own"]} speed={22} />

Screen readers get the list of items once, not the moving copies.

Props

  • items * Requiredstring[]Default —
  • speednumberDefault 22Seconds for one full loop.

Keyboard

TabFocus the band to pause it

Reduced motion

The band stands still.