CCHub Logo CCHub Tailwind Collection
Komponenten Erfolgsmeldungen Komponente "Erfolgsmeldungen"

Komponente "Erfolgsmeldungen"

Eine Komponente zum Anzeigen von Erfolgsmeldungen mit einem 3D-Designstil, responsiven Effekten und Unterstützung für dunkle Designs mithilfe von Tailwind CSS.

Vorschau

HTML-Code 

<div class="p-6 max-w-md mx-auto bg-white rounded-lg shadow-md dark:bg-gray-800 transition duration-300 ease-in-out transform hover:scale-105">
    <div class="flex items-center mb-4">
        <img src="https://picsum.photos/50/50?random=1" alt="User Avatar" class="w-12 h-12 rounded-full mr-4 shadow-lg dark:shadow-xl">
        <div class="flex-1">
            <h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200">Success!</h2>
            <p class="text-gray-600 dark:text-gray-400">Your action was completed successfully.</p>
        </div>
    </div>
    <div class="flex items-center justify-between mt-4 pt-4 border-t border-gray-200 dark:border-gray-700">
        <span class="text-sm text-gray-500 dark:text-gray-400">2 minutes ago</span>
        <a href="#" class="inline-flex items-center text-blue-600 hover:text-blue-500 dark:text-blue-400 dark:hover:text-blue-300">View Details</a>
    </div>
</div>

Verwandte Komponenten

Komponente "Erfolgsmeldungen"

Eine Erfolgsmeldungs-Komponente, die im Dunkelmodus für das Lesen von Blogs/Inhalten entwickelt wurde. Es verfügt über ein analoges Farbschema und ist reaktionsschnell.

Offen

Komponente "Erfolgsmeldungen"

Eine reaktionsschnelle Komponente, die Erfolgsmeldungen in einem minimalistischen Stil anzeigt und sich für die Präsentation von Arbeiten oder Produkten mit Unterstützung für dunkle Themen eignet.

Offen

Erfolgsbotschaft des Art déco

Eine vom Art Deco inspirierte Erfolgsbotschaft mit einer Retro-/Vintage-Farbpalette, die für Unterhaltungs-/Medienplattformen entwickelt wurde. Es verfügt über geometrische Muster, luxuriöses Design und ist mit Unterstützung des Dunkelmodus vollständig reaktionsschnell.

Offen