CSS animation with cubic-bezier
Today I discovered that it's possible to use cubic Bézier curves to specify the speed curve of an animation. I was not entirely satisfied with the result I was getting with the various ease functions and I was looking for something more flexible; that's when I discovered cubic-bezier.
This is an example of how to use this type of curve with animation:
animation-timing-function: cubic-bezier(0.9, 0, 0.1, 1);
Although I am not new to Bézier curves, I found the tool on https://cubic-bezier.com to be pretty useful as it's very intuitive and CSS-specific. It has a nice “Preview & compare” feature to compare the configured curve with any of the other available animation functions.
I am more and more impressed with the amount of features that modern CSS has to offer.