Additional easing

[andrilla-francis]

I love how Tailwind modifies the standard named transition-timing-function values to use better looking cubic-bezier functions. I think it would be great to have a couple more simple options by default. I always add these to my projects, and I tend to use the exponential one by default.

--ease-exponential: cubic-bezier(0.25, 0.5, 0, 0.99);
--ease-spring: cubic-bezier(0.35, 1.67, 0.44, 0.78);

Exponential movement tends to look best for hover transitions, because you can feel the instant interaction, while still feeling very smooth.

Spring movement is really helpful to have for a more playful or loose feel.

[cicicdamir]

The addition of an exponential ease is a game-changer for perceived latency. In high-performance interfaces, that "instant" start from cubic-bezier(0.25, 0.5, 0, 0.99) provides much better tactile feedback than the standard ease-out.

For those implementing this in the current v4 environment, you can integrate these directly into your theme to maintain design consistency across the system.

Refined integration for your @theme block:

@theme {
  --ease-exponential: cubic-bezier(0.25, 0.5, 0, 1);
  --ease-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

[andrilla-francis]

Your responses must be written with AI, because this isn't a helpful comment, just repeating my point, and providing the code, which was already provided by me, but with a worse spring. Thanks for the support, though, I guess. ✓