Nativ ui
Documentation

Testimonials

Social proof and testimonial section patterns.

Basic Testimonial

<section class="py-24 bg-muted/50">
  <div class="container">
    <h2 class="text-3xl font-bold text-center mb-16">
      What our customers say
    </h2>
    <div class="grid md:grid-cols-3 gap-8">
      <div class="bg-background p-6 rounded-lg border">
        <p class="text-muted-foreground">
          "This product has completely transformed how we work.
          Highly recommended!"
        </p>
        <div class="mt-6 flex items-center gap-4">
          <img class="w-10 h-10 rounded-full" src="avatar.jpg" alt="" />
          <div>
            <div class="font-medium">Jane Doe</div>
            <div class="text-sm text-muted-foreground">CEO, Company</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

Patterns

Rotating testimonials for space efficiency.

Video

Video testimonials for authenticity.

Brief quote linking to full case study.

Best Practices

  1. Real people - Use actual customer photos and names
  2. Specific quotes - Detailed beats generic praise
  3. Include context - Role, company, use case
  4. Permission - Always get approval to publish
  5. Diverse voices - Show variety of customers