50+ CSS Social Share Buttons

HTML CSS Social Share Buttons – Are you looking for HTML CSS Social Share Buttons, If yes then in this post I am going to share hand-picked HTML CSS Social Share Buttons for you. In order to increase your traffic through social media channels, it is necessary to integrate social sharing buttons on your website. There are plenty of options to choose from, So in this post will explore the top 50+ HTML CSS Social Share Buttons script for displaying your social media sharing buttons with maximum efficacy.

HTML CSS Social Share Buttons

Following are the list of popular HTML CSS Social Share Buttons.

Social Share Button

Social Share Button

Social Share Button script made with HTML (Pug) / CSS (Sass) and written By kiyutink.



Facebook/Instagram Share Button

Facebook/Instagram Share Button

Facebook/Instagram Share Button script made with HTML / CSS (SCSS) and written By nicoculotta.



Social Share Button UI

Social Share Button UI

Social Share Button UI script made with HTML (Pug) / CSS (Sass) / JavaScript and written By altreiter.



Simple Share Button

Simple Share Button

Simple Share Button script made with HTML / CSS and written By larrygeams.


Share Button

Share Button

Share Button script made with HTML / CSS (SCSS) and written By bertdida.


Social Media Icons Share

Social Media Icons Share

Social Media Icons Share script made with HTML / CSS (SCSS) and written By chandrashekhar.


Share Button

Share Button

Share Button script made with HTML / CSS and written By veronicadev.


CSS Share Icons

CSS Share Icons

CSS Share Icons script made with HTML (Pug) / CSS (Sass) and written By FUGU22.


Share Buttons Animation

Share Buttons Animation

Share Buttons Animation script made with HTML / CSS (SCSS) and written By premitheme.


Social Share Button

Social Share Button

Social Share Button script made with HTML / CSS and written By yancy.



Social Share Button

Social Share Button

Social Share Button script made with HTML / CSS (SCSS) and written By RobVermeer.


Slide-Out Social Buttons

Slide-Out Social Buttons

Slide-Out Social Buttons script made with HTML / CSS (SCSS) and written By stevenschobert.

Social share button DEMO

  Social share button

Social share button that pull apart into seperate buttons – By RobVermeer


Daily UI #010: Social Share DEMO

  Daily UI #010: Social Share

https://dribbble.com/shots/2547161-Daily-UI-010-Social-Share – By supah


Social share button DEMO

  Social share button

Pure CSS social-share button. – By kiyutink


Daily UI #010 :: Social Share DEMO

  Daily UI #010 :: Social Share

Utilizing Codrops omidirectional hover http://tympanus.net/codrops/2012/04/09/direction-aware-hover-effect-with-css3-and-jquery/ – By magnificode



Social Share DEMO

  Social Share

A social share widget built with HTML. CSS and jQuery – By j-w-v


Social Sharing Concept DEMO

  Social Sharing Concept

Social Sharing Concept (v1) with CSS Animations and Font Awesome – By pirrera


bootstrap | social share bar DEMO

  bootstrap | social share bar

social share bar based on the CKEditor Blog Social Bar. Icons from Fontawesome. Tooltip from Bootstrap. – By mindstorm


Social Sharing Menu with Hover DEMO

  Social Sharing Menu with Hover

Social Sharing Menu with Hover just CSS3 – By JFarrow


Social Share Squircles (Auto-Colored) DEMO

  Social Share Squircles (Auto-Colored)

Share icons that are automatically coloured by matching on the href attribute. Also, squircles. – By rikschennink


Social Sharing Buttons DEMO

  Social Sharing Buttons

An implementation of social sharing buttons without too much hassle . – By ritz078


Social Sharing Button DEMO

  Social Sharing Button

Simple animation for a social sharing button that expands to show links. – By keithchis



Easy Social Share Buttons ( CSS, HTML, Font Awesome ) DEMO

  Easy Social Share Buttons ( CSS, HTML, Font Awesome )

Really easy to implement social share buttons with minimal markup. Lightweight and fast loading. These buttons use Font Awesome, so they could very easily scale in a responsive way with some changes to the CSS. You could also very easily change the colors, make them squares or remove the backgrounds entirely. – By asheabbott


Custom Bootstrap Social Share Buttons DEMO

  Custom Bootstrap Social Share Buttons

social media icons for websites using the bootstrap css framework. Apply social share functionality to any design or custom icons. – By JacobLett


Vue Social Share Component DEMO

  Vue Social Share Component

– By gerrells-david


React DailyUI – 010 – Social Share DEMO

  React DailyUI - 010 - Social Share

Day 10 of 100! 10% of the way through baby! Awesome. Today is a social share button. click the button and see what happens. 😀 – By jackoliver


Social Share for Mobile Users DEMO

  Social Share for Mobile Users

With this script, you can show social share buttons on your mobile website without any developments. It’s automatically collect your data from HTML and even support WhatsApp. – By adobewordpress



Social share button DEMO

  Social share button

Social share button – By didac


Social Share Button DEMO

  Social Share Button

Just another share button. – By kylelavery88


Flat Animated Social Share DEMO

  Flat Animated Social Share

Expanding social share using 3d transform and css transitions – By nate437


Social Icons DEMO

  Social Icons

Round social sharing buttons – By thalseth


Subscribe & Social Share Buttons DEMO

  Subscribe & Social Share Buttons

Subscribe and Social Sharing button created with Twitter Bootstrap. – By justincron


Social share button DEMO

  Social share button

Social share button inspire with https://dribbble.com/shots/1034808-Widget?list=users&offset=2 – By arjunamgain


How to create Social Sharing Buttons with Bootstrap DEMO

  How to create Social Sharing Buttons with Bootstrap

How to create Social Sharing Buttons with Bootstrap – By creativedev



#DailyUI010 Social Share DEMO

  #DailyUI010 Social Share

Social share icons as part of the #DailyUI challenge #010. – By baublet


CSS3 Animated Social Sharing Buttons DEMO

  CSS3 Animated Social Sharing Buttons

Playing around with different animation styles for social sharing buttons. – By laurenashpole


Social Share Bar DEMO

  Social Share Bar

Social icons that grow on hover, useful for a social share menu, the plus at the bottom can be set to add more social networks. This can also be changed to be used as a vertical menu with zoom icons using font-awesome – By brianwik


Social share with GSAP DEMO

  Social share with GSAP

Custom social share components with preview. Based on dribbble shot and principle repo: https://dribbble.com/shots/2337668-Day-10-Social-Share – By zzavrski


Social sharing button animation DEMO

  Social sharing button animation

svg stroke animation on hover – By wouwi



DailyUi – Music Player + Social Share DEMO

  DailyUi - Music Player + Social Share

DailyUi Challange #009 & #010 Music Player with Social Share – By paulborm


Social Sharing Buttons DEMO

  Social Sharing Buttons

Just some share buttons i made for my upcoming blog. Open this preview in any webkit browser 🙂 (It should be working Firefox too.) – By codewunder


social-share-ru DEMO

  social-share-ru

https://github.com/eveness/social-share-ru – By eveness


Craft CMS Custom Social Share and CSS Button Transition DEMO

  Craft CMS Custom Social Share and CSS Button Transition

Fancy button transition (translating :after element on hover) – html includes fields in my Craft setup that the user can drop custom text into to customize share of individual blog posts. – By megkadams


Simple jQuery Social Share Dropdown DEMO

  Simple jQuery Social Share Dropdown

Simple Social Share jQUery Dropdown menu from MySkins Studio : www.myskins.org – By envira


Animated Twitter Button DEMO

  Animated Twitter Button

Re-created the hornig social-share effect. Enjoy! – By ScottMarshall


Social Share Button DEMO

  Social Share Button

– By AaronRaff



Social share button DEMO

  Social share button

– By yancy


Social Sharing Widget DEMO

  Social Sharing Widget

A fork of a social sharing solution using pure CSS and web fonts. Inspired by @Jobargod’s http://cssdeck.com/labs/css-social-share-button – By ianrobertdouglas


DailyUI #010 – Social Share DEMO

  DailyUI #010 - Social Share

Social share example to the Daily UI Challenge #010. – By mycnlz


V-Card WIP DEMO

  V-Card WIP

I spend a lot of time on Forrst, LinkedIn and Twitter and wanted to try to create a v-card that incorporated elements from each as a practice project. I’ll continue working on this through the weekend and add the social dropdown, a skills section, an add user option and maybe a list of followers/friends feature. – By TimRuby


Social Share DEMO

  Social Share

– By KovJonas



#dailyui 010: Social Share DEMO

  #dailyui 010: Social Share

A couple of different versions of a share widget, fully animated and CSS-only – By gabriellewee


Social Sharing Buttons DEMO

  Social Sharing Buttons

My own very light social sharing buttons. Vanilla JS. – By trvswgnr


Floating Social Sidebar DEMO

  Floating Social Sidebar

– By mattlitzinger


DailyUI #010 | Social Share Buttons DEMO

  DailyUI #010 | Social Share Buttons

Share button design for Alaska Airlines // need better animation.. (not finished yet!) – By juliepark


I Hope you liked Hand-picked list of HTML CSS Social Share Buttons, Don’t forget to Subscribe My Public Notebook for more useful Hand-picked HTML and CSS code examples, tutorials and articles.