Composant d’affichage des prix 22
Un composant d’affichage de prix minimaliste qui met en valeur l’image, le nom, le prix et un bouton d’un produit à ajouter au panier. Conçu avec une réactivité et une prise en charge des thèmes sombres à l’aide de Tailwind CSS.
HTML Code
<div class="max-w-sm mx-auto bg-white dark:bg-gray-800 rounded-lg shadow-lg overflow-hidden">
<img class="w-full h-48 object-cover" src="https://picsum.photos/400/300" alt="Product Image">
<div class="p-4">
<h2 class="text-lg font-semibold text-gray-800 dark:text-white">Product Name</h2>
<p class="text-xl text-gray-600 dark:text-gray-300">$29.99</p>
<button class="mt-4 bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition duration-300" type="button">Add to Cart</button>
</div>
</div>
Composants associés
Composant d’affichage des prix
Composant d’affichage des prix avec un design réactif, la prise en charge du mode sombre et une palette de couleurs vives.
Composant d’affichage des prix
Un composant d’affichage de prix minimal avec prise en charge du mode réactif et sombre
Composant d’affichage des prix
Un composant d’affichage de prix simple et réactif pour les annonces immobilières, avec des couleurs de terre et une prise en charge du mode sombre.