Press & Awards
Logo clouds
Source and install need .
pnpm dlx shadcn@latest add @assembli/logo-cloud-switchLogo Cloud Switch
A row of six logos that hands over to the next set every few seconds, slot by slot, each mark blurring out as the next rises in. A segmented filter narrows the cloud by industry, and a pause button with a countdown ring stops the rotation. Hover or focus also holds it, the row never changes height, and reduced motion gets a static set.
Props
Other props pass through to the root element.
logos*
SwitchLogo[]
groups*
{ id: string; label: string }[]
Filters shown after "All", in order. Each
idmatches a logo'sgroup.allLabel
string
Default
"All"Label of the first filter, which shows every logo.
eyebrow
React.ReactNode
Small line above the controls.
perView
3 | 6
Default
6Logos visible at once: six in a row on wide screens, two rows of three on phones.
interval
number
Default
3600Milliseconds each set stays up.
| Prop | Type | Default | Description |
|---|---|---|---|
| logos* | SwitchLogo[] | – | |
| groups* | { id: string; label: string }[] | – | Filters shown after "All", in order. Each id matches a logo's group. |
| allLabel | string | "All" | Label of the first filter, which shows every logo. |
| eyebrow | React.ReactNode | – | Small line above the controls. |
| perView | 3 | 6 | 6 | Logos visible at once: six in a row on wide screens, two rows of three on phones. |
| interval | number | 3600 | Milliseconds each set stays up. |
