Social Sprites Icons

Description

INTRODUCTION

Social Sprites Icons is a set of commonly used social icons that transition using CSS ease. This set is super lightweight and could easily be integrated into any website. There are two versions for the icons. One with white background for normal state and a transparent background version. On hover, the icons background color will change to the official color of the social network. All of the icons are in one sprite png that totals 26.1 KB.

EXTENDED LICENSE

The extended license follows the terms set forth by Envato. These terms can be found by clicking here. Additionally, these special conditions apply:

The icons can be used on templates that are sold on the web.
The icons cannot be resold separately.
The icons cannot be given out for free after purchase.
The icons can only be used on one template that is being sold per license. For additional license, please contact us via e-mail address found in the downloadable archive after purchase.

HOW TO USE

Using social sprites icons set is fairly simple. To integrate it to your website, all you need to do is call out of social sprite un-ordered list. To make it un-intrusive, we named this class SS.

Social Sprites – 40px by 40px Icons

<ul class="ss">
   <li class="facebook"><a href="#">facebook</a></li> 
   <li class="dribbble"><a href="#">dribbble</a></li> 
   <li class="twitter"><a href="#">twitter</a></li> 
</ul>

Social Sprites Mini – 30px by 30px Icons

<ul class="ssm">
   <li class="facebook"><a href="#">facebook</a></li> 
   <li class="dribbble"><a href="#">dribbble</a></li> 
   <li class="twitter"><a href="#">twitter</a></li> 
</ul>

View the complete guide on our knowledge base at:

DEMO & WATERMARK

You can view the live demo of this file by clicking ‘Live Preview’ from above. We also have a video of the file without the watermark available at http://www.screenr.com/Wa68.

On the demo you will see some white text over the buttons. Those are watermarks to prevent people from stealing the content. Sorry for the trouble this may have caused you.

REVIEWS

FILE SUPPORT

If you require any support, please post in the comment section or look in the “Thank You.pdf” file included in the archive. For help setting up the file, view the complete guide on our knowledge base at:

FILE UPDATE

Update 2.7 – 07/08/2014

Added 5 new icons: – About.me – Bandcamp – Viki – DeviantART – Xing
Sprite saved as PNG-32 for better quality

Update 2.6 – 10/20/2013

Update to white icons
Added white version of mini icons

Update 2.5 – 10/13/2013

Massive clean up of code
Stylesheet has been compressed to improve performance
All layout stylings have been separated from the icons stylings
The icon stylesheet has been renamed to socialsprites.css
Prioritized code to prevent theme style interferrance
Improvement to transitions
Update to Twitter icon
Added 3 new icons: star – share – doc
Clean up of the sprite
Made it easier to edit the path to the sprites

Update 2.4 – 09/12/2013

Update to Twitter icon

Update 2.3 – 06/03/2013

Update to Twitter icon

Update 2.2 – 12/18/2012

Added 7 new icons: Github – Behance – Yelp – Mail – Instagram – Foursquare – Zerply

Circle icons option was added. To add circle icons, you just have to add the sscircle class to your

<ul class="ss borderless sscircle">
    ...
</ul>

Update 2.1 – 11/15/2012

IE bug fixes (added IE conditional)
Edge fix on mini icons (removed blurriness for two icons)

Update 2.0 – 11/09/2012

Added Social Sprites Mini (30px by 30px)
Clean up of PNG
Added extended license for use in commercial themes
Added less intrusive watermark on the ‘Live Preview’

Update 1.1 – 11/07/2012

Update to the math