Images from the command line
Many of the images used in these demonstrations were made using Inkscape, a scaled vector graphic editor, or the ImageMagick suite of graphics utilities.
In particular, the numeral images used in the scrolling gallery demo and their thumbnails were generated directly from the command line. Instructions were typed in, and the convert utility created the image. Recall the command, edit a few values, and the next image is created.
IE Barf Alert! IE does not handle overflow properly, and expands the code boxes' containers, making the column too wide for both columns to fit the layout. This is the kind of crap developers have to deal with in IE. In this case, I just can't be bothered to apply a work-around for a faulty browser.
gt@koko:~$ convert -size 275x300 xc:transparent \ -font URW-Chancery-Medium-Italic -pointsize 432 \ -draw "text 25,280 '1'" -channel RGBA -gaussian 0x6 \ -fill darkred -stroke magenta -draw "text 20,275 '1'" num1.png
The "\" indicates a continuation. Everything is written on a single line.
And this, 
is the result.
Once the ten images were created, a single line converted them all to thumbnails to fit in a 100px box.
gt@koko:~$ convert -thumbnail 100x100 num*.png tnail-num*.png
The thumbnails look like this: 
The image used in the inline-block gallery demo was created as an svg, an xml format, using Inkscape. Here is the svg image.
I used ImageMagick to convert the svg to a jpg,
and then resized it, 
.