Proposal: feHSL element (was Re: [filter-effects] hue-rotate() and saturate() filters)

Hello ,

Here is a proposal for a new feHSL element which performs hue rotation
and saturation changes without suffering from internal clipping. Due
to filter effects clipping after each primitive, saturation increases
will still suffer from clipping in a multi-stage pipeline.

I didn't provide for any operations on the L axis of HSL because
operations on lightness or luminance are already available by other


Name:   feHSL
Categories:     Filter primitive element
Content model:  Any number of the following elements, in any order:



    core attributes — ‘id’, ‘xml:base’, ‘xml:lang’, ‘xml:space’
    presentation attributes — ‘alignment-baseline’, ‘baseline-shift’,
      ‘clip’, ‘clip-path’, ‘clip-rule’, ‘color’, ‘color-interpolation’,
      ‘color-interpolation-filters’, ‘color-profile’, ‘color-rendering’,
      ‘cursor’, ‘direction’, ‘display’, ‘dominant-baseline’,
      ‘enable-background’, ‘fill’, ‘fill-opacity’, ‘fill-rule’, ‘filter’,
      ‘flood-color’, ‘flood-opacity’, ‘font’, ‘font-family’, ‘font-size’,
      ‘font-size-adjust’, ‘font-stretch’, ‘font-style’, ‘font-variant’,
      ‘font-weight’, ‘glyph-orientation-horizontal’,
      ‘glyph-orientation-vertical’, ‘image-rendering’, ‘isolation’,
      ‘kerning’, ‘letter-spacing’, ‘lighting-color’, ‘marker’,
      ‘marker-end’, ‘marker-mid’, ‘marker-start’, ‘mask’, ‘mix-blend-mode’,
      ‘opacity’, ‘overflow’, ‘pointer-events’, ‘shape-rendering’,
      ‘stop-color’, ‘stop-opacity’, ‘stroke’, ‘stroke-dasharray’,
      ‘stroke-dashoffset’, ‘stroke-linecap’, ‘stroke-linejoin’,
      ‘stroke-miterlimit’, ‘stroke-opacity’, ‘stroke-width’, ‘text-anchor’,
      ‘text-decoration’, ‘text-rendering’, ‘unicode-bidi’, ‘visibility’,
      ‘word-spacing’, ‘writing-mode’
    filter primitive attributes — ‘x’, ‘y’, ‘width’, ‘height’, ‘result’

DOM Interfaces:         SVGFEHSLElement

This filter applies a transformation in HSL colorspace. Input values
are converted (if needed) from the colorspace given by
'color-interpolation-filters' to sRGB, and then to HSL for processing.
Results are converted from HSL to the colorspace given by

The calculations are performed on non-premultiplied color values.

Attribute definitions:

 type = "hue" | "saturation"
 Indicates the type of operation to be performed: hue rotation or
 saturation/desaturation. The lacuna value for 'type' is "hue".

 value = <number>
 For type="hue", the value represents a hue rotation in degrees.
 Positive and negative angles may be specified. The new hue angle H'
 is given by

 H' = (H + value) mod 360

 For type="saturation", the value represents a saturation multiplier.
 Values less than 1.0 represent desaturation; values greater than 1.0
 represent increases in saturation.  A value of 0.0 results in full
 desaturation to the L axis. The new saturation value S' is given by

 S' = S * value

 Note that results are clamped to the saturation range 0.0 ... 1.0

 The lacuna value of 'value' depends on the value for 'type'. For
 type="hue" the lacuna value for 'value' is 0.0 (no rotation); for
 type="saturation" the lacuna value for 'value' is 1.0 (no change in


 Add an example or two and some suitable definition for the DOM

Best regards,

Received on Tuesday, 15 October 2013 16:02:13 UTC