Composant de la liste de souhaits
Composant de liste de souhaits avec conception 3D, schéma de couleurs analogue et complexité simple à des fins de tableau de bord, avec conception réactive et prise en charge du thème sombre.
HTML Code
<div class="dark:bg-gray-900 bg-gray-100 min-h-screen p-4">
<div class="max-w-md mx-auto bg-white dark:bg-gray-800 rounded-xl shadow-lg overflow-hidden md:max-w-2xl transform transition-all duration-300 hover:scale-105">
<div class="md:flex">
<div class="md:flex-shrink-0">
<img class="h-48 w-full object-cover md:w-48 transform translate-x-2 translate-y-2 rotate-3 shadow-lg rounded-lg" src="https://picsum.photos/seed/wishlist/400/300" alt="Product image">
</div>
<div class="p-8">
<div class="uppercase tracking-wide text-sm text-indigo-500 dark:text-indigo-300 font-semibold">Wishlist Item</div>
<a href="#" class="block mt-1 text-lg leading-tight font-medium text-black dark:text-white hover:underline">Awesome Product Name</a>
<p class="mt-2 text-gray-500 dark:text-gray-400">A short description of the product, highlighting its key features and benefits.</p>
<div class="mt-4 flex items-center justify-between">
<span class="text-xl font-bold text-gray-900 dark:text-white">$29.99</span>
<button class="bg-indigo-500 hover:bg-indigo-700 text-white font-bold py-2 px-4 rounded-full shadow-lg transform transition-all duration-300 hover:scale-110">
Add to Cart
</button>
</div>
</div>
</div>
</div>
</div>
Composants associés
Composant de la liste de souhaits
Un composant de liste de souhaits de style Neumorphisme pour les médias sociaux, avec une palette de couleurs complémentaire. Il comprend un design réactif utilisant Tailwind CSS avec prise en charge du mode sombre. Seules les classes HTML et Tailwind sont utilisées, sans JavaScript. Les images proviennent de picsum.photos et les avatars de randomuser.me.
Composant de la liste de souhaits
Un composant de liste de souhaits minimaliste / plat avec des effets réactifs et la prise en charge du thème sombre.
Composant de la liste de souhaits Art Déco
Un composant complexe et réactif de la liste de souhaits de style Art Déco inspiré du luxe des années 1920-1930, avec des tons de bijoux adaptés aux interfaces finance/banque. Inclut la prise en charge du mode sombre.