Re: [csswg-drafts] Proposal: a way to _not_ reverse an animation's timing function when it plays in `reverse` or `alternate` direction (#12978)

> Instead of tacking it onto `animation-easing`, why not an extra keyword on the `animation-direction`? The concept of not reversing the timing functions does seem very much linked to the `animation-direction`.

It's a bit of both, yeah, but IMO it's more a property of the easing than the direction.

Let's consider an animation that has a single iteration, so `animation-direction` is not set, it has the initial value of `normal`.
Now you want to trigger it forwards/backwards, either via WAAPI or `animation-trigger`, but you want the easing to flip when reversed.

Let's consider the two options:

1. When set on the **easing**:

```css
.animated {
  animation: move 1s both;
  animation-easing: ease-out flip;
  animation-trigger: --click play-forwards play-backwards;
}
```

2. When set on the **direction**:

```css
.animated {
  animation: move 1s both;
  animation-easing: ease-out;
  animation-direction: flip;
  animation-trigger: --click play-forwards play-backwards;
}
```

IMO the first one is clearer.

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 15 May 2026 09:30:19 UTC