Social Sprites Icons

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 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: http://kb.fwpolice.com/kits/social-sprites-icons/

DEMO & WATERMARK

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: http://kb.fwpolice.com/kits/social-sprites-icons/

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
  tag. Furthermore, you no longer have to use a container class as before. You can simply use the borderless class directly into the ul tag. In example, for the normal sized icons, you will use:

<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