Composant de plan du site
Un composant de plan de site réactif conçu en mode sombre à l’aide de Tailwind CSS.
HTML Code
<div class="bg-gray-900 text-white p-5 rounded-lg shadow-lg">
<h2 class="text-2xl font-bold mb-4">Site Map</h2>
<ul class="space-y-3">
<li class="hover:text-gray-400 transition duration-300">
<a href="#" class="flex items-center space-x-2">
<img src="https://picsum.photos/30/30" alt="Random Placeholder" class="rounded-full" />
<span>Home</span>
</a>
</li>
<li class="hover:text-gray-400 transition duration-300">
<a href="#" class="flex items-center space-x-2">
<img src="https://picsum.photos/30/30" alt="Random Placeholder" class="rounded-full" />
<span>About Us</span>
</a>
</li>
<li class="hover:text-gray-400 transition duration-300">
<a href="#" class="flex items-center space-x-2">
<img src="https://picsum.photos/30/30" alt="Random Placeholder" class="rounded-full" />
<span>Services</span>
</a>
</li>
<li class="hover:text-gray-400 transition duration-300">
<a href="#" class="flex items-center space-x-2">
<img src="https://picsum.photos/30/30" alt="Random Placeholder" class="rounded-full" />
<span>Contact</span>
</a>
</li>
<li class="hover:text-gray-400 transition duration-300">
<a href="#" class="flex items-center space-x-2">
<img src="https://picsum.photos/30/30" alt="Random Placeholder" class="rounded-full" />
<span>Privacy Policy</span>
</a>
</li>
</ul>
<div class="mt-5">
<h3 class="text-xl font-semibold">Follow Us</h3>
<ul class="flex space-x-4 mt-2">
<li><img src="https://randomuser.me/api/portraits/men/1.jpg" alt="Avatar" class="rounded-full w-8 h-8" /></li>
<li><img src="https://randomuser.me/api/portraits/women/1.jpg" alt="Avatar" class="rounded-full w-8 h-8" /></li>
<li><img src="https://randomuser.me/api/portraits/men/2.jpg" alt="Avatar" class="rounded-full w-8 h-8" /></li>
</ul>
</div>
</div>
Composants associés
Composant de plan du site
Un composant de plan de site conçu selon les principes de conception matérielle à l’aide de Tailwind CSS, avec des mises en page réactives, des animations et la prise en charge des thèmes sombres.
Plan du site - Finance Banque
Un composant de sitemap simple et réactif pour les interfaces finance/banque, doté d’une interface utilisateur en mode sombre avec des tons sépia/bruns. Optimisé pour les ordinateurs de bureau, les tablettes et les mobiles, avec une prise en charge complète du mode sombre.
Glassmorphism Composant de plan du site
Un composant de plan de site réactif avec un design de glassmorphism, une palette de couleurs analogue et une prise en charge du mode sombre, adapté aux sites Web d’entreprise et d’entreprise.