Tag: icons

Icons and Type

Jonathan Snook gives his take on how to align icons with text that is lowercase, title case and sometimes all uppercase…
csshead 0 Comments

Iconizr

Takes your SVG drawings and processes them to a CSS icon kit, coming in several different flavors. It prefers high-resolution (retina) SVG over PNG icons, data URIs over CSS sprites and single images and provides fallbacks for even the least capable browsers. It outputs Sass along with (or instead of) CSS code…
csshead 0 Comments

Navicon Transformicons: Animated Navigation Icons with CSS Transforms

Learn how to create impressive animated navigation icon transformations…
csshead 0 Comments

Making accessible icon buttons

An article exploring the alternatives for creating clickable icons with accessibility in mind…
csshead 0 Comments

Font Icon Stacks

Icon fonts are great but they only work in a single color. Here’s an ingenious way to create multi-colored scalable graphics using icon fonts…
csshead 0 Comments

Font-Embedding Icons: This Is a Big Deal

An article proposing the use of @font-face for displaying icons. I feel strongly about the potential of this method, so I thought I would take the time to generate a font set for Iconic and to talk about why we should all be using this method for displaying icons…
csshead 0 Comments

Pure CSS GUI Icons Experimental

An experiment that uses pseudo-elements to create 84 simple GUI icons using CSS and semantic HTML. Shared as an exercise in creative problem solving and working within constraints. This is not a “production ready” CSS icon set…
csshead 0 Comments

Creating Fancy Checkmark Icons with Pure CSS3

I was recently working on a personal project where I wanted to implement some cool “checkmark” icons like you see at left to spice up my unordered lists. I could’ve done it quite easily with the list-style-image property, but I was trying to keep my images and http requests to a minimum, so I wanted […]
csshead

Ever Thought About Using @Font-face for Icons?

The evolution of Internet technologies never ceases to amaze. Seemingly daily, new concepts and techniques are being thought up by creative and talented people. With modern browsers being adopted at a greater rate, systems like CSS3 are becoming more and more viable for use on projects of all sizes. Clearly, this can be seen by […]
csshead 0 Comments

Pure CSS Icons

Having marvelled at David Desandro’s Opera Logo made entirely in HTML and CSS, I wanted to try a similar experiment for myself. So with a large scoop of border-radius I set about trying to create various “common” icons that could be used in your web apps…
csshead 0 Comments
Next Page »