Some Random Dude is a blog by P.J. Onori that covers design & technology in the broadest sense possible.

Use Tumblr? If so, you may find Off Franklin useful.

Sanscons – 120 pixel icons, customizable with CSS

Sanscons is a CSS-friendly version of Bitcons — allowing you to set custom backgrounds on your icons.

The icons are small, yet coherent.

Sanscons Demo

Click one of the colors below to change the icons’ background

  • icon
  • icon
  • icon
  • icon
  • icon
  • icon
  • icon
  • icon
  • icon
  • icon
  • icon
  • icon
  • icon
  • icon
  • icon

Resulting CSS

The CSS that is applied to each image to set this appearance.

In addition to having a transparent background, the marks also come in 13 colors.
All icons come in 16x16, 32x32, 64x64 pixels as well as cropped to size.

CSS-friendly

Sanscons was design specifically for you to use CSS with them. Due to their transparent background, you can apply any color or background image to them for a more custom fit. Styling the icons takes only a basic understanding of CSS.

Small, yet legible

The icons are extremely small — with the actual marks varying between 8×8 to 12×12 pixels. Due to being pixel icons, the marks stay legible even at the small sizes — allowing for low-profile aesthetics.

13 different colors

All icons come in a wide variety of colors (13 in all) in order for greater convenience. The colors hit all the major hues in the spectrum as well as many colors used in the scheme on this site.

3 different sizes

As well as coming in many colors, the icons also come in 16×16, 32×32 & 64×64 pixels as well as cropped to size. The 32×32 and 64×64 icons have a chunkier look, maintaing the pixel style.

Free to use

This set is currently licensed under the Creative Commons Attribution-Share Alike 3.0 license. While I designed these icons specifically for myself, I want them to be everyone’s icons now.

Other work of interest

If you like Sanscons, you’ll definitely be interested in its sister, Bitcons. For something completely different, you should check out Iconic.

Stay Updated

There are a whole lot of other things going on at this site that may interest you. If your curiosity is piqued, you can follow all the updates from the options below: