Testimonials

Use testimonial blocks to showcase customer feedback with quote-style single testimonials or card-based grid layouts for multiple reviews.

Default Testimonial Quote

Flowbite is just awesome. It contains huge collection of prebuilt components and pages starting from login screen to complex dashboard. Perfect choice for your next SaaS application.

profile picture
Micheal Gough
CEO at Google

Blade code

<x-fwb.blocks.marketing.testimonial-quote />

Custom Testimonial Quote

This component library has dramatically improved our development speed. The quality and consistency of the components is outstanding.

profile picture
Sarah Johnson
CTO at TechCorp

Blade code

<x-fwb.blocks.marketing.testimonial-quote
    quote="This component library has dramatically improved our development speed. The quality and consistency of the components is outstanding."
    name="Sarah Johnson"
    role="CTO at TechCorp"
    avatar="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/avatars/karen-nelson.png"
/>

Default Testimonial Cards

Blade code

<x-fwb.blocks.marketing.testimonial-cards />

Custom Testimonial Cards

What our clients say

Real feedback from teams who use our product every day.

Incredible developer experience

The components are well-documented and easy to customize. Saved us weeks of development time.

profile picture
Karen Nelson
Designer at Apple

Perfect for rapid prototyping

We went from concept to production-ready UI in record time. Highly recommended for any Laravel team.

profile picture
Joseph McFall
CTO at Stripe

Blade code

<x-fwb.blocks.marketing.testimonial-cards title="What our clients say" description="Real feedback from teams who use our product every day.">
    <figure class="flex flex-col justify-center items-center p-8 text-center bg-gray-50 border-b border-gray-200 rounded-t-lg md:rounded-t-none md:rounded-ss-lg md:border-e dark:bg-gray-800 dark:border-gray-700">
        <blockquote class="mx-auto mb-4 max-w-2xl text-gray-500 lg:mb-8 dark:text-gray-400">
            <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Incredible developer experience</h3>
            <p class="my-4">The components are well-documented and easy to customize. Saved us weeks of development time.</p>
        </blockquote>
        <figcaption class="flex justify-center items-center space-x-3 rtl:space-x-reverse">
            <img class="w-9 h-9 rounded-full" src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/avatars/karen-nelson.png" alt="profile picture">
            <div class="space-y-0.5 font-medium dark:text-white text-left">
                <div>Karen Nelson</div>
                <div class="text-sm font-light text-gray-500 dark:text-gray-400">Designer at Apple</div>
            </div>
        </figcaption>
    </figure>
    <figure class="flex flex-col justify-center items-center p-8 text-center bg-gray-50 border-b border-gray-200 rounded-b-lg md:rounded-se-lg dark:bg-gray-800 dark:border-gray-700">
        <blockquote class="mx-auto mb-4 max-w-2xl text-gray-500 lg:mb-8 dark:text-gray-400">
            <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Perfect for rapid prototyping</h3>
            <p class="my-4">We went from concept to production-ready UI in record time. Highly recommended for any Laravel team.</p>
        </blockquote>
        <figcaption class="flex justify-center items-center space-x-3 rtl:space-x-reverse">
            <img class="w-9 h-9 rounded-full" src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/avatars/joseph-mcfall.png" alt="profile picture">
            <div class="space-y-0.5 font-medium dark:text-white text-left">
                <div>Joseph McFall</div>
                <div class="text-sm font-light text-gray-500 dark:text-gray-400">CTO at Stripe</div>
            </div>
        </figcaption>
    </figure>
</x-fwb.blocks.marketing.testimonial-cards>

Component Properties

TestimonialQuote x-fwb.blocks.marketing.testimonial-quote

Prop Type Default Description
quote string 'Flowbite is just awesome...' The testimonial quote text displayed in the blockquote.
name string 'Micheal Gough' Name of the person giving the testimonial.
role string 'CEO at Google' Role or title of the person giving the testimonial.
avatar string 'https://flowbite.s3...' URL to the avatar image of the person.

TestimonialCards x-fwb.blocks.marketing.testimonial-cards

Prop Type Default Description
title string 'Testimonials' Heading text displayed above the testimonial cards grid.
description string 'Hear from our customers...' Subheading text displayed below the title.
slot slot - Testimonial card <figure> elements displayed in a two-column grid.