Basics

• Use RGB slider to mix a color. Color value may also be pasted into Hex box directly (less pound [#] sign).
   
• Click to apply a color to one of the color points. Apply respective colors to other points until the desired gradient is created.
  The image is not automatically generated. After any change you made (except Preview Options) at OGIM, click icon to generate an image.
   
• Click to remove color from a point. If color is not applied to a point, then 2 colors from nearest assigned points (left and right) would be blended over it.
  Note: If color from 1-st or 9-th point is removed (points are enumerated from left to right), then the color from nearest assigned point would fade to transparency. PNG Transparency (all images are generated in .png image format) is supported by all modern browsers. Internet Explorer earlier than v7.0 however, do not support it and would render transparent area with solid color.
   
• Color for the assigned point may be returned to the color selector. Just click at the colored box for any point. Respective color would be returned to the Hex box and be available for further assignment to other points. Click Update Slider for the RGB slider update with returned color. Click Reset to set color selector to the default position.
   
• Use Mirror button to reverse the order of colors applied to points.
   
• Gradient direction is changed by selecting "horizontal" or "vertical" from Gradient Direction list.

To better understand Gradient Color Points Assignment, review following example. Color Points 2-8 are assigned a standard rainbow color sequence. Point 1 is assigned white color and Point 9 - black color. The resulted gradient images for each type of gradient as well as with Shift, Split and Mirror effect for some types of gradients displayed below:

Rainbow Sample Color Points Assignment at OGIM
Generated Gradient Image by Type based on above color assignment. See chapter 1.1 for each gradient type explained.
Horizontal Line Gradient
Angle Gradient
Radial Gradient
Radial Gradient with Mirror effect applied (color points 1 - 9 reversed)
Diamond Gradient
Diamond Gradient with Mirror effect applied (color points 1 - 9 reversed)
Rectangle Gradient
Sector Gradient
Horizontal Line Gradient with Split Color point 5 is digested (see chapter 1.3 - Split Gradient)
Angle Gradient with Split Color point 5 is narrowed down to a line (see chapter 1.3 - Split Gradient)
Rectangle Gradient with Split Color point 5 is narrowed down to a line (see chapter 1.3 - Split Gradient)
Rectangle Gradient with Shifted Center (see chapter 1.2 Shift Gradient Center)
Sector Gradient with Shifted Center (see chapter 1.2 Shift Gradient Center)
Radial Gradient with Shifted Center (see chapter 1.2 Shift Gradient Center)
Diamond Gradient with Shifted Center and Mirror effect applied (see chapter 1.2 Shift Gradient Center)