How TO – Social Media Buttons
https://use.fontawesome.com/releases/v5.13.0/css/all.css
<!DOCTYPE html>
<html>
<head>
<meta name=”viewport” content=”width=device-width, initial-scale=1″>
<link rel=”stylesheet” href=”https://use.fontawesome.com/releases/v5.7.1/css/all.css“>
<style>
.fab {
padding: 15px;
font-size:25px;
width: 25px;
text-align: center;
text-decoration: none;
margin: 5px 2px;
border-radius: 50%;
}
.fab:hover {
opacity: 0.7;
}
.fa-facebook {
background: #3B5998;
color: white;
}
.fa-twitter {
background: #55ACEE;
color: white;
}
.fa-google {
background: #dd4b39;
color: white;
}
.fa-linkedin {
background: #007bb5;
color: white;
}
.fa-youtube {
background: #bb0000;
color: white;
}
.fa-instagram {
background: #125688;
color: white;
}
.fa-pinterest {
background: #cb2027;
color: white;
}
.fa-snapchat-ghost {
background: #fffc00;
color: white;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
}
.fa-skype {
background: #00aff0;
color: white;
}
.fa-android {
background: #a4c639;
color: white;
}
.fa-dribbble {
background: #ea4c89;
color: white;
}
.fa-vimeo {
background: #45bbff;
color: white;
}
.fa-tumblr {
background: #2c4762;
color: white;
}
.fa-vine {
background: #00b489;
color: white;
}
.fa-foursquare {
background: #45bbff;
color: white;
}
.fa-stumbleupon {
background: #eb4924;
color: white;
}
.fa-flickr {
background: #f40083;
color: white;
}
.fa-yahoo {
background: #430297;
color: white;
}
.fa-soundcloud {
background: #ff5500;
color: white;
}
.fa-reddit {
background: #ff5700;
color: white;
}
.fa-mix {
background: #ff6600;
color: white;
}
.fa-medium {
background: #000;
color: white;
}
.fa-rss {
background: #ff6600;
color: white;
}
</style>
</head>
<body>
<h2>Style Social Media Buttons</h2>
<a href=”#” class=”fab fa-facebook”></a>
<a href=”#” class=”fab fa-twitter”></a>
<a href=”#” class=”fab fa-google”></a>
<a href=”#” class=”fab fa-linkedin”></a>
<a href=”#” class=”fab fa-youtube”></a>
<a href=”#” class=”fab fa-instagram”></a>
<a href=”#” class=”fab fa-pinterest”></a>
<a href=”#” class=”fab fa-snapchat-ghost”></a>
<a href=”#” class=”fab fa-skype”></a>
<a href=”#” class=”fab fa-android”></a>
<a href=”#” class=”fab fa-dribbble”></a>
<a href=”#” class=”fab fa-vimeo”></a>
<a href=”#” class=”fab fa-tumblr”></a>
<a href=”#” class=”fab fa-vine”></a>
<a href=”#” class=”fab fa-foursquare”></a>
<a href=”#” class=”fab fa-stumbleupon”></a>
<a href=”#” class=”fab fa-flickr”></a>
<a href=”#” class=”fab fa-yahoo”></a>
<a href=”#” class=”fab fa-reddit”></a>
<a href=”#” class=”fab fa-medium”></a>
<a href=”#” class=”fab fa-mix”></a>
<a href=”#” class=”fab fa-rss”></a>
</body>
</html>
Well-organized and easy to understanding Web building tutorials with lots of examples of how to use HTML, CSS, JavaScript, SQL, Python, PHP, and Bootstrap.
Style Social Media Buttons
Style Social Media Buttons
