Logo Cloud

An animated logo cloud with infinite scrolling and hover effects.

Configuring your account...

Please wait while we prepare everything for you

Usage

import LogoCloudAnimated from '@/components/bynanaui/logo-cloud'

<LogoCloudAnimated />

Props

PropTypeDefaultDescription
titlestring"Trusted by the world's most innovative teams"Section title
descriptionstring"Join thousands of developers..."Section description
logosLogo[][...]Array of logo objects
classNamestring''Additional CSS classes

Logo Object Structure

interface Logo {
  name: string;
  logo: React.ComponentType;
  url?: string;
}

Features

  • Infinite horizontal scrolling animation
  • Hover effects with scale and rotation
  • Gradient mask for smooth edges
  • Responsive design
  • Customizable logos and links
  • Dark theme optimized

Customization

You can replace the default logos with your own:

const customLogos = [
  {
    name: "Your Company",
    logo: YourLogoComponent,
    url: "https://yourcompany.com"
  },
  // Add more logos...
];

<LogoCloudAnimated logos={customLogos} />