Skip to content

Support different Gradient modes for Color gradient brushes #22

Open
@jongleur1983

Description

In general Gradients from colorA to colorB can have different styles, e.g. gradienting around the color-wheel (clockwise, counter-clockwise), gradienting in a straight line in the color cube or something else.
A sample for that can be seen in Gimp, that has the following options (condensed to those relevant for ImageSharp Gradients):
image

Translated to English:

  1. Foreground to Background - hard edge
  2. Foreground to Background - HSV color counter-clockwise
  3. Foreground to background - HSV color clockwise
  4. Foreground to background - RGB

Option 3 and 4 don't differ on the red-to-yellow example, but do on green-to-red:
image

Up to now there's no option on how to calculate the gradients yet.
Currently we calculate an intermediate color by this code:

https://github.com/SixLabors/ImageSharp/blob/133d90879b17577032a4cc165014915c0829540e/src/ImageSharp.Drawing/Processing/GradientBrush.cs#L121

If I'm not mistaking that's how option 4 from GIMP works.

With the options from the GIMP example above this would be exchanged by
HardEdge: onLocalGradient > 0.5 ? toAsVector : fromAsVector
for HsvClockwise and HsvCounterClockwise the logic basically would be

  • linear interpolation of Hue and Saturation component
  • blending the V(alue) component as a linear blending around the color cone edge in the given direction (clockwise or counter-clockwise).

Conversion HSV<>RGB is already implenmented in HsvAndRgbConverter.cs

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions