Logo Cloud
Customer logos muted until hovered, so they read as texture.
- 0.8 KB gzipped
- Zero dependencies
- Reduced-motion safe
- Base UI & Radix compatible
Preview
Astro
Next.js
Remix
Vite
Nuxt
SvelteKit
Installation
pnpm dlx shadcn@latest add https://paulkeys.org/r/logo-cloud.jsonAdds components/velora/logo-cloud.tsx.
Props
| Prop | Type | Default |
|---|---|---|
logos*One entry per logo — pass SVGs, `img` elements or plain wordmarks | { name: string; logo: React.ReactNode }[] | — |
dimUntilHoverShow logos muted until hovered | boolean | true |
Also accepts every <div> attribute, forwarded to the root element.
Accessibility
- Reduced motion
- The 300ms fade is removed, so a hovered logo switches straight from dimmed grayscale to full color.
- Keyboard
- Decorative — nothing to operate.
- Screen readers
- A list with one item per logo, each announced by its `name`; the logo node itself is aria-hidden.