Skip to content

Instantly share code, notes, and snippets.

@JohnBunka
Created May 12, 2015
Embed
What would you like to do?
CSS used to customize the Simple Social Icons plugin to match the brand colors of each social network.
/* Simple Social Icons
--------------------------------------------- */
.simple-social-icons li.social-dribbble a {
border: 2px solid #ea4c89 !important;
color: #ea4c89 !important;
}
.simple-social-icons li.social-dribbble a:hover {
background-color: #ea4c89 !important;
}
.simple-social-icons li.social-email a {
border: 2px solid #049fb3 !important;
color: #049fb3 !important;
}
.simple-social-icons li.social-email a:hover {
background-color: #049fb3 !important;
}
.simple-social-icons li.social-facebook a {
border: 2px solid #3b5998 !important;
color: #3b5998 !important;
}
.simple-social-icons li.social-facebook a:hover {
background-color: #3b5998 !important;
}
.simple-social-icons li.social-flickr a {
border: 2px solid #ff0084 !important;
color: #ff0084 !important;
}
.simple-social-icons li.social-flickr a:hover {
background-color: #ff0084 !important;
}
.simple-social-icons li.social-github a {
border: 2px solid #000 !important;
color: #000 !important;
}
.simple-social-icons li.social-github a:hover {
background-color: #000 !important;
}
.simple-social-icons li.social-gplus a {
border: 2px solid #dd4b39 !important;
color: #dd4b39 !important;
}
.simple-social-icons li.social-gplus a:hover {
background-color: #dd4b39 !important;
}
.simple-social-icons li.social-instagram a {
border: 2px solid #517fa4 !important;
color: #517fa4 !important;
}
.simple-social-icons li.social-instagram a:hover {
background-color: #517fa4 !important;
}
.simple-social-icons li.social-linkedin a {
border: 2px solid #007bb6 !important;
color: #007bb6 !important;
}
.simple-social-icons li.social-linkedin a:hover {
background-color: #007bb6 !important;
}
.simple-social-icons li.social-pinterest a {
border: 2px solid #cb2027 !important;
color: #cb2027 !important;
}
.simple-social-icons li.social-pinterest a:hover {
background-color: #cb2027 !important;
}
.simple-social-icons li.social-rss a {
border: 2px solid #ff6600 !important;
color: #ff6600 !important;
}
.simple-social-icons li.social-rss a:hover {
background-color: #ff6600 !important;
}
.simple-social-icons li.social-stumbleupon a {
border: 2px solid #eb4823 !important;
color: #eb4823 !important;
}
.simple-social-icons li.social-stumbleupon a:hover {
background-color: #eb4823 !important;
}
.simple-social-icons li.social-tumblr a {
border: 2px solid #32506d !important;
color: #32506d !important;
}
.simple-social-icons li.social-tumblr a:hover {
background-color: #32506d !important;
}
.simple-social-icons li.social-twitter a {
border: 2px solid #00aced !important;
color: #00aced !important;
}
.simple-social-icons li.social-twitter a:hover {
background-color: #00aced !important;
}
.simple-social-icons li.social-vimeo a {
border: 2px solid #aad450 !important;
color: #aad450 !important;
}
.simple-social-icons li.social-vimeo a:hover {
background-color: #aad450 !important;
}
.simple-social-icons li.social-youtube a {
border: 2px solid #bb0000 !important;
color: #bb0000 !important;
}
.simple-social-icons li.social-youtube a:hover {
background-color: #bb0000 !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment