jc

8 notes &

Make data URI inline images on Linux command line

And now for a complete change in pace - I’m going to start blogging about web development and programming stuff in addition to travel. Currently I write to you from the airport in Tokyo where I have 2 megabit free wireless internet at my gate. Amazing.

This is just a simple example of how to do the data URI inline images technique.

Here’s an example I made of using inline images in CSS.

Here’s the way to do it on command line in Linux using the base64 program (you need to point it at an image file you have):
% base64 btn_arrow_up.gif

It will output something like:
R0lGODlhEwASAKIAALu7u/b29vr6+vj4+Pn5+ff39wAAAAAAACH5BAAAAAAALAAAAAATABIAAAMzKLrc/jBKRaq9OOvNu+9DKIrAaJ4hoKKs6rKmK59FEdpDre987//AoHBILOoCyKRyqUwAADs=)

Here’s an example of this image right here on the page you’re looking at (no extra HTTP requests):

Make sure when you copy it from your terminal that you remove any line breaking.

Filed under linux css web development webdesign optimization

  1. jessecrouch posted this