Chakra-UI: How to set a transition time between color modes?

Viewed 2676

Right now when I change color mode via a dark / light theme button toggle, the page background color will blend into the new background color over 0.2 seconds or so, and all other colors will instantly change to the new color. I'd either like to define a color mode switch transition time, or at least make them the same between elements.

I just set the background of everything explicitly, that way everything changes color instantly. But I'd like it if I can have the quick transition instead.

1 Answers

Ok so I figured it out immediately after posting this question. Pretty simple really, just pass something like transition="background-color 200ms linear" or transitionDuration="200ms" into your ui component.

Related