Composant Messages d’alerte
Un composant de messages d’alerte skeuomorphe réactif conçu pour la consommation de blogs/contenus, avec une palette de couleurs complémentaires et la prise en charge du thème sombre.
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>Composants associés
Composant Messages d’alerte
Composant Messages d’alerte avec le style Material Design, la palette de couleurs pastel et le niveau de complexité complexe, à des fins de portefeuille. Conception réactive avec prise en charge du thème sombre. Pas besoin de code JavaScript, seulement du HTML avec des classes Tailwind. Le mode sombre utilise le préfixe dark : de Tailwind pour le coiffage. Images Utilisez picsum.photos pour les images et randomuser.me pour les avatars.
Composant Messages d’alerte
Un composant de messages d’alerte de style brutaliste avec une palette de couleurs pastel, conçu pour les sites Web d’entreprise et réactif avec la prise en charge du thème sombre.
Composant Messages d’alerte
Un composant de message d’alerte simple, réactif et en niveaux de gris pour les sites de commerce électronique, avec prise en charge du mode sombre.