Composant de conteneur
Un conteneur réactif en mode sombre pour le contenu de blog avec un design simple en niveaux de gris.
HTML Code
<div class="container mx-auto p-4 dark:bg-gray-900 bg-white text-gray-800 dark:text-gray-200 rounded-lg shadow-lg">
<h1 class="text-2xl font-bold mb-4 text-center">Blog Post Title</h1>
<img src="https://picsum.photos/seed/unsplash/800/400" alt="Blog Post Image" class="w-full h-auto rounded-md mb-4">
<div class="prose dark:prose-invert max-w-none">
<p>This is an example of a blog post content paragraph within the container. It demonstrates a simple layout for reading and content consumption in dark mode.</p>
<p>The container is designed to be responsive and uses Tailwind CSS classes for styling, including dark mode support with the <code class="language-text">dark:</code> prefix.</p>
<p>Grayscale colors are used for a clean and minimalist look.</p>
</div>
</div>Composants associés
Composant de conteneur
Un composant de conteneur minimaliste pour un tableau de bord utilisant Tailwind CSS avec prise en charge du mode sombre.
Composant de conteneur
Un composant de conteneur de style 3D adapté aux sites Web d’entreprise, avec des couleurs vives et des éléments interactifs, ainsi qu’un design réactif avec prise en charge du thème sombre.
Fiche produit e-commerce Neumorphic
Une fiche produit e-commerce simple et réactive avec un style de conception neumorphique en niveaux de gris, avec prise en charge du mode sombre.