Componente Layout 3D
Un componente di layout per social media 3D Design reattivo con una combinazione di colori in scala di grigi. Adatto per interfacce di social networking.
Codice HTML
<div class="bg-white dark:bg-gray-800 shadow-lg rounded-lg p-6 mb-6 transform hover:scale-105 transition-transform duration-300">
<div class="flex items-center mb-4">
<img src="https://randomuser.me/api/portraits/men/10.jpg" alt="User Avatar" class="w-12 h-12 rounded-full shadow-md border-2 border-gray-300 dark:border-gray-700">
<h2 class="text-gray-800 dark:text-white text-lg font-semibold ml-4">User Name</h2>
</div>
<div class="mb-4">
<img src="https://picsum.photos/400/200" alt="Post Image" class="rounded-lg shadow-md">
</div>
<div class="text-gray-600 dark:text-gray-300">
<p class="mb-2">This is a simple social media post showcasing a 3D design layout. Engage with your network in style!</p>
</div>
<div class="mt-4 flex space-x-4">
<button class="bg-gray-800 text-white rounded-md px-4 py-2 transition-colors duration-300 hover:bg-gray-600">Like</button>
<button class="bg-gray-800 text-white rounded-md px-4 py-2 transition-colors duration-300 hover:bg-gray-600">Comment</button>
</div>
</div>Componenti correlati
Layout retrò per i social media
Un layout semplice e monocromatico a tema retrò per i social media, con supporto per la modalità oscura.
Layout del cruscotto di Glassmorphism
Un complesso componente di layout del cruscotto con vetromorfismo triadico con una barra laterale, un'area di contenuto principale e più pannelli traslucidi, completamente reattivo e con supporto per la modalità oscura. Progettato per la visualizzazione dei dati e i pannelli di controllo.
Glassmorphism_Social_Media_Layout_Component
Un componente di layout per social media complesso e reattivo con design glassmorphism con elementi traslucidi smerigliati, effetti di sfocatura e una combinazione di colori complementari. Include una barra laterale, un'area del contenuto principale e una barra laterale destra, tutte con supporto per la modalità oscura.