CCHub Logo CCHub Tailwind Collection
Komponenten Komponenten für die Inhaltsanzeige Komponente "Inhaltsanzeige"

Komponente "Inhaltsanzeige"

Eine reaktionsschnelle Inhaltsanzeigekomponente im Glassmorphism-Stil mit verschwommenem Hintergrund und durchscheinenden Elementen mit Unterstützung für den Dunkelmodus.

Vorschau

HTML-Code 

<div class="min-h-screen flex items-center justify-center bg-gray-100 dark:bg-gray-900 p-5">
    <div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg p-6 backdrop-filter backdrop-blur-lg bg-opacity-30 border border-gray-200 dark:border-gray-700">
        <h2 class="text-2xl font-bold text-gray-800 dark:text-white mb-4">Content Display Title</h2>
        <p class="text-gray-600 dark:text-gray-300 mb-4">This component features a glassmorphism style with blurred background and translucent elements.</p>
        <div class="flex items-center space-x-4 mb-4">
            <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Avatar" class="w-10 h-10 rounded-full">
            <div>
                <h3 class="text-lg font-medium text-gray-800 dark:text-white">User Name</h3>
                <span class="text-sm text-gray-500 dark:text-gray-400">User Title</span>
            </div>
        </div>
        <img src="https://picsum.photos/400/200" alt="Random Image" class="rounded-lg mb-4">
        <button class="bg-blue-500 hover:bg-blue-600 text-white font-semibold py-2 px-4 rounded transition duration-200">Read More</button>
    </div>
</div>

Verwandte Komponenten

Art-Déco-Komponente für die Anzeige von Inhalten

Eine komplexe, reaktionsschnelle, vom Art Deco inspirierte Inhaltsanzeigekomponente für Geschäfts-/Unternehmenswebsites mit geometrischen Mustern, satten Juwelentönen und Unterstützung für den Dunkelmodus. Enthält mehrere Abschnitte für Funktionen, Erfahrungsberichte und Handlungsaufforderungen.

Offen

Verspielte juwelenfarbene Anzeige von Fotografie-Inhalten

Eine komplexe, spielerische und unterhaltsame Komponente zur Anzeige von Inhalten für ein Fotoportfolio oder eine Fotogalerie mit hellen Juwelentönen, abgerundeten Elementen und einem responsiven Design mit Unterstützung für den Dunkelmodus. Es zeigt mehrere interaktive Elemente wie ausgewählte Bilder, Rasterlayouts und Profilabschnitte.

Offen

Komponenten für die Inhaltsanzeige

Eine einfache responsive Content-Display-Komponente im Vintage-Stil für den E-Commerce, die ein monochromatisches Farbschema verwendet und den Dunkelmodus unterstützt.

Offen