Composants Nuage de balises Composant de nuage de balises

Composant de nuage de balises

Un composant de nuage de balises conçu avec un style skeuomorphique, des effets réactifs et une prise en charge du thème sombre à l’aide de Tailwind CSS.

Aperçu

HTML Code

<div class="bg-gray-100 dark:bg-gray-800 p-6 rounded-lg shadow-lg transition-all duration-300 hover:shadow-xl">
    <h2 class="text-xl font-semibold mb-4">Tag Cloud</h2>
    <div class="flex flex-wrap gap-2">
        <a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Web Development</a>
        <a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Design</a>
        <a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">SEO</a>
        <a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Marketing</a>
        <a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Programming</a>
        <a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Networking</a>
        <a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Cloud Computing</a>
        <a href="#" class="bg-white dark:bg-gray-700 text-gray-800 dark:text-white rounded-full px-4 py-2 shadow-md transition-transform transform hover:scale-105">Data Science</a>
    </div>
</div>

Composants associés

Composant de nuage de balises 13

Un composant Tag Cloud conçu avec le style Neumorphism. Il présente un style d’interface utilisateur doux avec des éléments semblant s’extruder de l’arrière-plan à l’aide d’ombres subtiles. Le composant prend en charge le responsive design et les thèmes sombres.

Ouvrir

Composant de nuage de balises

Un composant de nuage de balises réactif conçu pour l’interface utilisateur en mode sombre, présentant un portefeuille avec une palette de couleurs analogue.

Ouvrir

Composant de nuage de balises

Un composant de nuage de balises réactif avec des couleurs en niveaux de gris et des micro-interactions, conçu pour les interfaces de médias sociaux avec prise en charge du thème sombre.

Ouvrir