Industrial_Rainbow_Footer_Navigation
一个简单、响应式的页脚导航组件，具有工业美学、裸露的元素和多色彩虹渐变背景，专为金融/银行界面量身定制。包括深色模式支持。
HTML 代码
<footer class="bg-gradient-to-r from-red-500 via-yellow-500 to-blue-500 dark:from-gray-900 dark:via-zinc-800 dark:to-stone-700 p-4 text-white uppercase tracking-wider font-mono shadow-inner border-t-2 border-l-2 border-r-2 border-b-8 border-gray-700 dark:border-gray-950">
<div class="container mx-auto flex flex-col md:flex-row justify-between items-center space-y-4 md:space-y-0">
<div class="text-sm text-gray-100 dark:text-gray-400 opacity-80">
<p>© 2023 Nexus Bank Co. All Rights Reserved.</p>
<p class="mt-1">Built with raw power and precision.</p>
</div>
<nav class="flex flex-wrap justify-center space-x-4 sm:space-x-6">
<a href="#" class="text-sm hover:text-gray-200 dark:hover:text-gray-300 transition-colors duration-200
border-b border-white hover:border-gray-200 dark:border-gray-500 dark:hover:border-gray-300
pb-1">About Us</a>
<a href="#" class="text-sm hover:text-gray-200 dark:hover:text-gray-300 transition-colors duration-200
border-b border-white hover:border-gray-200 dark:border-gray-500 dark:hover:border-gray-300
pb-1">Services</a>
<a href="#" class="text-sm hover:text-gray-200 dark:hover:text-gray-300 transition-colors duration-200
border-b border-white hover:border-gray-200 dark:border-gray-500 dark:hover:border-gray-300
pb-1">Pricing</a>
<a href="#" class="text-sm hover:text-gray-200 dark:hover:text-gray-300 transition-colors duration-200
border-b border-white hover:border-gray-200 dark:border-gray-500 dark:hover:border-gray-300
pb-1">Security</a>
<a href="#" class="text-sm hover:text-gray-200 dark:hover:text-gray-300 transition-colors duration-200
border-b border-white hover:border-gray-200 dark:border-gray-500 dark:hover:border-gray-300
pb-1">Support</a>
</nav>
</div>
</footer>