Composants Avis sur les produits Composant Avis sur les produits

Composant Avis sur les produits

Un composant simple d’avis sur les produits conçu dans le style Material Design avec une palette de couleurs en niveaux de gris.

Aperçu

HTML Code

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

Composants associés

Neumorphic Avis sur les produits Composant

Un composant d’avis sur les produits simple et réactif avec un design neumorphique, une palette de couleurs analogue et une prise en charge du mode sombre, adapté aux sites Web d’entreprise ou d’entreprise.

Ouvrir

Composant Avis sur les produits

Un composant d’avis sur les produits simple et réactif avec une esthétique de conception 3D, une palette de couleurs noir et blanc avec un accent vif, conçu pour les outils CRM/Business, y compris la prise en charge du mode sombre.

Ouvrir

Avis sur le produit Composant 6

Un composant d’évaluation de produit réactif conçu selon les principes de Material Design, prenant en charge les thèmes clairs et sombres.

Ouvrir