Logos 47 - Cycling logo slots with cross-fades

Pro

Six hairline-framed logo slots that each cross-fade to a different customer logo on staggered timers, never showing the same logo twice.

Shadcn Logos 47 block

Component data

ID
logos47
Access
pro
Created
Oct 30, 2026
Type
block
Libraries
Radix UI, Base UI, React Aria

Logos 47 block design & features

The block shows more customers than it has room for. A centred heading and short description sit above six logo slots in a hairline grid.

Every interval one slot cross-fades to a logo that is not currently on screen, with a soft blur on the way out. The slots change in a staggered order that alternates between the two halves of the row, so neighbouring cells never swap one after another.

The animation runs on a single interval that is cleared on unmount, and it stays still for visitors who prefer reduced motion.

On mobile the slots reflow to three and then two columns, and the logos keep their optical sizes as they fade.