[csswg-drafts] [css-values] Clarification on what the second `<easing-function>` in first clause in calc-interpolate do? (#13848)

weinig has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-values] Clarification on what the second `<easing-function>` in first clause in calc-interpolate do? ==
The [calc-interpolate()](https://drafts.csswg.org/css-values-5/#calc-interpolate) grammar is currently:

```
<calc-interpolate()> = calc-interpolate(
  [
    <progress-source> && [ by <easing-function> ]?
    && <easing-function>?
  ] ,
  <input-position>{1,2} : <calc-sum> ,
  [ <easing-function>? , <input-position>{1,2} : <calc-sum> ]#? )
```

In that first clause:

```
  [
    <progress-source> && [ by <easing-function> ]?
    && <easing-function>?
  ] ,
```

There are two `<easing-function>` productions. 

The first one, with a `by` prefix, is defined in [`7.1.1.1. Easing Interpolation Progress: the by <easing-function> argument` ](https://drafts.csswg.org/css-values-5/#interpolation-progress-easing), and "It applies the specified easing function to the “timeline” of progress as a whole by modifying the interpolation progress before it’s applied to".

The second one, however, I am not 100% clear on. 

I think it is the `<easing-function>` that https://drafts.csswg.org/css-values-5/#valdef-calc-interpolate-easing-function describes as "appearing in the first argument" and therefore "specifies the “default” easing function to be used between each stop.", but since it that is the ["7.1.2. Defining the Interpolation Map"](https://drafts.csswg.org/css-values-5/#interpolation-map-arguments) I am not completely confident. 

This could maybe be made a bit clearer if the various <easing-function> arguments were aliased. Perhaps something like:

```
<timeline-easing-function> = <easing-function>
<default-easing-function> = <easing-function>
<surrounding-stops-easing-function> = <easing-function>

<calc-interpolate()> = calc-interpolate(
  [
    <progress-source> && [ by <timeline-easing-function> ]?
    && <default-easing-function>?
  ] ,
  <input-position>{1,2} : <calc-sum> ,
  [ <surrounding-stops-easing-function>? , <input-position>{1,2} : <calc-sum> ]#? )
```


Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/13848 using your GitHub account


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

Received on Tuesday, 28 April 2026 16:47:05 UTC