CCHub Logo CCHub Tailwind Collection
Komponenten Tag Cloud Tag-Cloud-Komponente

Tag-Cloud-Komponente

Eine Tag-Cloud-Komponente, die im Neumorphism-Stil entworfen wurde, ein monochromatisches Farbschema für E-Commerce-Zwecke verwendet und dunkles Design mit responsivem Design unterstützt.

Vorschau

HTML-Code 

<div class="flex flex-wrap justify-center mt-10 p-5 bg-gray-100 dark:bg-gray-900 rounded-lg shadow-lg">
    <h2 class="w-full text-2xl font-semibold text-center text-gray-800 dark:text-gray-200 mb-5">Explore Tags</h2>
    <div class="flex flex-wrap justify-center gap-4">
        <span class="bg-gray-200 dark:bg-gray-800 text-gray-800 dark:text-gray-200 px-4 py-2 rounded-full shadow-md hover:shadow-lg transition-all cursor-pointer transform hover:-translate-y-1">Fashion</span>
        <span class="bg-gray-200 dark:bg-gray-800 text-gray-800 dark:text-gray-200 px-4 py-2 rounded-full shadow-md hover:shadow-lg transition-all cursor-pointer transform hover:-translate-y-1">Electronics</span>
        <span class="bg-gray-200 dark:bg-gray-800 text-gray-800 dark:text-gray-200 px-4 py-2 rounded-full shadow-md hover:shadow-lg transition-all cursor-pointer transform hover:-translate-y-1">Home & Living</span>
        <span class="bg-gray-200 dark:bg-gray-800 text-gray-800 dark:text-gray-200 px-4 py-2 rounded-full shadow-md hover:shadow-lg transition-all cursor-pointer transform hover:-translate-y-1">Books</span>
        <span class="bg-gray-200 dark:bg-gray-800 text-gray-800 dark:text-gray-200 px-4 py-2 rounded-full shadow-md hover:shadow-lg transition-all cursor-pointer transform hover:-translate-y-1">Beauty</span>
    </div>
</div>

Verwandte Komponenten

Tag-Cloud-Komponente - Marktplatz Sepia/Braunes Materialdesign

Eine komplexe, reaktionsschnelle Tag-Cloud-Komponente, die für Marktplatzplattformen entwickelt wurde und Material Design-Prinzipien mit Sepia-/Brauntönen verwendet. Bietet interaktive Tags, Kategoriefilterung und Unterstützung für den Dunkelmodus.

Offen

Tag-Cloud-Komponente

Eine reaktionsschnelle Tag-Cloud-Komponente mit Graustufenfarben und Mikrointeraktionen, die für Social-Media-Schnittstellen mit Unterstützung für dunkle Themen entwickelt wurde.

Offen

Tag-Cloud-Komponente für die Landwirtschaft/Ackerbau

Eine minimalistische und reaktionsschnelle Tag-Cloud-Komponente, die für landwirtschaftliche Websites entwickelt wurde, mit coolen neutralen Farben und Unterstützung für den Dunkelmodus.

Offen