HTML 코드
<footer class="bg-gray-100 dark:bg-gray-900 text-gray-800 dark:text-gray-200 py-10">
<div class="container mx-auto px-4">
<div class="flex flex-wrap justify-between items-center">
<div class="w-full md:w-1/3 mb-6 md:mb-0">
<h3 class="text-xl font-bold mb-3">3D Footer</h3>
<p class="text-sm">Explore the depths of our amazing footer. Designed with a touch of 3D for an immersive experience.</p>
</div>
<div class="w-full md:w-1/3 mb-6 md:mb-0">
<h4 class="text-lg font-semibold mb-3">Quick Links</h4>
<ul class="space-y-2">
<li><a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">Home</a></li>
<li><a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">Services</a></li>
<li><a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">About Us</a></li>
<li><a href="#" class="hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">Contact</a></li>
</ul>
</div>
<div class="w-full md:w-1/3">
<h4 class="text-lg font-semibold mb-3">Contact Us</h4>
<p class="text-sm">Email: [email protected]</p>
<p class="text-sm">Phone: +1 234 567 890</p>
<div class="flex mt-4 space-x-4">
<a href="#" class="text-gray-800 dark:text-gray-200 hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">
<i class="fab fa-facebook-f"></i>
</a>
<a href="#" class="text-gray-800 dark:text-gray-200 hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">
<i class="fab fa-twitter"></i>
</a>
<a href="#" class="text-gray-800 dark:text-gray-200 hover:text-gray-600 dark:hover:text-gray-400 transition duration-300 ease-in-out">
<i class="fab fa-instagram"></i>
</a>
</div>
</div>
</div>
<div class="mt-8 text-center text-sm">
<p>© 2023 3D Footer. All rights reserved.</p>
</div>
</div>
</footer>