CCHub Logo CCHub Tailwind Collection
Komponenten Soziale Komponenten Komponente "Soziale Komponenten"

Komponente "Soziale Komponenten"

Eine einfache, reaktionsschnelle Social-Media-Komponente mit ansprechenden Animationen und einem dunklen Thema, die Tailwind CSS verwendet.

Vorschau

HTML-Code 

<div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6 transition-transform transform hover:scale-105 duration-300 ease-in-out">
    <div class="flex items-center space-x-4 mb-4">
        <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User Avatar" class="w-12 h-12 rounded-full">
        <div class="flex-1">
            <h2 class="text-lg font-semibold text-gray-800 dark:text-white">John Doe</h2>
            <p class="text-gray-600 dark:text-gray-400">@johndoe</p>
        </div>
    </div>
    <div class="mb-4">
        <p class="text-gray-700 dark:text-gray-300">This is a sample post demonstrating social media interactions with engaging microinteractions.</p>
    </div>
    <div class="flex space-x-4">
        <button class="bg-blue-500 hover:bg-blue-600 text-white py-2 px-4 rounded transition duration-200 ease-in-out">
            Like
        </button>
        <button class="bg-green-500 hover:bg-green-600 text-white py-2 px-4 rounded transition duration-200 ease-in-out">
            Comment
        </button>
        <button class="bg-red-500 hover:bg-red-600 text-white py-2 px-4 rounded transition duration-200 ease-in-out">
            Share
        </button>
    </div>
</div>

Verwandte Komponenten

Komponente "Soziale Komponenten"

Soziale Komponenten Komponente mit einem skeuomorphen Design, komplementärem Farbschema und mäßiger Komplexität. Es wurde für Geschäfts-/Unternehmenswebsites entwickelt, ist reaktionsschnell und unterstützt dunkle Themen.

Offen

Komponente "Soziale Komponenten"

Eine einfache Social-Media-Komponente, die mit Skeuomorphismus und einem monochromatischen Farbschema für Blog-Inhalte entwickelt wurde. Es verfügt über ein responsives Layout und Unterstützung für dunkle Themen mit Tailwind CSS.

Offen

Komponente "Soziale Komponenten"

Eine reaktionsschnelle Social-Media-Komponente, die mit einer Retro-/Vintage-Ästhetik gestaltet wurde, mit einer reichhaltigen Benutzeroberfläche mit mehreren interaktiven Elementen und einem dunklen Thema.

Offen