Home
Leon Bachmann
Testimonial

Testimonial

This tailwind example is contributed by Leon Bachmann, on 02-Nov-2022. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are endorsement,review

Testimonial

Author Leon Bachmann

9.7k

Fork Fullscreen

<figure class="relative rounded-2xl bg-white p-6 shadow-xl shadow-slate-900/10">
    <svg aria-hidden="true" width="105" height="78" class="absolute top-6 left-6 fill-slate-100">
        <path
            d="M25.086 77.292c-4.821 0-9.115-1.205-12.882-3.616-3.767-2.561-6.78-6.102-9.04-10.622C1.054 58.534 0 53.411 0 47.686c0-5.273.904-10.396 2.712-15.368 1.959-4.972 4.746-9.567 8.362-13.786a59.042 59.042 0 0 1 12.43-11.3C28.325 3.917 33.599 1.507 39.324 0l11.074 13.786c-6.479 2.561-11.677 5.951-15.594 10.17-3.767 4.219-5.65 7.835-5.65 10.848 0 1.356.377 2.863 1.13 4.52.904 1.507 2.637 3.089 5.198 4.746 3.767 2.41 6.328 4.972 7.684 7.684 1.507 2.561 2.26 5.5 2.26 8.814 0 5.123-1.959 9.19-5.876 12.204-3.767 3.013-8.588 4.52-14.464 4.52Zm54.24 0c-4.821 0-9.115-1.205-12.882-3.616-3.767-2.561-6.78-6.102-9.04-10.622-2.11-4.52-3.164-9.643-3.164-15.368 0-5.273.904-10.396 2.712-15.368 1.959-4.972 4.746-9.567 8.362-13.786a59.042 59.042 0 0 1 12.43-11.3C82.565 3.917 87.839 1.507 93.564 0l11.074 13.786c-6.479 2.561-11.677 5.951-15.594 10.17-3.767 4.219-5.65 7.835-5.65 10.848 0 1.356.377 2.863 1.13 4.52.904 1.507 2.637 3.089 5.198 4.746 3.767 2.41 6.328 4.972 7.684 7.684 1.507 2.561 2.26 5.5 2.26 8.814 0 5.123-1.959 9.19-5.876 12.204-3.767 3.013-8.588 4.52-14.464 4.52Z">
        </path>
    </svg>
    <blockquote class="relative">
        <p class="text-lg tracking-tight text-slate-900">
            Awesome idea. Can't wait to see how this turns out!
        </p>
    </blockquote>
    <figcaption class="relative mt-6 flex items-center justify-between border-t border-slate-100 pt-6">
        <div>
            <div class="font-display text-base text-slate-900">Exmaple name</div>
            <div class="mt-1 text-sm text-slate-500">Job designation</div>
        </div>
        <div class="overflow-hidden rounded-full bg-slate-50">
            <img alt="" src="https://i.pravatar.cc/300" class="h-14 w-14 object-cover" loading="lazy" width="56" height="56">
        </div>
    </figcaption>
</figure>

Related Examples

Testimonial

Author:
Steven Kuhn

3 years ago

14.6k
Testimonial cards
each card contains a customer quote, an image of the customer, and their name.

Author:
Komal Jain

2 years ago

11k
Testimonial Section with Gradient Background
The section includes a company logo at the top, a customer testimonial in the center, and the author's name and position at the bottom.

Author:
Elsabe Fourie

2 years ago

8.7k
The future ai
The is technology

Author:
ORGIN_DREAMS

10 months ago

895
Customer testimonial card
Responsive user testimonial card with image

Author:
Arya

3 years ago

12.2k
Testimonial - Htmlwind
Single centered testimonial

Author:
Htmlwind

9 months ago

1.2k
Testimonial full width

Author:
Piet Vriend

3 years ago

13.3k
Medlife Hospital
To provide exceptional, compassionate healthcare through innovative medicine, cutting-edge technology, and a commitment to patient-centered service

Author:
INGRIDE MUZIRANENGE

10 months ago

602
Twitter Testimonials Showcase with Tailwind CSS

Author:
EliteAI Tools

1 year ago

1.5k
basichtml
this is basic html

Author:
Anonymous

9 months ago

470
Tailwind Flex Component: Responsive Testimonial Section UI
A clean, modern, and fully responsive Testimonial Section built using Tailwind CSS and Flexbox. Ideal for portfolios, agency websites, SaaS landing pages, or any modern UI project. This reusable component includes user images, job titles, and quotes—perfect for showcasing feedback and adding trust to your UI.

Author:
Muhammad Umair Arshad

9 months ago

1.1k
Simple Testimonial
Responsive and supports dark mode

Author:
Orson Kincaid

1 year ago

2.3k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components