Home
Nishant Trivedi
Twitter testimonial card

Twitter testimonial card

This tailwind example is contributed by Nishant Trivedi, on 05-Aug-2023. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are endorsement,review

Testimonial

Author Nishant Trivedi

8.3k

Fork Fullscreen

<div class="rounded-xl px-2 ">
    <div
        class="h-auto max-w-xl w-full border border-blue-200 hover:bg-blue-200 transition ease-in-out cursor-pointer px-4 py-6 rounded-xl">
        <p class="font-thin text-white whitespace-pre-line break-words">
        <p>Recently came across a fantastic article by
            <a href="" class="text-blue-600" target="_blank" rel="noopener">@company</a> on "Becoming a Value-driven Software
            Engineer."
            It's a must-read!
            Check it out (link) and don't forget to subscribe to their newsletter (link).
        </p>
        </p>
        <div class="flex w-full items-center justify-between mt-6">
            <p class="font-magnat text-lg flex items-center">
                <img class="w-8 h-8 rounded-full object-cover mr-3"
                    src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w0NzEyNjZ8MHwxfHNlYXJjaHwxMXx8aGVhZHNob3R8ZW58MHwxfHx8MTY5MTIxOTI0Nnww&ixlib=rb-4.0.3&q=80&w=1080">
                John doe
            </p>
            <a href="#" target="_blank">
                <svg class="w-6 h-6" version="1.1" id="Layer_1" viewBox="0 0 410.155 410.155" fill="#000000">
                    <g id="SVGRepo_bgCarrier" stroke-width="0"></g>
                    <g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g>
                    <g id="SVGRepo_iconCarrier">
                        <path
                            d="M403.632,74.18c-9.113,4.041-18.573,7.229-28.28,9.537c10.696-10.164,18.738-22.877,23.275-37.067 l0,0c1.295-4.051-3.105-7.554-6.763-5.385l0,0c-13.504,8.01-28.05,14.019-43.235,17.862c-0.881,0.223-1.79,0.336-2.702,0.336 c-2.766,0-5.455-1.027-7.57-2.891c-16.156-14.239-36.935-22.081-58.508-22.081c-9.335,0-18.76,1.455-28.014,4.325 c-28.672,8.893-50.795,32.544-57.736,61.724c-2.604,10.945-3.309,21.9-2.097,32.56c0.139,1.225-0.44,2.08-0.797,2.481 c-0.627,0.703-1.516,1.106-2.439,1.106c-0.103,0-0.209-0.005-0.314-0.015c-62.762-5.831-119.358-36.068-159.363-85.14l0,0 c-2.04-2.503-5.952-2.196-7.578,0.593l0,0C13.677,65.565,9.537,80.937,9.537,96.579c0,23.972,9.631,46.563,26.36,63.032 c-7.035-1.668-13.844-4.295-20.169-7.808l0,0c-3.06-1.7-6.825,0.485-6.868,3.985l0,0c-0.438,35.612,20.412,67.3,51.646,81.569 c-0.629,0.015-1.258,0.022-1.888,0.022c-4.951,0-9.964-0.478-14.898-1.421l0,0c-3.446-0.658-6.341,2.611-5.271,5.952l0,0 c10.138,31.651,37.39,54.981,70.002,60.278c-27.066,18.169-58.585,27.753-91.39,27.753l-10.227-0.006 c-3.151,0-5.816,2.054-6.619,5.106c-0.791,3.006,0.666,6.177,3.353,7.74c36.966,21.513,79.131,32.883,121.955,32.883 c37.485,0,72.549-7.439,104.219-22.109c29.033-13.449,54.689-32.674,76.255-57.141c20.09-22.792,35.8-49.103,46.692-78.201 c10.383-27.737,15.871-57.333,15.871-85.589v-1.346c-0.001-4.537,2.051-8.806,5.631-11.712c13.585-11.03,25.415-24.014,35.16-38.591 l0,0C411.924,77.126,407.866,72.302,403.632,74.18L403.632,74.18z"
                            style="fill: rgb(118, 169, 234);"></path>
                    </g>
                </svg>
            </a>
        </div>
    </div>
</div>

Related Examples

Customer testimonies grid

Author:
Sameer Sultana

2 years ago

20k
Testimonial card

Author:
Leon Bachmann

2 years ago

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

Author:
Akram Khan

1 year ago

2.8k
Minimal Testimonial Card

Author:
Amit Pachange

2 years ago

8.8k
Testimonial card

Author:
Mr Robot

3 years ago

10.9k
Landing page

Author:
Maxim

7 months ago

1.6k
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

5 months ago

708
Testimonial card

Author:
Amit Pachange

2 years ago

11.6k
Testimonial wall

Author:
yousef

1 year ago

3.4k
Responsive Testimonial Card with stars ratings

Author:
Quentin Rivers

1 year ago

1.9k
Designing a Responsive Activity Feed with Tailwind CSS
Enhance your web application by building a sleek and responsive activity feed using Tailwind CSS. This comprehensive guide walks you through creating an interactive feed section featuring customizable icons, links, and timestamps. Learn how to implement a visually appealing and accessible timeline that adapts seamlessly to any device, improving user engagement and overall experience

Author:
zobaidul kaziex

1 year ago

2.3k
basichtml
this is basic html

Author:
Anonymous

4 months ago

372

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components