testimonialsBeginner
Testimonial — Dark Feature
Dark-mode featured testimonial with large portrait.
Claude prompt
Drop this into Claude Code, claude.ai, or your AI tool of choice to regenerate or remix this component from scratch.
Build a dark featured testimonial with Tailwind: gray-900 background, a large portrait, big quote text, and an attribution line below.
Code
html
<!--
Source: Mert Cukuren (Tailblocks)
https://github.com/mertJF/tailblocks/blob/master/src/blocks/testimonial/dark/c.js
License: MIT
Surfaced via https://vibedex-ryan-staxs-projects-fb4e0931.vercel.app/components/tailblocks-testimonial-dark-c
-->
<div class="bg-gray-900 text-gray-300 min-h-screen flex items-center justify-center">
<div class="w-full">
<section class="text-gray-400 bg-gray-900 body-font">
<div class="container px-5 py-24 mx-auto">
<div class="flex flex-wrap -m-4">
<div class="lg:w-1/3 lg:mb-0 mb-6 p-4">
<div class="h-full text-center">
<img
alt="testimonial"
class="w-20 h-20 mb-8 object-cover object-center rounded-full inline-block border-2 border-gray-800 bg-gray-800 bg-opacity-10"
src="https://dummyimage.com/302x302"
/>
<p class="leading-relaxed">
Edison bulb retro cloud bread echo park, helvetica stumptown
taiyaki taxidermy 90's cronut +1 kinfolk. Single-origin
coffee ennui shaman taiyaki vape DIY tote bag drinking vinegar
cronut adaptogen squid fanny pack vaporware.
</p>
<span class="inline-block h-1 w-10 rounded bg-indigo-500 mt-6 mb-4"></span>
<h2 class="text-white font-medium title-font tracking-wider text-sm">
HOLDEN CAULFIELD
</h2>
<p class="text-gray-500">Senior Product Designer</p>
</div>
</div>
<div class="lg:w-1/3 lg:mb-0 mb-6 p-4">
<div class="h-full text-center">
<img
alt="testimonial"
class="w-20 h-20 mb-8 object-cover object-center rounded-full inline-block border-2 border-gray-800 bg-gray-800 bg-opacity-10"
src="https://dummyimage.com/300x300"
/>
<p class="leading-relaxed">
Edison bulb retro cloud bread echo park, helvetica stumptown
taiyaki taxidermy 90's cronut +1 kinfolk. Single-origin
coffee ennui shaman taiyaki vape DIY tote bag drinking vinegar
cronut adaptogen squid fanny pack vaporware.
</p>
<span class="inline-block h-1 w-10 rounded bg-indigo-500 mt-6 mb-4"></span>
<h2 class="text-white font-medium title-font tracking-wider text-sm">
ALPER KAMU
</h2>
<p class="text-gray-500">UI Develeoper</p>
</div>
</div>
<div class="lg:w-1/3 lg:mb-0 p-4">
<div class="h-full text-center">
<img
alt="testimonial"
class="w-20 h-20 mb-8 object-cover object-center rounded-full inline-block border-2 border-gray-800 bg-gray-800 bg-opacity-10"
src="https://dummyimage.com/305x305"
/>
<p class="leading-relaxed">
Edison bulb retro cloud bread echo park, helvetica stumptown
taiyaki taxidermy 90's cronut +1 kinfolk. Single-origin
coffee ennui shaman taiyaki vape DIY tote bag drinking vinegar
cronut adaptogen squid fanny pack vaporware.
</p>
<span class="inline-block h-1 w-10 rounded bg-indigo-500 mt-6 mb-4"></span>
<h2 class="text-white font-medium title-font tracking-wider text-sm">
HENRY LETHAM
</h2>
<p class="text-gray-500">CTO</p>
</div>
</div>
</div>
</div>
</section>
</div>
</div>