Infinite Moving Cards
Infinitely scrolling horizontal card carousel using CSS animation.
Preview
Infinite Moving Cards
Interactive preview — import this component to see it in action
IO Context
Where IO uses this
Testimonials and partner logos.
Why this component matters
Infinite scroll implies abundance and social proof without requiring interaction.
Usage guidance
Use for testimonials or logo strips. Set speed to 'slow' for readability. Duplicate the card set for seamless looping. Pause on hover.
Installation
bash
npx shadcn@latest add @aceternity/infinite-moving-cardsUsage
example.tsxtsx
import { InfiniteMovingCards } from "@/components/ui/infinite-moving-cards";
export default function Example() {
return (
<InfiniteMovingCards>
{/* Your content here */}
</InfiniteMovingCards>
);
}Source
infinite-moving-cards.tsx
components/ui/infinite-moving-cards.tsx