See also

  1. Color converter

Gradient image generator

Miscellaneous

Generates gradient images of different configuration and rotation angle.

This online tool generates gradient images with smooth transotion into one or more colors with possible opacity (alpha). Different fill styles are supported. Arbitrary dimensions and rotation angle may be specified. 

Various output formats are supported: PNG (with opacity), GIF, JPEG and even SVG. 

Ctrl+Shift+E ↔

This is a list of any number of RGB values, each separated by a colon (,) and/or a space. The format of each component is:

[#]RGB [=pos[.fract][%]] [/alpha[%]]

  • RGB value can be of short (F00) or full form (FF0000) and can be prefixed with a hash (#FF0000).
  • position is specified in percent – for example, F00=50 or F00=50% create red color in the middle of the gradient. Positions can be fractional with . or , for decimal part separator: F00=33.333. Also, it's recommended (although not required) to list colors in order with less positions first (0%, 30%, 50%, etc.). If omitted is centered between two closest points having positions; positions of first and last points default to 0% and 100% respectively (but can still be changed).
  • alpha value is a number between 0 and 100 (when % is specified) or 127 (an absolute value). If it's omitted it's set to 0 (fully opaque).
Ctrl+Shift+E ↔
Clear +

Color picker by JSColor.

Ctrl+Shift+E ↔
Ctrl+Shift+E ↔

Samples of different fill types 

http://i-tools.org/./gradient/exec?size=150&type=topbottom&skip-use=1

From top to bottom. 

http://i-tools.org/./gradient/exec?size=150&type=leftright&skip-use=1

From left to right. 

http://i-tools.org/./gradient/exec?size=150&type=radial&skip-use=1

Radial filling. 

http://i-tools.org/./gradient/exec?size=150&type=diamond&skip-use=1

Diamond.