Build faster with Premium Chakra UI Components 💎

Learn more
Skip to Content
DocsPlaygroundGuidesBlog
Sponsor

Animations

The list of available animation tokens

Keyframes

Chakra UI supports the following keyframes out of the box.

theme.keyframes

spin

pulse

ping

bounce

fade-in

fade-out

slide-from-left-full

slide-from-right-full

slide-from-top-full

slide-from-bottom-full

slide-to-left-full

slide-to-right-full

slide-to-top-full

slide-to-bottom-full

slide-from-top

slide-from-bottom

slide-from-left

slide-from-right

slide-to-top

slide-to-bottom

slide-to-left

slide-to-right

scale-in

scale-out

Durations

Chakra UI supports the following durations out of the box.

theme.tokens.durations

slowest

slower

slow

moderate

fast

faster

fastest

Previous

Slot Recipes

Next

Aspect Ratios