Skip to content

Commit

Permalink
[css-color-4] Fix note about double positions making a stripe. Add no…
Browse files Browse the repository at this point in the history
…te about color before/after the stop lists. #11381
  • Loading branch information
tabatkins committed Mar 11, 2025
1 parent 6204839 commit 43c8b65
Showing 1 changed file with 11 additions and 2 deletions.
13 changes: 11 additions & 2 deletions css-images-4/Overview.bs
Original file line number Diff line number Diff line change
Expand Up @@ -1878,8 +1878,11 @@ Color Stop Lists</h4>
A <a>color stop</a> with two positions is equivalent
to specifying two <a>color stops</a> with the same color,
one for each position.
<span class='note'>Specifying two locations makes it easier to create solid-color "stripes" in a gradient,
without having to repeat the color twice.</span>

Note: Usually, this results in a solid-color "stripe"
between the two positions,
but using a ''longer'' <<color-interpolation-method>>
will instead create a "rainbow" between the two positions.

Percentages are resolved against the length of the <a>gradient line</a>
between the <a>starting point</a> and <a>ending point</a>,
Expand Down Expand Up @@ -1930,6 +1933,12 @@ Coloring the Gradient Line</h4>
the color space used for gradient interpolation
is the default interpolation color space, Oklab, as defined in [[css-color-4]].

Note: The <<color-interpolation-method>>
only affects the colors <em>between</em> stops.
The color before the first and after the last stop
is equal to the first/last stop,
<em>regardless</em> of the interpolation method.

<wpt>
gradients-with-transparent.html
gradient/css-color-4-colors-default-to-oklab-gradient.html
Expand Down

0 comments on commit 43c8b65

Please sign in to comment.