Another effect you can use with canvas shapes is a gradient.
Gradient fills in the canvas can be created either through a linear (createLinearGradient) or radial (createRadialGradient) gradient.
To add colors to the gradient, use the addColorStop property.
The radial gradient method can get a little complicated, so it is worth playing around with this; try adding various addColorStop to see what happens.
Using CSS3, we can design some nice subtle buttons without any images.
As the gradients are scalable, you will find that it is actually less hassle to design buttons using CSS3 than to use images.
Line 10 above is for Mozilla Firefox. Line 11 is for Safari and Chrome webkit. Line 12 is the official CSS3 gradient.
The white and black inside the brackets are the start and stop colors of the gradient.