Utilities for transition properties.
Transition Duration
Using ts-[number], you can control the duration of CSS transitions.
You can use numerical values which will be converted into a multiple of 1ms (can be changed in config → units).
For example, "ts-560" will give you a transition-duration of 560ms.
When adding or removing classes to an element dynamically,
use "tsm-[number]" instead of "ts-[number]".
You can use Arbitrary values like "ts-(1.5s)" or "ts-(400ms)" as well.
Learn more about Arbitrary Styling
Transition Delay
Using ts-d-[number], you can control the delay of CSS transitions.
You can use numerical values which will be converted into a multiple of 1ms (can be changed in config → units).
For example, "ts-560" will give you a transition-delay of 560ms.
When adding or removing classes to an element dynamically,
use "tsm-d-[number]" instead of "ts-[number]".
You can use Arbitrary values like "ts-d-(1.5s)" or "ts-d-(400ms)" as well.
Learn more about Arbitrary Styling
Transition Timing Function
Using ts-f-[*], you can control the easing of CSS transitions.
You can use any cubic-beziar value.
When adding or removing classes to an element dynamically,
use "tsm-f-[*]" instead of "ts-f-[*]".
Transition Property
Using ts-p-[*], you can control which CSS properties transition.
You can use Arbitrary values like "ts-p-(color,height,background-color)" as well.
Learn more about Arbitrary Styling