LogoCloud

A row or grid of customer and partner logos.

Last updated

Trusted by teams at

  • Oakmere
  • Larkspur
  • Fernhill
  • Brightwell
  • Halcyon
  • Tidewater
Show code
<LogoCloud heading="Trusted by teams at" items={[{ src, alt, href? }, …]} />

Add

npx @ava-ui/apogee add logo-cloud

API

Prop Type Default Category Description
heading string — content Short line above the logos.
items { src: string, alt: string, href?: string, width?: number }[] — content Required. Logos, 32px tall; width (at that height) reserves the space so the row does not shift as logos load.
label string English content Landmark name when there is no heading.
layout 'row' | 'grid' 'row' layout Wrapping row or a 2/3/6-column grid.
background Section background 'page' layout On solid fills logos are inverted to white.
spacing 'small' | 'medium' | 'large' 'small' layout Vertical rhythm.
id string auto layout

Layouts

  • Oakmere
  • Larkspur
  • Fernhill
  • Brightwell
  • Halcyon
  • Tidewater

Also on dark

  • Oakmere
  • Larkspur
  • Fernhill
  • Brightwell
  • Halcyon
  • Tidewater
Show code
<LogoCloud layout="grid" items={…} />
<LogoCloud background="inverted" items={…} />

Accessibility

  • Each logo’s alt is the company name; linked logos get the focus ring.
  • Without a heading the section is labelled “Partners”.