Unique animation timing functions

values.animations.timingFunctions.unique

A list of all unique animation-timing-functions and transition-timing-functions, including the ones that are part of the animation and transition shorthand.

Example

selector {
  /* Regular animation- & transition-timing-function properties */
  animation-timing-function: linear;
  animation-timing-function: ease-in-out;
  transition-timing-function: cubic-bezier(0, 0, 1, 1);

  /* `animation` shorthand property */
  animation: 2s my-animation linear;
}

The resulting metric looks like this:

{
  "values.animations.timingFunctions.unique": [
    {
      "value": "cubic-bezier(0, 0, 1, 1)",
      "count": 1
    },
    {
      "value": "ease-in-out",
      "count": 1
    },
    {
      "value": "linear",
      "count": 2
    }
  ]
}

Note that linear and cubic-bezier(0, 0, 1, 1) are not strictly equal, because of their different notations.

Further reading