This page demonstrates a horizontal gradient with a custom pattern/tesselation. Enter a left color, right color, and pattern color using 6-digit hex notation. Enter in pixels how wide you want the image to be, the left color will smoothly transition to the right color over that number of pixels. Also enter how many pixels wide, and tall you want the pattern to be. The "Generate Table" link will refresh the page with a table at the bottom depicting the pixels of your pattern. Click on individual pixels to activate them, the example pattern will automatically refresh. You can see the image that is actually generated with the "URL of image" link. The example pattern area takes that image and repeats it in the y direction.
URL of image
Left Color #  
Right Color #  
Pattern Color #  
Gradient Width (px)     
Pattern WxH (px)   x  
  Generate Table