Composant Colonnes
Un composant de colonnes conçu avec le style Glassmorphism, des couleurs vives et une disposition simple, adaptée à un tableau de bord.
HTML Code
<div class="flex flex-col md:flex-row md:space-x-4 p-6 bg-gray-900 dark:bg-gray-800 rounded-lg backdrop-blur-lg border border-transparent border-gray-600">
<div class="flex-1 p-4 bg-white bg-opacity-20 rounded-lg shadow-md dark:bg-gray-700">
<h2 class="text-xl font-bold text-white mb-2">Column 1</h2>
<img src="https://picsum.photos/200/100" alt="Image 1" class="w-full rounded-lg mb-2" />
<p class="text-white">This is a description for the first column. Use this space to display key metrics or important information.</p>
</div>
<div class="flex-1 p-4 bg-white bg-opacity-20 rounded-lg shadow-md dark:bg-gray-700">
<h2 class="text-xl font-bold text-white mb-2">Column 2</h2>
<img src="https://picsum.photos/200/100" alt="Image 2" class="w-full rounded-lg mb-2" />
<p class="text-white">This is a description for the second column. Provide insights, visualizations, or controls related to the data here.</p>
</div>
<div class="flex-1 p-4 bg-white bg-opacity-20 rounded-lg shadow-md dark:bg-gray-700">
<h2 class="text-xl font-bold text-white mb-2">Column 3</h2>
<img src="https://picsum.photos/200/100" alt="Image 3" class="w-full rounded-lg mb-2" />
<p class="text-white">This is a description for the third column. Summary or additional data visuals can fit nicely in this space.</p>
</div>
</div>Composants associés
3D_Vibrant_Columns_Component
Un composant de colonnes complexe, dynamique et réactif inspiré de la 3D, adapté à la documentation et aux sites wiki, avec prise en charge du mode sombre, des animations subtiles et du HTML sémantique.
Composant Colonnes
Un composant de colonnes réactives conçu pour le mode sombre à l’aide de Tailwind CSS, avec des espaces réservés d’avatar et d’image.
Composant Colonnes
Un composant de colonnes réactives conçu avec Glassmorphism, en utilisant un schéma de couleurs triadique pour un site Web d’entreprise. Il présente des éléments translucides givrés ressemblant à du verre givré, des effets de flou et convient au mode sombre.