Componente Botones de morfismo de vidrio
Un componente de botón de Glassmorphism simple y receptivo con colores pastel y soporte de modo oscuro usando Tailwind CSS.
Código HTML
<div class="flex items-center justify-center h-screen bg-gray-200 dark:bg-gray-800">
<div class="flex space-x-4">
<button class="px-6 py-3 text-lg font-semibold text-white bg-pink-300 rounded-lg shadow-lg backdrop-filter backdrop-blur-lg bg-opacity-20 hover:bg-opacity-40 transition duration-200 ease-in-out dark:bg-pink-500 dark:bg-opacity-30 dark:hover:bg-opacity-50">
Button 1
</button>
<button class="px-6 py-3 text-lg font-semibold text-white bg-blue-300 rounded-lg shadow-lg backdrop-filter backdrop-blur-lg bg-opacity-20 hover:bg-opacity-40 transition duration-200 ease-in-out dark:bg-blue-500 dark:bg-opacity-30 dark:hover:bg-opacity-50">
Button 2
</button>
</div>
</div>Componentes relacionados
Componente Botones
Un componente de botones diseñado con elementos 3D y colores vibrantes para interfaces de redes sociales, compatible con temas oscuros y diseño receptivo.
Retro_Rainbow_Buttons_Component
Una colección de botones de arcoíris degradados de temática retro diseñados para galerías de fotografía y portafolios, con una complejidad moderada y una capacidad de respuesta total y compatibilidad con el modo oscuro.
Gradient_Weather_Buttons
Un conjunto de botones responsivos para pronósticos meteorológicos y datos climáticos, con un degradado púrpura/violeta con transiciones de desplazamiento suaves y compatibilidad con el modo oscuro.