Light

Pure CSS & SVG Social Buttons

No image sprites, no hi-res @2x versions, and no extra HTTP requests. Just copy & paste some sexy code.

All, and I mean all, measurments are made in ems. Adjust the parent div's font-size, and everything just works.

(this page is a Beta. It will look prettier, I promise!)

Copy and paste away! Just remember to include the proper CSS document.

Class addons:
.sc--big
.sc--small
.sc--tiny
.sc--short
.sc--tall
.sc--round
.sc--flat
.sc--shine
.sc--default
<!-- FACEBOOK -->
<a href="#" class="sc-btn sc--facebook">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 17.996,32L 12,32 L 12,16 l-4,0 l0-5.514 l 4-0.002l-0.006-3.248C 11.993,2.737, 13.213,0, 18.512,0l 4.412,0 l0,5.515 l-2.757,0 c-2.063,0-2.163,0.77-2.163,2.209l-0.008,2.76l 4.959,0 l-0.585,5.514L 18,16L 17.996,32z"></path></g></svg>
  </span>
  <span class="sc-text">
      Share on Facebook
  </span>
</a>
<!-- TWITTER -->
<a href="#" class="sc-btn sc--twitter">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 32,6.076c-1.177,0.522-2.443,0.875-3.771,1.034c 1.355-0.813, 2.396-2.099, 2.887-3.632 c-1.269,0.752-2.674,1.299-4.169,1.593c-1.198-1.276-2.904-2.073-4.792-2.073c-3.626,0-6.565,2.939-6.565,6.565 c0,0.515, 0.058,1.016, 0.17,1.496c-5.456-0.274-10.294-2.888-13.532-6.86c-0.565,0.97-0.889,2.097-0.889,3.301 c0,2.278, 1.159,4.287, 2.921,5.465c-1.076-0.034-2.088-0.329-2.974-0.821c-0.001,0.027-0.001,0.055-0.001,0.083 c0,3.181, 2.263,5.834, 5.266,6.438c-0.551,0.15-1.131,0.23-1.73,0.23c-0.423,0-0.834-0.041-1.235-0.118 c 0.836,2.608, 3.26,4.506, 6.133,4.559c-2.247,1.761-5.078,2.81-8.154,2.81c-0.53,0-1.052-0.031-1.566-0.092 c 2.905,1.863, 6.356,2.95, 10.064,2.95c 12.076,0, 18.679-10.004, 18.679-18.68c0-0.285-0.006-0.568-0.019-0.849 C 30.007,8.548, 31.12,7.392, 32,6.076z"></path></g></svg>
  </span>
  <span class="sc-text">
      Share on Twitter
  </span>
</a>
Share on Tumblr
<!-- TUMBLR -->
<a href="#" class="sc-btn sc--tumblr">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 18.001,14 L 18.001,21.318 C 18.001,23.175 17.977,24.245 18.174,24.771 C 18.369,25.295 18.859,25.838 19.392,26.153 C 20.101,26.577 20.909,26.789 21.821,26.789 C 23.441,26.789 24.398,26.575 26,25.523 L 26,30.333 L 26,30.333 C 24.634,30.976 23.442,31.352 22.334,31.612 C 21.224,31.87 20.026,32 18.738,32 C 17.274,32 16.411,31.816 15.288,31.448 C 14.164,31.077 13.204,30.548 12.412,29.869 C 11.617,29.184 11.068,28.456 10.76,27.686 C 10.453,26.917 10.301,25.799 10.301,24.335 L 10.301,13.113 L 6.006,13.113 L 6.006,8.582 C 7.263,8.174 8.667,7.588 9.562,6.827 C 10.46,6.063 11.179,5.149 11.721,4.079 C 12.265,3.012 12.638,1.65 12.842,0 L 18.001,0 L 18.001,8 L 26,8 L 26,14 L 18.001,14 Z"></path></g></svg>
  </span>
  <span class="sc-text">
      Share on Tumblr
  </span>
</a>
Share on Instagram
<!-- INSTAGRAM -->
<a href="#">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 26.688,0L 5.313,0 C 2.391,0,0,2.391,0,5.313l0,21.375 c0,2.922, 2.391,5.313, 5.313,5.313l 21.375,0 c 2.922,0, 5.313-2.391, 5.313-5.313L 32,5.313 C 32,2.391, 29.609,0, 26.688,0z M 10.244,14l 11.512,0 c 0.218,0.627, 0.338,1.3, 0.338,2c0,3.36-2.734,6.094-6.094,6.094c-3.36,0-6.094-2.734-6.094-6.094 C 9.906,15.3, 10.025,14.627, 10.244,14z M 28,14.002L 28,22 l0,4 c0,1.1-0.9,2-2,2L 6,28 c-1.1,0-2-0.9-2-2l0-4 L 4,14.002 L 4,14 l 3.128,0 c-0.145,0.644-0.222,1.313-0.222,2c0,5.014, 4.079,9.094, 9.094,9.094c 5.014,0, 9.094-4.079, 9.094-9.094 c0-0.687-0.077-1.356-0.222-2L 28,14 L 28,14.002 z M 28,7c0,0.55-0.45,1-1,1l-2,0 c-0.55,0-1-0.45-1-1L 24,5 c0-0.55, 0.45-1, 1-1l 2,0 c 0.55,0, 1,0.45, 1,1L 28,7 z"></path></g></svg>
  </span>
  <span class="sc-text">
      Share on Instagram
  </span>
</a>
Share on Google+
<!-- GOOGLE PLUS -->
<a href="#" class="sc-btn sc--google-plus">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 17.471,2c0,0-6.28,0-8.373,0C 5.344,2, 1.811,4.844, 1.811,8.138c0,3.366, 2.559,6.083, 6.378,6.083 c 0.266,0, 0.524-0.005, 0.776-0.024c-0.248,0.475-0.425,1.009-0.425,1.564c0,0.936, 0.503,1.694, 1.14,2.313 c-0.481,0-0.945,0.014-1.452,0.014C 3.579,18.089,0,21.050,0,24.121c0,3.024, 3.923,4.916, 8.573,4.916 c 5.301,0, 8.228-3.008, 8.228-6.032c0-2.425-0.716-3.877-2.928-5.442c-0.757-0.536-2.204-1.839-2.204-2.604 c0-0.897, 0.256-1.34, 1.607-2.395c 1.385-1.082, 2.365-2.603, 2.365-4.372c0-2.106-0.938-4.159-2.699-4.837l 2.655,0 L 17.471,2z M 14.546,22.483c 0.066,0.28, 0.103,0.569, 0.103,0.863c0,2.444-1.575,4.353-6.093,4.353 c-3.214,0-5.535-2.034-5.535-4.478c0-2.395, 2.879-4.389, 6.093-4.354c 0.75,0.008, 1.449,0.129, 2.083,0.334 C 12.942,20.415, 14.193,21.101, 14.546,22.483z M 9.401,13.368c-2.157-0.065-4.207-2.413-4.58-5.246 c-0.372-2.833, 1.074-5.001, 3.231-4.937c 2.157,0.065, 4.207,2.338, 4.58,5.171 C 13.004,11.189, 11.557,13.433, 9.401,13.368zM 26,8L 26,2L 24,2L 24,8L 18,8L 18,10L 24,10L 24,16L 26,16L 26,10L 32,10L 32,8 z"></path></g></svg>
  </span>
  <span class="sc-text">
      Share on Google+
  </span>
</a>
Share on Pinterest
<!-- PINTEREST -->
<a href="#" class="sc-btn sc--pinterest">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 16.5,0C 7.387,0,0,7.387,0,16.5s 7.387,16.5, 16.5,16.5c 9.113,0, 16.5-7.387, 16.5-16.5S 25.613,0, 16.5,0z M 18.1,22.047 c-1.499-0.116-2.128-0.859-3.303-1.573C 14.15,23.863, 13.36,27.113, 11.021,28.81 c-0.722-5.123, 1.060-8.971, 1.888-13.055c-1.411-2.375, 0.17-7.155, 3.146-5.977 c 3.662,1.449-3.171,8.83, 1.416,9.752c 4.79,0.963, 6.745-8.31, 3.775-11.325 c-4.291-4.354-12.491-0.099-11.483,6.135c 0.245,1.524, 1.82,1.986, 0.629,4.090c-2.746-0.609-3.566-2.775-3.46-5.663 c 0.17-4.727, 4.247-8.036, 8.337-8.494c 5.172-0.579, 10.026,1.898, 10.696,6.764 C 26.719,16.527, 23.63,22.474, 18.1,22.047z"></path></g></svg>
  </span>
  <span class="sc-text">
      Share on Pinterest
  </span>
</a>
Share on Pinterest
<!-- PINTEREST -->
<a href="#" class="sc-btn sc--pinterest-inverse">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 16.5,0C 7.387,0,0,7.387,0,16.5s 7.387,16.5, 16.5,16.5c 9.113,0, 16.5-7.387, 16.5-16.5S 25.613,0, 16.5,0z M 18.1,22.047 c-1.499-0.116-2.128-0.859-3.303-1.573C 14.15,23.863, 13.36,27.113, 11.021,28.81 c-0.722-5.123, 1.060-8.971, 1.888-13.055c-1.411-2.375, 0.17-7.155, 3.146-5.977 c 3.662,1.449-3.171,8.83, 1.416,9.752c 4.79,0.963, 6.745-8.31, 3.775-11.325 c-4.291-4.354-12.491-0.099-11.483,6.135c 0.245,1.524, 1.82,1.986, 0.629,4.090c-2.746-0.609-3.566-2.775-3.46-5.663 c 0.17-4.727, 4.247-8.036, 8.337-8.494c 5.172-0.579, 10.026,1.898, 10.696,6.764 C 26.719,16.527, 23.63,22.474, 18.1,22.047z"></path></g></svg>
  </span>
  <span class="sc-text">
      Share on Pinterest
  </span>
</a>
Dribbble
<!-- DRIBBBLE -->
<a href="#" class="sc-btn sc--dribbble">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 23.927,7.073 C 23.712,7.38 21.912,9.799 17.66,11.393 C 15.7,7.793 13.528,4.835 13.198,4.393 C 14.097,4.176 15.035,4.060 16,4.060 C 19.038,4.060 21.815,5.2 23.927,7.073 ZM 16.836,16.123 C 10.669,18.116 7.387,23.55 7.116,24.014 C 5.206,21.894 4.042,19.090 4.042,16.018 C 4.042,15.896 4.044,15.774 4.048,15.653 C 4.571,15.664 10.366,15.738 16.338,13.951 C 16.68,14.621 17.007,15.301 17.307,15.98 C 17.149,16.025 16.992,16.072 16.836,16.123 ZM 16,0C 7.163,0,0,7.163,0,16s 7.163,16, 16,16s 16-7.163, 16-16S 24.837,0, 16,0z M 16,30 C 8.28,30, 2,23.72, 2,16C 2,8.28, 8.28,2, 16,2C 23.72,2, 30,8.28, 30,16 C 30,23.72, 23.72,30, 16,30zM 19.372,14.903 C 19.124,14.32 18.857,13.741 18.579,13.171 C 23,11.366 25.004,8.797 25.256,8.456 C 26.922,10.491 27.93,13.083 27.957,15.905 C 27.563,15.822 23.609,15.020 19.63,15.52 C 19.546,15.316 19.46,15.11 19.372,14.903 ZM 15.35,12.112 C 9.756,13.598 4.829,13.576 4.294,13.569 C 5.070,9.858 7.571,6.774 10.916,5.196 C 11.231,5.629 13.368,8.59 15.35,12.112 ZM 18.041,17.984 C 18.067,17.975 18.094,17.967 18.12,17.958 C 19.799,22.32 20.493,25.977 20.671,27.026 C 19.235,27.638 17.657,27.976 16,27.976 C 13.236,27.976 10.688,27.033 8.66,25.452 C 8.875,25.012 11.296,20.335 18.041,17.984 ZM 20.358,17.405 C 24.106,16.805 27.398,17.787 27.807,17.916 C 27.274,21.244 25.364,24.117 22.681,25.931 C 22.559,25.204 21.922,21.703 20.358,17.405 Z"></path></g></svg>
  </span>
  <span class="sc-text">
      Dribbble
  </span>
</a>
Flickr
<!-- FLICKR -->
<a href="#" class="sc-btn sc--flickr">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 26.668,0L 5.334,0 C 2.4,0,0,2.4,0,5.334l0,21.332 C0,29.602, 2.4,32, 5.334,32l 21.334,0 C 29.601,32, 32,29.601, 32,26.666L 32,5.334 C 32,2.4, 29.601,0, 26.668,0z M 9,21c-2.761,0-5-2.239-5-5 c0-2.761, 2.239-5, 5-5s 5,2.239, 5,5C 14,18.761, 11.761,21, 9,21z M 23,21c-2.761,0-5-2.239-5-5 c0-2.761, 2.239-5, 5-5s 5,2.239, 5,5C 28,18.761, 25.762,21, 23,21z"></path></g></svg>
  </span>
  <span class="sc-text">
      Flickr
  </span>
</a>
Forrst
<!-- FORRST -->
<a href="#" class="sc-btn sc--forrst">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 12,28 L 0,28 L 14,0 L 28,28 L 16,28 L 16,24 L 20,24 L 20,22 L 16,22 L 16,18 L 12,18 ZM 12,28L 16,28L 16,32L 12,32z"></path></g></svg>
  </span>
  <span class="sc-text">
      Forrst
  </span>
</a>
Github
<!-- GITHUB -->
<a href="#" class="sc-btn sc--github">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 16,0C 7.163,0,0,7.163,0,16s 7.163,16, 16,16s 16-7.163, 16-16S 24.837,0, 16,0z M 25.502,25.502 c-1.235,1.235-2.672,2.204-4.272,2.881c-0.406,0.172-0.819,0.323-1.238,0.453L 19.992,26.438 c0-1.26-0.432-2.188-1.297-2.781 c 0.542-0.052, 1.039-0.125, 1.492-0.219s 0.932-0.229, 1.438-0.406s 0.958-0.388, 1.359-0.633s 0.786-0.563, 1.156-0.953s 0.68-0.833, 0.93-1.328 s 0.448-1.089, 0.594-1.781s 0.219-1.456, 0.219-2.289c0-1.615-0.526-2.99-1.578-4.125c 0.479-1.25, 0.427-2.609-0.156-4.078l-0.391-0.047 c-0.271-0.031-0.758,0.083-1.461,0.344s-1.492,0.688-2.367,1.281c-1.24-0.344-2.526-0.516-3.859-0.516c-1.344,0-2.625,0.172-3.844,0.516 c-0.552-0.375-1.075-0.685-1.57-0.93c-0.495-0.245-0.891-0.411-1.188-0.5s-0.573-0.143-0.828-0.164s-0.419-0.026-0.492-0.016 s-0.125,0.021-0.156,0.031c-0.583,1.479-0.635,2.839-0.156,4.078c-1.052,1.135-1.578,2.51-1.578,4.125c0,0.833, 0.073,1.596, 0.219,2.289 s 0.344,1.286, 0.594,1.781s 0.56,0.938, 0.93,1.328s 0.755,0.708, 1.156,0.953s 0.854,0.456, 1.359,0.633s 0.984,0.313, 1.438,0.406 s 0.951,0.167, 1.492,0.219c-0.854,0.583-1.281,1.51-1.281,2.781l0,2.445 c-0.472-0.14-0.937-0.306-1.394-0.5 c-1.6-0.677-3.037-1.646-4.272-2.881c-1.235-1.235-2.204-2.672-2.881-4.272C 2.917,19.575, 2.563,17.815, 2.563,16 s 0.355-3.575, 1.055-5.23c 0.677-1.6, 1.646-3.037, 2.881-4.272s 2.672-2.204, 4.272-2.881 C 12.425,2.917, 14.185,2.563, 16,2.563s 3.575,0.355, 5.23,1.055c 1.6,0.677, 3.037,1.646, 4.272,2.881 c 1.235,1.235, 2.204,2.672, 2.881,4.272C 29.083,12.425, 29.438,14.185, 29.438,16s-0.355,3.575-1.055,5.23 C 27.706,22.829, 26.737,24.267, 25.502,25.502z"></path></g></svg>
  </span>
  <span class="sc-text">
      Github
  </span>
</a>
LastFm
<!-- LASTFM -->
  <a href="#" class="sc-btn sc--lastfm">
      <span class="sc-icon">
          <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 25.612,25.426c-3.333-0.013-5.109-1.643-6.343-4.516l-0.353-0.784l-3.043-6.938 c-1.009-2.456-3.513-4.115-6.339-4.115c-3.823,0-6.925,3.102-6.925,6.927c0,3.826, 3.102,6.927, 6.925,6.927 c 2.667,0, 4.986-1.508, 6.143-3.719l 1.23,2.838c-1.747,2.13-4.402,3.487-7.374,3.487C 4.268,25.535,0,21.27,0,16.001 c0-5.266, 4.268-9.537, 9.534-9.537c 3.974,0, 7.182,2.122, 8.813,5.883c 0.124,0.292, 1.724,4.034, 3.12,7.219 c 0.865,1.971, 1.602,3.279, 3.992,3.36c 2.349,0.081, 3.961-1.349, 3.961-3.156c0-1.766-1.229-2.19-3.305-2.88 c-3.731-1.229-5.656-2.464-5.656-5.422c0-2.885, 1.964-4.81, 5.154-4.81c 2.078,0, 3.578,0.925, 4.617,2.768 l-2.039,1.042c-0.768-1.075-1.616-1.5-2.693-1.5c-1.497,0-2.566,1.042-2.566,2.427c0,1.966, 1.759,2.263, 4.219,3.070 C 30.461,15.543, 32,16.775, 32,19.85C 32,23.079, 29.229,25.431, 25.612,25.426z"></path></g></svg>
      </span>
      <span class="sc-text">
          LastFm
      </span>
  </a>
Reddit
<!-- REDDIT -->
<a href="#" class="sc-btn sc--reddit">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 8,20A2,2 2520 1 0 12,20A2,2 2520 1 0 8,20zM 20,20A2,2 2520 1 0 24,20A2,2 2520 1 0 20,20zM 20.097,24.274 C 20.612,23.869 21.359,23.957 21.765,24.472 C 22.171,24.987 22.082,25.734 21.567,26.14 C 20.133,27.27 17.948,28 16,28 C 14.052,28 11.867,27.27 10.433,26.14 C 9.918,25.734 9.829,24.987 10.235,24.472 C 10.641,23.957 11.388,23.869 11.903,24.274 C 12.729,24.925 14.363,25.625 16,25.625 C 17.637,25.625 19.271,24.925 20.097,24.274 ZM 32,16c0-2.209-1.791-4-4-4c-1.504,0-2.812,0.83-3.495,2.057c-2.056-1.125-4.561-1.851-7.29-2.019 l 2.387-5.36l 4.569,1.319C 24.581,9.163, 25.693,10, 27,10c 1.657,0, 3-1.343, 3-3s-1.343-3-3-3 c-1.143,0-2.136,0.639-2.642,1.579L 19.267,4.109c-0.57-0.164-1.173,0.116-1.414,0.658l-3.243,7.282 c-2.661,0.187-5.102,0.907-7.114,2.007C 6.813,12.83, 5.504,12, 4,12c-2.209,0-4,1.791-4,4 c0,1.635, 0.981,3.039, 2.387,3.659C 2.134,20.41, 2,21.194, 2,22c0,5.523, 6.268,10, 14,10 c 7.732,0, 14-4.477, 14-10c0-0.806-0.134-1.589-0.387-2.34C 31.019,19.040, 32,17.635, 32,16z M 27,5.875 c 0.621,0, 1.125,0.504, 1.125,1.125s-0.504,1.125-1.125,1.125s-1.125-0.504-1.125-1.125S 26.379,5.875, 27,5.875z M 2,16c0-1.103, 0.897-2, 2-2 c 0.797,0, 1.487,0.469, 1.808,1.145c-1.045,0.793-1.911,1.707-2.552,2.711C 2.521,17.56, 2,16.84, 2,16z M 16,29.625 c-6.42,0-11.625-3.414-11.625-7.625s 5.205-7.625, 11.625-7.625c 6.42,0, 11.625,3.414, 11.625,7.625S 22.42,29.625, 16,29.625z M 28.744,17.856 c-0.641-1.004-1.507-1.918-2.552-2.711C 26.513,14.469, 27.203,14, 28,14c 1.103,0, 2,0.897, 2,2 C 30,16.84, 29.48,17.56, 28.744,17.856z"></path></g></svg>
  </span>
  <span class="sc-text">
      Reddit
  </span>
</a>
Soundcloud
<!-- SOUNDCLOUD -->
<a href="#" class="sc-btn sc--soundcloud">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 27.874,16.069c-0.565,0-1.105,0.11-1.596,0.308C 25.95,12.803, 22.831,10, 19.028,10 c-0.931,0-1.834,0.176-2.635,0.474c-0.311,0.116-0.393,0.235-0.393,0.466l0,12.585 c0,0.243, 0.195,0.445, 0.441,0.469 C 16.452,23.994, 27.802,24, 27.875,24C 30.154,24, 32,22.224, 32,20.035S 30.152,16.069, 27.874,16.069zM 12.5,24L 13.5,24L 14,16.993L 13.5,10L 12.5,10L 12,16.993 zM 9.5,24L 8.5,24L 8,18.914L 8.5,14L 9.5,14L 10,19 zM 4.5,24L 5.5,24L 6,20L 5.5,16L 4.5,16L 4,20 zM 0.5,22L 1.5,22L 2,20L 1.5,18L 0.5,18L0,20 z"></path></g></svg>
  </span>
  <span class="sc-text">
      Soundcloud
  </span>
</a>
Stackoverflow
<!-- STACK OVERFLOW -->
<a href="#" class="sc-btn sc--stack-overflow">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 32,20 L 32,32 L 0,32 L 0,20 L 4,20 L 4,28 L 28,28 L 28,20 ZM 6,22L 26,22L 26,26L 6,26zM 6.473,17.671L 7.339,13.766L 26.865,18.094L 26,21.999zM 8.739,9.642L 10.43,6.017L 28.556,14.469L 26.865,18.094zM 30.991,11.296 L 28.556,14.47 L 12.689,2.294 L 14.45,0 L 16.27,0 Z"></path></g></svg>
  </span>
  <span class="sc-text">
      Stackoverflow
  </span>
</a>
Vimeo
<!-- VIMEO -->
<a href="#" class="sc-btn sc--vimeo">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M0,9.637l 1.3,1.704c0,0, 2.68-2.113, 3.574-1.056c 0.893,1.056, 4.304,13.811, 5.443,16.164 c 0.994,2.063, 3.735,4.791, 6.741,2.843c 3.004-1.948, 12.995-10.478, 14.783-20.55 c 1.787-10.070-12.023-7.96-13.485,0.813c 3.656-2.195, 5.607,0.892, 3.737,4.387 c-1.867,3.491-3.574,5.769-4.467,5.769c-0.892,0-1.578-2.337-2.6-6.42c-1.056-4.222-1.050-11.827-5.441-10.965 C 5.443,3.137,0,9.637,0,9.637z"></path></g></svg>
  </span>
  <span class="sc-text">
      Vimeo
  </span>
</a>
Vimeo
<!-- VIMEO -->
<a href="#" class="sc-btn sc--vimeo-styled">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M0,9.637l 1.3,1.704c0,0, 2.68-2.113, 3.574-1.056c 0.893,1.056, 4.304,13.811, 5.443,16.164 c 0.994,2.063, 3.735,4.791, 6.741,2.843c 3.004-1.948, 12.995-10.478, 14.783-20.55 c 1.787-10.070-12.023-7.96-13.485,0.813c 3.656-2.195, 5.607,0.892, 3.737,4.387 c-1.867,3.491-3.574,5.769-4.467,5.769c-0.892,0-1.578-2.337-2.6-6.42c-1.056-4.222-1.050-11.827-5.441-10.965 C 5.443,3.137,0,9.637,0,9.637z"></path></g></svg>
  </span>
  <span class="sc-text">
      Vimeo
  </span>
</a>
RSS
<!-- RSS -->
<a href="#">
  <span class="sc-icon">
      <svg viewBox="0 0 33 33" width="25" height="25" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M 4.259,23.467c-2.35,0-4.259,1.917-4.259,4.252c0,2.349, 1.909,4.244, 4.259,4.244 c 2.358,0, 4.265-1.895, 4.265-4.244C 8.525,25.383, 6.618,23.467, 4.259,23.467zM 0.005,10.873l0,6.133 c 3.993,0, 7.749,1.562, 10.577,4.391c 2.825,2.822, 4.384,6.595, 4.384,10.603l 6.16,0 C 21.125,20.349, 11.648,10.873, 0.005,10.873zM 0.012,0l0,6.136 c 14.243,0, 25.836,11.604, 25.836,25.864L 32,32 C 32,14.36, 17.648,0, 0.012,0z"></path></g></svg>
  </span>
  <span class="sc-text">
      RSS
  </span>
</a>
Default
<!-- DEFAULT -->
<a href="#" class="sc-btn sc--default">
  <span class="sc-text">
      Default
  </span>
</a>

SVG icons from icomoon.