Web Code
Login
Sign Up
HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/remixicon@4.5.0/fonts/remixicon.css" rel="stylesheet" /> </head> <body> <section class="footer_main"> <div class="container"> <div class="row"> <div class="col-md-2"> <h3 class="footer_title">About</h3> <ul class="footer_page_link"> <li><a href="">Home</a></li> <li><a href="">About Us</a></li> <li><a href="">Blogs</a></li> <li><a href="">Careers</a></li> <li><a href="">Media</a></li> <li><a href="">Green Initiative</a></li> <li><a href="">Design Process</a></li> <li><a href="">Sitemap</a></li> </ul> </div> <div class="col-md-2"> <h3 class="footer_title">Products</h3> <ul class="footer_page_link"> <li><a href="">Residential LED Lights</a></li> <li><a href="">Commercial LED Lights</a></li> <li><a href="">Industrial LED Lights</a></li> </ul> </div> <div class="col-md-2"> <h3 class="footer_title">Support</h3> <ul class="footer_page_link"> <li><a href="">FAQs</a></li> <li><a href="">Register Product</a></li> <li><a href="">Service Requests</a></li> <li><a href="">Product Manuals</a></li> <li><a href="">Warranty Information</a></li> <li><a href="">Ledure One App</a></li> </ul> </div> <div class="col-md-2"> <h3 class="footer_title">Policy</h3> <ul class="footer_page_link"> <li><a href="">Privacy Policy</a></li> <li><a href="">Shipping Policy</a></li> <li><a href="">Returns and</a></li> <li><a href="">Cancellations Policy</a></li> <li><a href="">Disclaimer</a></li> <li><a href="">Terms of Use</a></li> <li><a href="">Loyalty Program T&C</a></li> </ul> </div> <div class="col-md-2"> <h3 class="footer_title">Contact</h3> <ul class="footer_page_link"> <li><a href="">Contact Us</a></li> <li><a href="">Locate Stores</a></li> <li><a href="">Service & Support</a></li> <li><a href="">Request A Callback</a></li> </ul> </div> <div class="col-md-2"> <h3 class="footer_title">Help</h3> <ul class="footer_page_link"> <li><a href="">Payment</a></li> <li><a href="">Shipping</a></li> <li><a href="">FAQ's</a></li> </ul> </div> </div> <div class="row pt-5 align-items-center"> <div class="col-md-3"> <ul class="socail_icon"> <li><a href="#" target="_blank"><i class="ri-facebook-fill"></i></a></li> <li><a href="#" target="_blank"><i class="ri-instagram-line"></i></a></li> <li><a href="#" target="_blank"><i class="ri-twitter-x-line"></i></a></li> <li><a href="#" target="_blank"><i class="ri-linkedin-fill"></i></a></li> <li><a href="#" target="_blank"><i class="ri-youtube-fill"></i></a></li> </ul> </div> <div class="col-md-6"></div> <div class="col-md-3"> <div class="footer_logo"> <img src="https://themeelements.com/img/themeelement-logo.png" alt=""> </div> </div> </div> <div class="border_divder"></div> <div class="footer_bottom"> <div class="row"> <div class="col-md-4"> <h3 class="footer_bottom_title">Manufacturer </h3> <p>Address</p> </div> <div class="col-md-4"> <h3 class="footer_bottom_title">About us</h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </div> <div class="col-md-4"> <p>© Copyright 2025 themeelements India Ltd. All rights reserved.</p> </div> </div> </div> </div> </section> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script> </body> </html>
CSS
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap'); *{ margin: 0; padding: 0; box-sizing: border-box; font-family: "Poppins" , sans-serif; } .footer_main { background: #151515; border-top: 5px solid #57c310; padding: 50px 0; position: relative; } .footer_main p { color:#ccc; } .footer_title { color: #b1b2b3; font-size: 25px; } .footer_page_link { margin: 0; padding: 0; list-style: none; } .footer_bottom_title { color: #b1b2b3; } .footer_page_link li a { color: #95979a; text-decoration: none; font-size: 14px; } .footer_page_link li a:hover { color: #fff; } .socail_icon { margin: 0; padding: 0; list-style: none; } .socail_icon li { display: inline-block; } .socail_icon li a { text-decoration: none; color: #000; background: #b1b2b3; width: 40px; display: block; height: 40px; border-radius: 5px; font-size: 22px; text-align: center; line-height: 40px; margin-right: 10px; } .socail_icon li a:hover { background: #fff; } .footer_logo { margin-bottom:20px; text-align:right; } .footer_logo img { width:200px; }
JS
Output
