This page demonstrates a vertical gradient with a custom pattern/tesselation. Enter a top color, bottom color, and pattern color using 6-digit hex notation. Enter in pixels how tall you want the image to be, the top color will smoothly transition to the bottom 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 x direction.
URL of image
Top Color #  
Bottom Color #  
Pattern Color #  
Gradient Height (px)     
Pattern WxH (px)   x  
  Generate Table
 
[1,1][2,1][3,1][4,1][5,1]
[1,2][2,2][3,2][4,2][5,2]
[1,3][2,3][3,3][4,3][5,3]
[1,4][2,4][3,4][4,4][5,4]
[1,5][2,5][3,5][4,5][5,5]