Skip to content

Logo Cloud

Client logos or wordmarks as a bordered grid, a wrapping row or an endless marquee with a pause button. Muted by default, full color on hover.

Installation

pnpm dlx shadcn@latest add @portfolio-kit/logo-cloud
First time? Add the @portfolio-kit registry to components.json
components.json
{
  "registries": {
    "@portfolio-kit": "https://www.parthjadhav.com/products/portfolio-kit/r/{name}.json"
  }
}

Usage

Examples

Inline

A centered, wrapping row without borders. The lightest way to add social proof under a hero.

Marquee

An endless, edge-to-edge ticker for client lists too long to wrap neatly, with a pause button below it; it stands still under reduced motion.

Linked Grid

Each logo links to its case study (the whole cell is clickable), with a count beside the heading.

API Reference

Used in