Re: [csswg-drafts] [css-images] Add easing functions to color stops (#1332)

Just wanted to chip in that the syntax where easing functions are defined, like interpolation hints, as individual items in the color stop list makes a lot of sense to me, and it extends hints intuitively. In fact, by defining the hint function as:

```js
const midpoint = H =>
  t =>
    H === 0 ? 1 : 
    H === 1 ? 0 : 
    Math.pow(t, Math.log(0.5) / Math.log(H));
```
(where H is the midpoint projected to the `[0, 1]` interval between its adjacent color stops), I was able to trivially replace that function with any easing function, allowing things like:

```css
linear-gradient: (to right, red, green, midpoint(0.5), blue)
linear-gradient: (to right, red, green, ease-in-out, blue)
```

One thing that trips me up with the current midpoint syntax is that [midpoints shift the color stops](https://github.com/w3c/csswg-drafts/issues/3931). By defining this hypothetical function `midpoint()` that takes an argument from 0 to 1, we decouple the midpoint from position computation.

-- 
GitHub Notification of comment by danburzo
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/1332#issuecomment-492555433 using your GitHub account

Received on Wednesday, 15 May 2019 08:18:19 UTC