Shadcn.io is not affiliated with official shadcn/ui
Logos Single Marquee Slow Sixty Second
A calm single row logo marquee for React and Next.js with a slow sixty second loop duration, fourteen placeholder brand marks, subdued muted-foreground default color, gradient edge masks, and a prefers-reduced-motion CSS guard built with shadcn/ui and Tailwind CSS
Slow the tempo of social proof with a calm single row logo marquee for React and Next.js running on a sixty second loop. Features fourteen invented brand marks each rendered as an icon-plus-wordmark pair at a deliberate pace that reads as considered rather than frenetic, a subdued text-muted-foreground slash eighty default color that promotes to full foreground on hover, gradient edge masks on both sides of the row, and a prefers-reduced-motion media query that disables the animation and translate transform for vestibular-sensitive users. Built with TypeScript, motion/react parent entrance with useReducedMotion, Lucide React icon marks paired with invented placeholder wordmarks, module-scope doubled arrays for seamless looping, and Tailwind CSS theme variables. Perfect for editorial landing pages, premium brand sites, and any section where the calm pace of the marquee reinforces a message of considered craftsmanship.
Related Components
React Logos Single Row Marquee Block
A single row infinite marquee logo wall
React Logos Single Marquee Icon Only Block
An icon-only marquee variant
React Logos Single Marquee Bordered Chips Block
A bordered chip marquee variant
React Logos Dual Marquee Fast Slow Speeds Block
A dual marquee with contrasting speeds
React Logos Dual Row Marquee Block
A dual row opposing marquee logo wall
React Logos Under Hero Minimalist Strip Block
A quiet under-hero logo strip
FAQ
Was this page helpful?
Sign in to leave feedback.
Single Marquee Reverse Direction
A right-scrolling single row marquee logo wall for React and Next.js with reversed keyframe direction, gradient edge masks, monochrome-to-color hover promotion, and a fifty second loop built with shadcn/ui and Tailwind CSS
Single Marquee With Eyebrow Left
A horizontal split layout with a left-aligned trust eyebrow and a single row marquee filling the remaining width for React and Next.js with right-side gradient edge mask and reduced-motion guards built with shadcn/ui and Tailwind CSS