Icons in Pure CSS uses progressive enhancement to turn an unordered list of text links into a set of icons without the use of images or JavaScript.
Neat Social Media Icons in Pure CSS
This experiment starts with a simple list of links, with each link using meaningful text, and then progressively styles each link to take on the appearance of the relevant social media icon. As a result, there should be support for screenreaders or users with CSS disabled.
Support: Firefox 3.5+, Safari 4+, Chrome 4+, Opera 10+, IE8+.
Icons are build with CSS 2.1 and CSS3 that is not supported by Internet Explorer 6 and 7, therefore, you shouldn’t expect it to work in those browsers. CSS is not necessarily the most appropriate tool for this kind of thing either.
by Nicolas Gallagher
View Neat Social Media Icons
Peculiar CSS icon package
They were created for sites and web applications that depend on fewer HTTP requests as possible or don't need to use any image at all. The package contains 45 pictograms that are available in 16x16 pixels size.
Endless possibilities are coming with these type of icons. Sizes are not limited to 16x16 pixels, but they go up to 1024x1024 pixels and from there to ∞. They are semantically coded, each shape can be customized to different color. Web designers can now use these icons to create layouts skipping the Photoshop in the process and web developers can speed up their web applications tremendously.
Peculiar is the only icon set which Retina-ready by default, meaning that the same code is used for both regular and Retina displays. If you want to develop web apps for iPhone 4/4S and other iOS devices, this icon set will be your friend.
Browsers supported: Internet Explorer 9, Mozilla Firefox (videocast), Camino, Opera, Apple Safari, Google Chrome or any other Gecko or WebKit powered browser.
Browsers unsupported: Internet Explorer 6-8, but support can be added using CSS3 PIE.
by Lucian Marin
Get Peculiar CSS icon package
Pure CSS GUI icons
The HTML is very simple and it relies on CSS pseudo-elements rather than extraneous HTML elements. The technical aspects of this exercise might be of interest to designers.
Tested in: Firefox 3.5+, Chrome 5, and Opera 10.6.
by Nicolas Gallagher
View Pure CSS GUI icons
CSS3 Experiment
Fun with CSS3- Social media icons created in pure CSS.
by insicdesigns
View CSS3 Experiment
Round Pure CSS Icons
No extra markup just for styling; No need for a solid background colour for the icons to work
by Joshua Hibbert.
Check it on jsfiddle
Get Pure CSS Icons