In generating odd shaped black squares is it easy to just stretch one black pixel or keep multiple images, trying to keep down bandwidth as im sure either of these options isnt a problem for a browser.

Ok lemme rephrase, not odd shaped squares, just alot of different ones. All solid black.

I'd guess the stretched image since it will be cached. But I doubt it matters in reality. Even a large GIF with a single color will be very small if optimized properly.

Why not use colored boxes instead of images?

Just to test I made a red 600*600 GIF and reduced colors to 16. It's 1,01 KB. A same size black one with colors reduced to 2 is 985 bytes.

K, thanks for the help, just to keep everything simple then Im going to just scale up that 1 pixel, keep things alot simpler (to me at least).

Just a note instead of GIF's Ive been using PNG's.

Well, if it is all the same colour, you may as well make it 1x1 pixel, and reduce the colours to 2 (I don't think 1 is possible, and perhaps it has to be 4?) My smallest images seem to be about 100 bytes.

But none of this makes any sense. If the OP just wants rectangles of colour, CSS is the obvious mechanism.

Well, it's possible since I did it as said above. I don't think it's possible if the color is a "color" though.

PNGs should be even smaller, I think, provided you can reduce colors in the same way. I think you can, but I'm not so used to PNG. As long as you use 256 colors or less, you should be fine. If you are using full color PNGs they'll be huge.