# Slim Dark Logo Cloud

> Slim dark strip of five muted text wordmarks spread edge to edge in a wrapping row, named for screen readers by a hidden label while the row shows names only.

A shadcn/ui block from the [@01orbital](https://01orbital.dev/?utm_source=shadcn.exchange) registry, listed on [shadcn.exchange](https://shadcn.exchange/r/01orbital/logo-cloud-02).

- Page, with a live preview: https://shadcn.exchange/r/01orbital/logo-cloud-02
- Screenshot: https://shadcn.exchange/shot/01orbital/logo-cloud-02/light.png
- Registry item: https://01orbital.dev/r/logo-cloud-02.json
- Categories: logo-cloud
- Listed: 2026-11-01, source last changed 2026-11-01

## Install

```bash
npx shadcn@latest add https://shadcn.exchange/r/01orbital/logo-cloud-02.json
```

Run it in a project that has shadcn/ui set up. It adds the files below and installs what they depend on.

## Dependencies

- Registry items: `@01orbital/logo`, `@01orbital/section`

## Files

### `blocks/logo-cloud/logo-cloud-02/index.tsx`

```tsx
import { Logo, LogoGroup } from "@/components/editorial/logo"
import {
  Section,
  SectionContent,
} from "@/components/editorial/section"

// The copy: change text here, not in the markup.
const COPY = {
  label: "Run by finance teams at",
} as const

const LOGOS = ["Enceladus", "Tethys Labs", "Iapetus", "Dione & Co", "Hyperion"]

// The label names the list for screen readers; the row shows names only.
export default function LogoCloud02() {
  return (
    <Section size="sm" className="dark">
      <SectionContent>
        <LogoGroup
          aria-label={COPY.label}
          variant="wrap"
          className="justify-between"
        >
          {LOGOS.map((name) => (
            <Logo key={name} variant="muted" size="lg">
              {name}
            </Logo>
          ))}
        </LogoGroup>
      </SectionContent>
    </Section>
  )
}
```