CCHub Logo CCHub Tailwind Collection
Komponenten Warnmeldungen Komponente "Warnmeldungen"

Komponente "Warnmeldungen"

Eine reaktionsschnelle Komponente für skeuomorphe Warnmeldungen, die für den Konsum von Blogs/Inhalten entwickelt wurde, mit einem komplementären Farbschema und Unterstützung für dunkle Themen.

Vorschau

HTML-Code 

<div class="max-w-md mx-auto p-4 bg-gray-100 dark:bg-gray-800 rounded-lg shadow-lg">
    <div class="flex items-center mb-4">
        <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="w-12 h-12 rounded-full mr-3">
        <h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Alert Title</h2>
    </div>
    <p class="text-gray-700 dark:text-gray-300">
        This is a simple alert message that mimics real-world alert styles, using complementary colors for the design.
    </p>
    <div class="mt-4 flex justify-end">
        <img src="https://picsum.photos/150/50?random" alt="Illustration" class="rounded-md shadow-md">
    </div>
</div>

Verwandte Komponenten

Komponente "Warnmeldungen"

Responsive Alert Message Component mit Mikrointeraktionen, Pastell-Farbschema, komplexem Design, Geschäfts-/Unternehmenszweck, Unterstützung des Dunkelmodus und ohne JavaScript.

Offen

OrganicNatureInspiredAlert

Eine einfache, reaktionsschnelle Komponente für Warnmeldungen mit einem organischen/von der Natur inspirierten Design und einem komplementären Farbschema, geeignet für Beratungs-/Dienstleistungswebsites. Enthält Unterstützung für den Dunkelmodus.

Offen

Retro_Alert_Messages_Component

Eine einfache, reaktionsschnelle Komponente für Warnmeldungen mit einem Retro-/Vintage-Farbschema in Schwarz, Weiß und Neon-Akzenten, die für ein Armaturenbrett geeignet ist. Enthält Unterstützung für den Dunkelmodus.

Offen