Social proof sections

Customer logos in a row, two rows, a scrolling strip, a card or on tiles, and press mentions, on the page or the brand colour.

Last updated

Each example is a block: a Section with one line of text over a list of logos. The logos are invented names with generic icons; swap in your customers’ marks. The scrolling version uses Marquee, which pauses on focus, holds still for reduced motion and has a pause button.

npx @ava-ui/apogee add social-proof/full-width

Copy is props

Every block in this family takes the same content props (SocialProofContent in sections/_shared/social-proof.ts), with its sample copy as the defaults. A block ignores the props it has no place for, so you can swap one block for another and keep the copy.

  • heading: The line above the logos.

  • label: Accessible name of the logo list.

  • logos: Company or publication names, in order.

  • Pass null to hide an optional part, such as description={null}.

  • Some blocks add props of their own; the top of each block’s file lists them.

Full widthOne line over a row of six logos.
Full width dualOne line over two rows of logos.
Full width maskedOne line over a scrolling strip of logos.
CardOne line and five logos in a grey card.
CardsOne line over eight logos, each on its own tile.
Press mentionsOne line over five press names.
Full width brandOne line over a row of six logos on the brand colour.
Full width dual brandOne line over two rows of logos on the brand colour.
Full width masked brandOne line over a scrolling strip of logos on the brand colour.
Card brandOne line and five logos in a brand-colour card.
Cards brandOne line over eight logos, each on its own tile on the brand colour.
Press mentions brandOne line over five press names on the brand colour.

Related

LogoCloudA row or grid of customer and partner logos.
MarqueeAn endless scrolling strip for logos, tags, or testimonials, with a play/pause toggle.