Stripes are undoubtly very popular graphical element these days. They are used in many ways in web design, mostly as background patterns of various layout parts or block elements. Here is a fresh tip that could save your time.
When i match colors for some web site, i find it very easy if i use one small .GIF image, which has one stripe transparent and others are solid.
This image alows me just to change background color in CSS:
body { background: red url(diagonals.gif); } /* or green or blue */
and it produces:
By simply changing background-color, you can end up with some very interesting patterns.
I suggest you make yourself a few .GIFs -- white/transparent, black/transparent and transparent with various shades of gray. This way it should be much easier to combine colors that suit your needs.
To make horizontal stripes, just make 3px high, 1px wide .GIF with single top pixel transparent and the other two solid.
Once you're done with above, probably you'd like to fire up your image editor and import stripes. There's a simple trick how to fill some layer with desired striped background and all you have to do is preview your test page in Full Screen and then press Print Screen key. After that just paste it as a new layer or do whatever you want with it. Here's my test page in case you're too lazy : )
Let's say you're working on web site with deparments that should be separated visualy, but still keeping main visual theme recognized. With Super Stripes, it easy to set different shade at each department, the rest of visual differences i'm leaving to you...
Copyright © maratz.com 2004.