11 Free HTML CSS3 Social Media Buttons


With Google officially giving importance to social signals, sharing of websites and articles on social media has become increasingly important for brand success these days. Getting a CSS3 social media button not only speeds up the loading time of your website, but also helps in SEO as well as swift and easy conversion when getting traffic from Google, Facebook, and other social media platforms.

If simple icons and buttons interest you, then listed below are some CSS social media icons, ribbons, and buttons that you can use on your website for free. The snippet code is publicly available for use, with the option of alteration according to individual needs. This topic will be updated by me with new content quite soon, so you are advised to stick around for more cool stuff. Some of the content given below is jQuery along-with the standard HTML, CSS code.

1. Fancy Buttons

Another visual treat to the website  visitors to share your content or bookmark the website on their timeline.

style-buttonDemo    Download


2. Circular Social Icons

A three icons showcasing Google, Facebook, twitter in all its glory.


Source    Download


3. Flat Social Buttons in CSS3

A long version of share buttons to match your website sidebar.



4. Hover Fancy

This time you will find a different hover style which ends with a text display.

fancy-cssDemo    Download


5. Social Button Collection

Includes different shapes and sizes of attraive social media buttons in css which can be easily added to your existing website code.

social-buttons1Demo    Download


6. Social Networks

A bar of fixed social networks.

social-networksDemo    Download


7. CSS Social Ribbons

Simple yet stylish CSS Social Ribbons.




8. Pure Social Buttons in css3

A rolling effect with horizontal display of modern social icons will blow your mind.

rolling-css-social-buttonDemo    Download


9. Color Changing Social Bar

On hover on any of the social network icons the background portion will change color similar to the network.

color-social-iconsDemo    Download


10. Social Section

A set of social icons with nice hover effect.

social-buttonsDemo    Download


11. Social Navigation

A vertical style navigation.




Click to comment

Leave a Reply

Your email address will not be published. Required fields are marked *

Goziyan keeps you up to date with all the WordPress developments, design inspirations, answers any questions you might have about WordPress use and allows you to discover new program frontiers. Goziyan also focuses on latest fashion trends and other interesting news.

Copyright © 2016 GOZIYAN.

To Top
Over thousand amazing people subscribed to Goziyan...


No worries, your email is safe with us.