Home
Coastal UI
Modern Testimonial

Modern Testimonial

A simple and easy to use component for reviews and testimonials.

This tailwind example is contributed by Coastal UI, on 22-Feb-2025. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are Services,Why choose us,endorsement,review,Vote,Front page

Feature showcase Testimonial Comment Section Other Rating Landing Page

Author Coastal UI

Fork Fullscreen

<div class="bg-[#0a0a0a] border border-[#222222] rounded-lg w-[260px] relative pb-4 mt-10">
    <div class="before:content-[''] before:absolute before:inset 
                before:border-t-1 before:border-l-1 before:border-r-1 
                before:border-[#222222] before:rounded-t-full 
                before:w-full before:h-1/2 before:top-0
                bg-[#0a0a0a] relative rounded-full -top-10 left-2 w-20 h-20 -mb-6
                flex items-center justify-center overflow-hidden">
        <img src="https://avatars.githubusercontent.com/u/15827433?v=4" class="rounded-full h-16 w-16" />
    </div>
    <div class="absolute top-3 right-3 flex gap-0.5">
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24">
            <path fill="#d0d0d0" d="m5.825 21l1.625-7.025L2 9.25l7.2-.625L12 2l2.8 6.625l7.2.625l-5.45 4.725L18.175 21L12 17.275z" />
        </svg>
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24">
            <path fill="#d0d0d0" d="m5.825 21l1.625-7.025L2 9.25l7.2-.625L12 2l2.8 6.625l7.2.625l-5.45 4.725L18.175 21L12 17.275z" />
        </svg>
        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24">
            <path fill="#d0d0d0" d="m5.825 21l1.625-7.025L2 9.25l7.2-.625L12 2l2.8 6.625l7.2.625l-5.45 4.725L18.175 21L12 17.275z" />
        </svg>
                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24">
            <path fill="#d0d0d0" d="m5.825 21l1.625-7.025L2 9.25l7.2-.625L12 2l2.8 6.625l7.2.625l-5.45 4.725L18.175 21L12 17.275z" />
        </svg>
                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24">
            <path fill="#d0d0d0" d="m5.825 21l1.625-7.025L2 9.25l7.2-.625L12 2l2.8 6.625l7.2.625l-5.45 4.725L18.175 21L12 17.275z" />
        </svg>
    </div>
    <div class="text-base text-white font-light px-4">
        Using Coastal UI has been wonderful. My project looks great!
    </div>
    <div class="flex justify-between w-full px-4 text-sm mt-5">
        <div class="text-zinc-400">Samuel Altrov</div>
        <div class="text-zinc-700 text-xs">Student</div>
    </div>
</div>

Related Examples

Flour mill website landing page template
flour mill and services template website which comprise of many sections like about us, featured products, why us, visit us

Author:
Amit Pachange

9 months ago

9.5k
interactive testimonial with Tailwind CSS and Alpine.js

Author:
Michael Andreuzza

9 months ago

1.5k
beautifull web page
I create a web page using cloude ai its amazing.

Author:
Akram Khan

7 months ago

1.7k
Chat Box for Marketing
An Onyx component. This chat box is great for SAAS landing pages where you want to mock customer interactions or expectations.

Author:
Coastal UI

4 months ago

706
Services

Author:
Samuel Abera

1 month ago

578
Moving Background Animation

Author:
Samuel Abera

1 month ago

662
Modern Responsive Footer with Tailwind CSS
This sleek and modern responsive footer is built using HTML and Tailwind CSS. It features three sections: brand information, useful links, and social media icons. The footer includes smooth hover effects, subtle fade-in animations, and a fully responsive design that adapts seamlessly to different screen sizes. Perfect for websites looking for a professional and stylish footer section.

Author:
Ayyamperumal S

1 week ago

147
Employee Data Management System TailwindCSS,Html
This project is made of only html and even tailwind is using CDN to save storage space. Best for SPA and routing with other components .

Author:
Siva Naga Malleswararao Kurakula

1 week ago

96
Section Heading
A gorgeous section heading with a smooth blur element.

Author:
Coastal UI

3 months ago

400
SaaS Feature Section
It has a Gradient text headline and CTA buttons

Author:
Junclarkaizen Pagu

1 year ago

7.6k
Feature, Showcase

Author:
Matti

1 month ago

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

Author:
Komal Jain

1 year ago

9.2k

Explore components by Tags

Didn't find component you were looking for?

Search from 2000+ components