Componente de reseñas de productos
Un componente simple de reseñas de productos diseñado en estilo Material Design con un esquema de color en escala de grises.
Código HTML
<div class="max-w-md mx-auto my-10 bg-white dark:bg-gray-800 rounded-lg shadow-lg overflow-hidden">
<div class="p-5">
<h2 class="text-lg font-bold text-gray-800 dark:text-gray-100">Product Reviews</h2>
<div class="mt-4">
<div class="flex items-center mb-4">
<img class="w-10 h-10 rounded-full" src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" />
<div class="ml-3">
<h3 class="text-gray-800 dark:text-gray-100 font-semibold">John Doe</h3>
<p class="text-gray-600 dark:text-gray-400">5 stars</p>
<p class="text-gray-600 dark:text-gray-400">This product is amazing! Highly recommend.</p>
</div>
</div>
<div class="flex items-center mb-4">
<img class="w-10 h-10 rounded-full" src="https://randomuser.me/api/portraits/women/2.jpg" alt="User Avatar" />
<div class="ml-3">
<h3 class="text-gray-800 dark:text-gray-100 font-semibold">Jane Smith</h3>
<p class="text-gray-600 dark:text-gray-400">4 stars</p>
<p class="text-gray-600 dark:text-gray-400">Great quality but could be a bit cheaper.</p>
</div>
</div>
<div class="flex items-center mb-4">
<img class="w-10 h-10 rounded-full" src="https://randomuser.me/api/portraits/men/3.jpg" alt="User Avatar" />
<div class="ml-3">
<h3 class="text-gray-800 dark:text-gray-100 font-semibold">Michael Johnson</h3>
<p class="text-gray-600 dark:text-gray-400">3 stars</p>
<p class="text-gray-600 dark:text-gray-400">Average experience, nothing special.</p>
</div>
</div>
</div>
</div>
</div>Componentes relacionados
Componente de reseñas de productos
Un componente web que muestra las reseñas de los usuarios sobre un producto, con microinteracciones y compatibilidad con temas oscuros mediante Tailwind CSS.
Componente de reseñas de productos
Un componente de reseñas de productos receptivo diseñado para el modo oscuro con una combinación de colores vibrantes, adecuado para sitios web comerciales / corporativos. Cuenta con avatares de usuario, calificaciones de reseñas y comentarios de usuarios en un diseño interactivo.
Componente de reseñas de productos
Un componente de reseñas de productos complejo y atractivo con microinteracciones, diseñado para sitios web comerciales. El componente presenta un diseño responsivo de temática oscura que utiliza Tailwind CSS, incorporando animaciones y un esquema de color basado en colores análogos.