Componente de lista de deseos
Un componente de lista de deseos responsivo diseñado en modo oscuro usando Tailwind CSS. Cuenta con un diseño de tarjeta para elementos con imágenes, descripciones y avatares de usuario, que admite temas oscuros y efectos responsivos.
Código HTML
<div class="min-h-screen bg-gray-900 flex items-center justify-center">
<div class="w-full max-w-2xl p-6 bg-gray-800 rounded-lg shadow-lg">
<h2 class="text-2xl font-bold text-white mb-4">My Wishlist</h2>
<div class="space-y-4">
<div class="flex items-center bg-gray-700 rounded-lg p-4">
<img src="https://picsum.photos/80/80" alt="Item Image" class="rounded-full w-16 h-16 mr-4">
<div>
<h3 class="text-xl text-white">Item Title 1</h3>
<p class="text-gray-400">Short description of the item goes here.</p>
</div>
</div>
<div class="flex items-center bg-gray-700 rounded-lg p-4">
<img src="https://picsum.photos/80/80" alt="Item Image" class="rounded-full w-16 h-16 mr-4">
<div>
<h3 class="text-xl text-white">Item Title 2</h3>
<p class="text-gray-400">Short description of the item goes here.</p>
</div>
</div>
<div class="flex items-center bg-gray-700 rounded-lg p-4">
<img src="https://picsum.photos/80/80" alt="Item Image" class="rounded-full w-16 h-16 mr-4">
<div>
<h3 class="text-xl text-white">Item Title 3</h3>
<p class="text-gray-400">Short description of the item goes here.</p>
</div>
</div>
</div>
</div>
</div>Componentes relacionados
Componente de lista de deseos
Un componente de lista de deseos al estilo Neumorphism para redes sociales, con una combinación de colores complementaria. Incluye un diseño responsivo que utiliza Tailwind CSS con soporte para modo oscuro. Solo se utilizan las clases HTML y Tailwind, sin JavaScript. Las imágenes provienen de picsum.photos y los avatares de randomuser.me.
Componente de la lista de deseos de la Bauhaus
Un componente de lista de deseos simple y receptivo para productos de moda / belleza diseñado con los principios de Bauhaus, con colores neutros fríos y soporte para modo oscuro.
Componente de lista de deseos
Un componente de lista de deseos con estilo de diseño 3D, combinación de colores pastel y diseño receptivo para sitios web comerciales, compatible con el modo oscuro.