→ Anonymous
→ CSS footer

CSS footer

This Example is contributed by Anonymous, on 11-May-2025. It is responsive. similar terms for this example is Email campaign

Footer Newsletter Navigation Contact

Author Anonymous

Fork Fullscreen

<footer class="footer-container">
  <div class="footer-content">
    <div class="footer-section about">
      <h2 class="footer-title">About Us</h2>
      <p>We are dedicated to providing exceptional services and products to our customers. Our mission is to create value and make a difference.</p>
      <div class="social-links">
        <a href="#" aria-label="Facebook"><i class="fa fa-facebook"></i></a>
        <a href="#" aria-label="Twitter"><i class="fa fa-twitter"></i></a>
        <a href="#" aria-label="Instagram"><i class="fa fa-instagram"></i></a>
        <a href="#" aria-label="LinkedIn"><i class="fa fa-linkedin"></i></a>
      </div>
    </div>
    
    <div class="footer-section links">
      <h2 class="footer-title">Quick Links</h2>
      <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">Services</a></li>
        <li><a href="#">Products</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Contact</a></li>
      </ul>
    </div>
    
    <div class="footer-section contact">
      <h2 class="footer-title">Contact Us</h2>
      <ul class="contact-info">
        <li><i class="fa fa-map-marker"></i> 123 Business Street, City, Country</li>
        <li><i class="fa fa-phone"></i> +1 234 567 8900</li>
        <li><i class="fa fa-envelope"></i> info@company.com</li>
        <li><i class="fa fa-clock-o"></i> Mon-Fri: 9am to 6pm</li>
      </ul>
    </div>
    
    <div class="footer-section subscribe">
      <h2 class="footer-title">Subscribe</h2>
      <p>Subscribe to our newsletter for updates and offers.</p>
      <form action="#" method="post" class="subscribe-form">
        <input type="email" name="email" placeholder="Your Email" required>
        <button type="submit" class="subscribe-btn">Subscribe</button>
      </form>
    </div>
  </div>
  
  <div class="footer-bottom">
    <p>&copy; 2023 Company Name. All Rights Reserved.</p>
    <div class="footer-bottom-links">
      <a href="#">Privacy Policy</a>
      <a href="#">Terms of Service</a>
    </div>
  </div>
</footer>

Related Examples