| Simple Gradient | Specify Direction | Specify Angle | Trasparency | Stops | Repeat | Repeat Angle | |
|---|---|---|---|---|---|---|---|
| No Prefix | ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
| -o | ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
| -ms | ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
| -moz | ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
| -webkit | ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
| Gradient with angle specified | ||
|---|---|---|
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... | linear-gradient(to top right, #000000, #ffffff); | |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... | -o-linear-gradient(bottom left, #000000, #ffffff); | |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... | -ms-linear-gradient(bottom left, #000000, #ffffff); | |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... | -moz-linear-gradient(to top right, #000000, #ffffff); | |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... | -webkit-linear-gradient(bottom left, #000000, #ffffff); |
|
| Comparison of No Prefix and Webkit/Mozilla direction notation | ||||
|---|---|---|---|---|
| to top | to bottom | to left | to right | No Prefix | ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
WebKit/Moz | ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
| top | bottom | left | right | no prefix | ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
WebKit/Moz | ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
ABCabc... ABCabc... ABCabc... ABCabc... ABCabc... |
|---|