Composants Messages d’erreur Composant Messages d’erreur

Composant Messages d’erreur

Composant de messages d’erreur avec conception 3D, schéma de couleurs monochromatique, complexité modérée pour le tableau de bord, conception réactive avec prise en charge du thème sombre.

Aperçu

HTML Code

<div class="flex items-center justify-center h-screen bg-gray-100 dark:bg-gray-900">
  <div class="relative">
    <div class="absolute inset-0 bg-gradient-to-r from-purple-400 to-purple-600 transform -skew-y-3 rotate-1 scross-y-3 rounded-3xl dark:from-purple-700 dark:to-purple-900"></div>
    <div class="relative bg-white p-10 rounded-xl shadow-2xl text-center dark:bg-gray-800">
      <h1 class="text-3xl font-bold text-red-500 dark:text-red-400">Error!</h1>
      <p class="mt-4 text-gray-700 dark:text-gray-300">Something went wrong. Please try again later.</p>
      <button class="mt-6 px-8 py-2 bg-purple-500 text-white rounded-full hover:bg-purple-600 focus:outline-none focus:ring-2 focus:ring-purple-600 focus:ring-opacity-50 dark:bg-purple-600 dark:hover:bg-purple-700 dark:focus:ring-purple-700">Retry</button>
    </div>
  </div>
</div>

Composants associés

Composant Messages d’erreur

Un composant de message d’erreur simple, propre et réactif avec un style de typographie suisse/international et une palette de couleurs océan/bleu, adapté aux sites Web de livraison de nourriture et de restaurants. Inclut la prise en charge du mode sombre.

Ouvrir

Composant Messages d’erreur

Un composant de messages d’erreur réactif avec des animations attrayantes pour les interactions avec l’utilisateur et prenant en charge le thème sombre à l’aide de Tailwind CSS.

Ouvrir

Composant Messages d’erreur

Un composant réactif de messages d’erreur conçu pour les interfaces de réseaux sociaux, utilisant un mode sombre et un schéma de couleurs en niveaux de gris avec Tailwind CSS.

Ouvrir