Componente de botones para compartir en redes sociales
Un componente minimalista de botones para compartir en redes sociales diseñado con Tailwind CSS, con un diseño responsivo y soporte para temas oscuros. El componente incluye botones para compartir en plataformas de redes sociales populares con elementos de diseño limpios y simples.
Código HTML
<div class="flex flex-col md:flex-row justify-center items-center space-x-4 p-4 bg-white dark:bg-gray-800 rounded-lg shadow">
<div class="flex items-center space-x-2">
<img src="https://picsum.photos/30" alt="Avatar" class="w-8 h-8 rounded-full" />
<span class="text-gray-800 dark:text-gray-200">Share with:</span>
</div>
<a href="#" class="flex items-center justify-center w-10 h-10 rounded-full bg-blue-500 hover:bg-blue-600 text-white transition duration-200 ease-in-out">
<img src="https://img.icons8.com/ios-filled/50/ffffff/facebook-new.png" alt="Facebook" class="w-6 h-6" />
</a>
<a href="#" class="flex items-center justify-center w-10 h-10 rounded-full bg-blue-400 hover:bg-blue-500 text-white transition duration-200 ease-in-out">
<img src="https://img.icons8.com/ios-filled/50/ffffff/twitter-squared.png" alt="Twitter" class="w-6 h-6" />
</a>
<a href="#" class="flex items-center justify-center w-10 h-10 rounded-full bg-red-500 hover:bg-red-600 text-white transition duration-200 ease-in-out">
<img src="https://img.icons8.com/ios-filled/50/ffffff/instagram-new.png" alt="Instagram" class="w-6 h-6" />
</a>
<a href="#" class="flex items-center justify-center w-10 h-10 rounded-full bg-gray-800 hover:bg-gray-600 text-white transition duration-200 ease-in-out">
<img src="https://img.icons8.com/ios-filled/50/ffffff/linkedin.png" alt="LinkedIn" class="w-6 h-6" />
</a>
</div>Componentes relacionados
Componente de botones para compartir en redes sociales
Un componente de botón de compartir en redes sociales receptivo para sitios web de comida/restaurantes, con un degradado de arco iris, microinteracciones al pasar el cursor y soporte completo para el modo oscuro.
Componente de botones para compartir en redes sociales
Un componente responsivo de botones para compartir en redes sociales diseñado en un estilo de cristal con un esquema de color monocromático para sitios de comercio electrónico. Cuenta con elementos translúcidos similares al vidrio esmerilado, incluye múltiples botones interactivos para compartir en las redes sociales y es compatible con el modo oscuro con Tailwind CSS.
Componente de botones para compartir en redes sociales
Componente de botones para compartir en redes sociales con estilo brutalismo, efectos responsivos y compatibilidad con temas oscuros mediante Tailwind CSS.