Composant Boutons de partage social
Composant de boutons de partage social avec un design brutaliste, une palette de couleurs vives et un niveau de complexité complexe pour le commerce électronique, avec un design réactif et une prise en charge du thème sombre à l’aide de Tailwind CSS. Pas de JavaScript.
HTML Code
<div class="bg-yellow-400 p-6 min-h-screen flex items-center justify-center dark:bg-gray-900">
<div class="flex flex-wrap space-x-4">
<!-- Share Button 1 -->
<button class="bg-red-600 hover:bg-red-700 text-white font-bold py-3 px-6 rounded-none border-4 border-black dark:bg-red-800 dark:border-white transform transition duration-300 hover:scale-110 focus:outline-none focus:ring-4 focus:ring-red-500">
Share on X
</button>
<!-- Share Button 2 -->
<button class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-6 rounded-none border-4 border-black dark:bg-blue-800 dark:border-white transform transition duration-300 hover:scale-110 focus:outline-none focus:ring-4 focus:ring-blue-500">
Share on Facebook
</button>
<!-- Share Button 3 -->
<button class="bg-green-600 hover:bg-green-700 text-white font-bold py-3 px-6 rounded-none border-4 border-black dark:bg-green-800 dark:border-white transform transition duration-300 hover:scale-110 focus:outline-none focus:ring-4 focus:ring-green-500">
Share on LinkedIn
</button>
<!-- Share Button 4 -->
<button class="bg-purple-600 hover:bg-purple-700 text-white font-bold py-3 px-6 rounded-none border-4 border-black dark:bg-purple-800 dark:border-white transform transition duration-300 hover:scale-110 focus:outline-none focus:ring-4 focus:ring-purple-500">
Share on Pinterest
</button>
<!-- Share Button 5 -->
<button class="bg-pink-600 hover:bg-pink-700 text-white font-bold py-3 px-6 rounded-none border-4 border-black dark:bg-pink-800 dark:border-white transform transition duration-300 hover:scale-110 focus:outline-none focus:ring-4 focus:ring-pink-500">
Copy Link
</button>
</div>
</div>Composants associés
Composant Boutons de partage social
Composant de boutons de partage social avec un design rétro/vintage, une palette de couleurs de tons de terre, un niveau de complexité simple et un design réactif avec prise en charge du thème sombre, à des fins de médias sociaux à l’aide de Tailwind CSS.
Composant Boutons de partage social
Un ensemble de boutons de partage social dynamiques, inspirés de la 3D, adaptés aux sites Web de restauration et d’alimentation, avec une réactivité totale et une prise en charge du mode sombre.
Composant Boutons de partage social
Un composant réactif de boutons de partage social conçu avec un style skeuomorphique en niveaux de gris pour la consommation de contenu de blog. Inclut la prise en charge du mode sombre.