# Logo cloud

> A "trusted by" row of customer logos. Company names are available as text, so screen readers announce a list of names, not unlabelled images.

Facade UI item `logo-cloud` (block, section).
Docs page: https://facadeui.dev/components/logo-cloud · Registry JSON: https://facadeui.dev/r/logo-cloud.json

## Install

```bash
npx shadcn@latest add @facade/logo-cloud
```

Or by URL: `npx shadcn@latest add https://facadeui.dev/r/logo-cloud.json`. The CLI also installs what it needs: @facade/container, @facade/logo-mark, @facade/section, @facade/section-header, @facade/types, @facade/utils.

Files: `components/sections/logo-cloud.tsx`

Usage example as an installable item: `npx shadcn@latest add @facade/logo-cloud-demo` (lands in components/examples/).

## Usage

The source of the preview on the docs page. `./content` holds sample data.

```tsx
import { LogoCloud } from "@/components/sections/logo-cloud"

import { LOGOS } from "./content"

export function Demo() {
  return <LogoCloud title="Trusted by teams shipping every day" items={LOGOS} showNames />
}
```

## Props

### LogoCloudProps

Extends SectionBaseProps, ListSlotProps.

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `items` (required) | `LogoItem[]` |  |  |
| `title` | `string` |  | Optional heading. Omit it for a plain strip under a hero. |
| `eyebrow` | `string` |  |  |
| `description` | `string` |  |  |
| `image` | `ImageComponent` |  |  |
| `link` | `LinkComponent` |  |  |
| `size` | `"sm" \| "md" \| "lg"` | `"md"` | Rendered logo height. |
| `showNames` | `boolean` | `false` | Show each company name as text beside its mark. |
| `layout` | `"row" \| "grid"` | `"row"` | `row` wraps logos on a line. `grid` gives every logo equal width. |
| `muted` | `boolean` | `true` | Shows logos in grey and faded until hover or focus. |