Retro Vintage Modal Komponente
Eine einfache Retro-/Vintage-Modalkomponente mit einem komplementären Farbschema für die Präsentation von Arbeiten oder Produkten, die mit Tailwind CSS entworfen wurde.
HTML-Code
<div class="fixed inset-0 flex items-center justify-center bg-gray-900 bg-opacity-80 dark:bg-black dark:bg-opacity-90"> <div class="bg-yellow-300 dark:bg-yellow-700 text-gray-800 dark:text-gray-200 rounded-lg p-6 max-w-md w-full shadow-lg"> <h2 class="text-lg font-bold mb-4">My Portfolio Item</h2> <img class="mb-4 rounded" src="https://picsum.photos/300/200" alt="Portfolio Item"> <p class="mb-4">This is a short description of the portfolio item showcasing the work or product. Explore more to find out how it can benefit you!</p> <div class="flex items-center"> <img class="rounded-full w-10 h-10 mr-2" src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar"> <span class="font-semibold">John Doe</span> </div> <div class="mt-6 flex justify-end"> <button class="bg-yellow-500 hover:bg-yellow-600 dark:bg-yellow-600 dark:hover:bg-yellow-500 text-white font-bold py-2 px-4 rounded">Close</button> </div> </div></div>Verwandte Komponenten
Glassmorphism_Dashboard_Modal
Eine komplexe, reaktionsschnelle Glassmorphism-Modalkomponente mit monochromatischem Styling, die sich für die Datenvisualisierung im Armaturenbrett und in Bedienfeldern eignet, einschließlich Unterstützung des Dunkelmodus.
Organic_Nature_Modal_Documentation
Eine einfache, reaktionsschnelle Modalkomponente mit einem organischen/von der Natur inspirierten Design in Erdtönen, geeignet für Dokumentations- oder Wiki-Seiten. Enthält Unterstützung für den Dunkelmodus.
Modale Komponente
Eine komplexe, reaktionsschnelle Modalkomponente mit einem Schwarz-Weiß- und Akzent-Farbschema mit Farbverlaufsübergängen, die für Fertigungs-/Industrieanwendungen geeignet sind. Inklusive Unterstützung für den Dunkelmodus.