→ Mateo Rojas
→ Basic Footer

Basic Footer

Standard footer example with bootstrap 5

This bootstrap css example is contributed by Mateo Rojas, on 21-Dec-2024. Component is made with bootstrap css v.5.3. It is responsive.

Tags: Footer

Author Mateo Rojas

v.5.3

Fork Fullscreen

<footer class="footer">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-md-6">
                <div class="footer-brand">CompanyName</div>
                <p class="footer-text">Creating amazing experiences and innovative solutions for our customers
                    worldwide.</p>
                <div class="social-links">
                    <a href="#" class="social-link"><i class="fab fa-twitter"></i></a>
                    <a href="#" class="social-link"><i class="fab fa-facebook"></i></a>
                    <a href="#" class="social-link"><i class="fab fa-instagram"></i></a>
                    <a href="#" class="social-link"><i class="fab fa-linkedin"></i></a>
                </div>
            </div>

<div class="col-md-6 text-md-end">
                <ul class="footer-links">
                    <li><a href="#">About</a></li>
                    <li><a href="#">Services</a></li>
                    <li><a href="#">Contact</a></li>
                    <li><a href="#">Privacy</a></li>
                    <li><a href="#">Terms</a></li>
                </ul>
            </div>
        </div>

More Examples

Footer with social media icons

Author:
Omar Khaled

11 months ago

4.7k

v.5.3
Responsive footer using HTML and Bootstrap:
HTML: Error Title: A large, bold number (e.g., 404) to indicate the error type. Error Message: A brief message explaining the error. Button: A button to navigate back to the home page. Adjust the href attribute to point to your actual home page URL. CSS: Background Gradient: Applied to the body to give a stylish look. Error Container: Centered on the page with a semi-transparent background for contrast. Button Styling: Custom colors for the button, including hover effects. How to Use: Create an error.html file and paste the above code into it. Place the error.html file in your web server’s error pages directory or configure your server to serve this file on error.

Author:
zobaidul kaziex

11 months ago

5.3k

v.4.6
Tp_3

Author:
naurazer

1 week ago

103

v.4.6
Footer Template with NewsletterForm
Professional footer component with newsletter signup, social media integration, and responsive design built with Bootstrap 5.3.

Author:
Isaac Winslow

8 months ago

3.4k

v.5.3
Footer
Footer de Bootstrap con enlaces rápidos, contacto y redes sociales, usando íconos para mejor navegación. Diseño limpio y responsivo. 🚀

Author:
Anonymous

5 months ago

1.9k

v.4.6
Clean Modern Footer Design with Social Media
Elegant light-themed footer with interactive elements, newsletter signup, and social media integration built with Bootstrap 5.3.

Author:
Isaac Winslow

8 months ago

3.3k

v.5.3
Bootstrap copyright footer

Author:
Anonymous

1 year ago

2.1k

v.5.3
Simple Footer

Author:
Anonymous

1 year ago

1.5k

v.4.6
Footer example made with Bootstrap 5.3
Dark theme

Author:
Arturo

7 months ago

4.9k

v.5.3
Bootstrap Footer example
dark footer

Author:
Anonymous

1 year ago

1.9k

v.3.4
Footer
Simple footer with social icons

Author:
Anonymous

1 month ago

326

v.5.3
Footer
Simple footer with social icons

Author:
Prajwal Hallale

1 year ago

8.1k

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent