pic2html

What's this?

pic2html is a small program to convert images to HTML. It does so by creating a HTML table with a cell for every pixel. Here's an example:

The same image on a larger scale:

Or look at the results produced by the -d switch. Note: page may take a few seconds to load and render on slower connections.

These are not images -- look at the HTML source to see what's going on. Viewing them requires a CSS-compliant browser.

How do I use the program?

It is run from the command line. Basic usage is

pic2html.py filename

where filename is an image that pic2html understands... currently BMP and ICO (Windows icon) files are supported. Other types may or may not work. Note that pic2html is really meant to convert *small* files, like icons. Technically, it could convert large images just as well, except that this would generate huge HTML files, which are probably unsuitable for inclusion on web pages. (For example, the small mine on this page already takes 46K, uncompressed, and it's only a 32x32 file.)

A number of switches is supported:

• -w num, -h num: display the image in a larger scale. Actually, this sets the width and height of the table cells to num pixels. Default is 1. pic2html.py -w 3 -h 3 winmine.bmp would generate the large mine shown above.

• -t x,y: set the color found at coordinates x, y as transparent. In other words, the color found at that position is not displayed. This is useful when dealing with images that are converted from one format (that supports transparency) to another (that doesn't). In such cases, the formerly-transparent color will show up, even though it's unwanted. The -t switch helps getting rid of that color.
  
  Note that the argument to -t is evaluated as a Python tuple, so you can write -t x,y or -t (x,y), or even -t "0, 0".

• -s name: set the name for the CSS style used. Normally, the name is derived from the filename, e.g. snake.bmp would result in a style named "snake". If you include multiple "HTML images" in the same file, generated from the same file, and they all (incorrectly) show up in the same size, then they probably have the same style name. Use the -s switch to set a unique name if necessary.

• -c: use "compression". The HTML generated by pic2html is inefficient; it just generates a table and code for each cell. The -c switch uses a simple form of "compression", by attempting to group together cells that have the same value (color). This will result in fewer lines of HTML.

• -d: run a "demo". This generates a file demo-pic2html.html that displays a few of the possibilities. Note that with this switch, you still need to provide an image.