Uber cool Linear Gradients in CSS3

Is it possible to create (without images), re开发者_C百科ally cool looking linear gradients like the ones you see in the Ribbon menu controls?

Does anyone know of any tutorials, articles resources or samples that demonstrate/show off this kinda gradient?

---

http://www.colorzilla.com/gradient-editor/

I've used this in the past. It is nice because it makes a number of flavors of the gradient, since exact syntax isn't well defined yet.

---

Background Gradient:

background: -moz-linear-gradient(center top , #ededed, #ededed) repeat scroll 0 0 transparent;
border: 1px solid #e1e1e1;
/* For WebKit (Safari, Google Chrome etc) */
background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ededed));
/* For Mozilla/Gecko (Firefox etc) */
background: -moz-linear-gradient(top, #ededed, #ededed);
/* For Internet Explorer 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ededed, endColorstr=#ededed);
/* For Internet Explorer 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ededed, endColorstr=#ededed)";

Text Shadow Effect:

box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);