Componente de mensajes de error
Un componente de mensajes de error responsivo que utiliza los principios de Material Design, con un esquema de color triádico y compatibilidad con el modo oscuro, adaptado a una cartera.
Código HTML
<div class="flex flex-col items-center justify-center p-5 bg-white rounded-lg shadow-md dark:bg-gray-800">
<img src="https://picsum.photos/200/100" alt="Error Image" class="rounded-lg shadow-sm mb-4">
<div class="text-center">
<h2 class="text-lg font-bold text-red-600 dark:text-red-400">Error Occurred!</h2>
<p class="mt-2 text-sm text-gray-600 dark:text-gray-300">Oops! Something went wrong while trying to display the content.</p>
<p class="mt-2 text-sm text-gray-600 dark:text-gray-300">Please try again later or contact support.</p>
<button class="mt-4 px-4 py-2 bg-blue-500 text-white rounded hover:bg-blue-600 dark:bg-blue-700 dark:hover:bg-blue-800">Retry</button>
</div>
</div>Componentes relacionados
Componente de mensajes de error
Un componente de mensajes de error responsivos que presenta animaciones atractivas para las interacciones del usuario y admite el tema oscuro mediante Tailwind CSS.
Componente de error de otoño juguetón
Un componente de mensaje de error lúdico y alegre diseñado con colores otoñales, estética redondeada y soporte de modo oscuro, adecuado para sitios de documentación o wiki.
Componente de mensajes de error - Citas/Social - Sepia oscuro
Un componente de mensaje de error complejo diseñado para plataformas de citas/redes sociales, con un esquema de color sepia oscuro, capacidad de respuesta total y compatibilidad con modo oscuro para reducir la fatiga visual.