Page UI logo

Landing Page Testimonial Inline Component

Use this to highlight short customer testimonials or reviews. These are not meant for reviews, but short validation and are usually support for a primary or secondary Call to action.

It displays an inline grid of short testimonials.

John Doe

"I love this app"

John Doe

Jane Doe

"Best app ever"

Jane Doe

Alice Doe

"Fantastic"

Alice Doe, CEO of Instagram

Guido Ross

"Recommended"

Guido Ross, DevOps at Meta

Usage

import { LandingTestimonialInline } from '@/components/landing/testimonial/LandingTestimonialInline';
import { LandingTestimonialInlineItem } from '@/components/landing/testimonial/LandingTestimonialInlineItem';
<LandingTestimonialInline>
  <LandingTestimonialInlineItem
    imageSrc="https://picsum.photos/id/64/100/100"
    name="John Doe"
    text="I love this app"
  />

  <LandingTestimonialInlineItem
    imageSrc="https://picsum.photos/id/65/100/100"
    name="Jane Doe"
    text="Best app ever"
  />

  <LandingTestimonialInlineItem
    imageSrc="https://picsum.photos/id/669/100/100"
    name="Alice Doe"
    text="Fantastic"
    suffix="CEO of Instagram"
  />

  <LandingTestimonialInlineItem
    imageSrc="https://picsum.photos/id/829/100/100"
    name="Guido Ross"
    text="Recommended"
    suffix="DevOps at Meta"
  />
</LandingTestimonialInline>

Examples

Background Color

John Doe

"I love this app"

John Doe

Jane Doe

"Best app on the market"

Jane Doe

Alice Doe

"Never seen anything like it"

Alice Doe, CEO of Instagram

Guido Ross

"Nothing comes close to it"

Guido Ross, DevOps at Meta

With Primary CTA

Beautiful landing pages in minutes

Get your landing page up and running with a few clicks.

Sample image
John Doe

"I love this app"

John Doe

Jane Doe

"Best app on the market"

Jane Doe

Alice Doe

"Never seen anything like it"

Alice Doe, CEO of Instagram

Guido Ross

"Nothing comes close to it"

Guido Ross, DevOps at Meta

API Reference

Prop NameProp TypeRequiredDefault
children React.ReactNode ǀ stringNo-
withBackground booleanNofalse
variant 'primary' ǀ 'secondary'No'primary'
containerType 'narrow' ǀ 'wide' ǀ 'ultrawide'No'ultrawide'

More Examples

For more even more examples, see our Landing Page Component Examples page or see complete landing page examples by Exploring Our Landing Page Templates.