React Logos Metric Over Dual Row Logos Block

A hero metric over dual opposing marquees for React and Next.js with an oversized tabular-nums count, two infinite scrolling logo rows in opposing directions, gradient edge masks, and a reduced-motion CSS guard built with shadcn/ui and Tailwind CSS

Anchor your social proof with an oversized number and two rows of drifting customer marks in this metric over dual row logos block for React and Next.js. Features a centered hero metric at text-6xl to text-7xl with tabular-nums, two opposing infinite marquee rows with unique keyframe names to avoid CSS collisions, left and right gradient edge masks, and a prefers-reduced-motion CSS guard. Built with TypeScript, motion/react parent entrance and useReducedMotion, Lucide React icon marks paired with invented placeholder wordmarks, and Tailwind CSS theme variables. Perfect for high-energy social-proof bands, under-hero trust sections, and landing pages that need both a single headline number and breadth of brands.

Logos Metric Over Dual Row Logos

React Logos Metric Hero Strip Block

React Logos Dual Row Marquee Block

React Logos Single Row Marquee Block

React Logos Metric Trio With Logo Strip Block

React Logos Metric Dark Variant Block

React Logos Dual Marquee With Metric Divider Block

FAQ

Logos Metric Over Dual Row Logos

Related Components

React Logos Metric Hero Strip Block

React Logos Dual Row Marquee Block

React Logos Single Row Marquee Block

React Logos Metric Trio With Logo Strip Block

React Logos Metric Dark Variant Block

React Logos Dual Marquee With Metric Divider Block

FAQ

How do I customize the hero metric and label?

How do I add or remove logos from the marquees?

Is the dual marquee accessible and motion friendly?

How does the block adapt to mobile and tablet?

How do I replace the Lucide icon marks with real brand logos?

When should I use this versus a pure dual row marquee?