Bootstrap Snippet Pure CSS RGB Footer using HTML CSS Bootstrap

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!-- Footer starts here -->
<footer class="footer row mt-5">
    <div class="container mt-5">
        <div class="row ">
            <div class="col-md-12 mt-5 text-center">
                <h1>PURE CSS RGB FOOTER</h1>
                <h4>Enter you text here!!</h4>
                <h4>TEXT</h4>
                <p class="social-icons-header">
                            <a href="facebook.com"><i class="fa fa-facebook "></i></a>
                            <a href="facebook.com"><i class="fa fa-twitter"></i></a>
                            <a href="facebook.com"><i class="fa fa-instagram"></i></a>
                            <a href="facebook.com"><i class="fa fa-linkedin"></i></a>   
                     </p>
            </div>
            <div class="col-md-12 text-center mt-5">
                <h6 class="">Designed with <span style="color: red;">❤</span> by <a href="http://www.prat.ee/k">Prateek Gupta</a> </h6>
            </div>
        </div>
    </div>
</footer>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
.footer{
    color: white;
    border-top: 8px solid crimson;
    background-color: #c91d61;
    background: linear-gradient(20deg,blue,crimson,purple); /*Change colors as you want*/
    background-size: 1000% 1000% !important;
    -webkit-animation: changeColors 30s ease infinite;
    -moz-animation: changeColors 30s ease infinite;
    -o-animation: changeColors 30s ease infinite;
    animation: changeColors 30s ease infinite;
}
@-webkit-keyframes changeColors {
    0% {
        background-position: 0 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0 50%;
    }
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Pure CSS RGB Footer"
Bootstrap 4.0.0 Snippet by prat.ee/k

Related: See More

Questions / Comments:

"Pure CSS RGB Footer" Bootstrap 4.0.0 Snippet by prat.ee/k

Related: See More

Questions / Comments:

"Pure CSS RGB Footer"
Bootstrap 4.0.0 Snippet by prat.ee/k