Which GSAP ease best matches CSS's "transition-timing-function: ease"

[MSCAU]

I have foreground and background elements animating together for 2 seconds. To keep the code simple I am only using GSAP to animate the (more complex) background elements while using CSS transitions for the foreground elements.

 

Does anyone know which GSAP ease best matches the default CSS transition function of "transition-timing-function: ease"?

I note that this page mentions that it is equivalent cubic-bezier(0.25,0.1,0.25,1), whatever that means: 

https://www.w3schools.com/cssref/css3_pr_transition-timing-function.asp

 

I see that it's not quite in sync with GSAP's "power1.out".

[OSUblake]

You would need to use CustomEase to match it.

 

https://greensock.com/docs/v3/Eases?CustomEase=M0,0 C0.25,0.1 0.25,1 1,1

 

CustomEase.create("custom", "M0,0 C0.25,0.1 0.25,1 1,1");

gsap.to(".foo", {
  x: 100,
  ease: "custom"
});

 

[GreenSock]

Pro tip: as long as you've got CustomEase loaded, you can actually just do this: 

ease: "0.25,0.1,0.25,1"

But I'd still recommend doing it sorta like Blake did simply because I obsess about performance and if you create the ease up front and re-use it, that's more efficient: 

See the Pen poWqzvY?editors=0010 by GreenSock (@GreenSock) on CodePen

[MSCAU]

Thanks, both! Works very nicely.