Create a Card Flip Animation with CSS

Andy Van Slaars
InstructorAndy Van Slaars

Share this video with your friends

Send Tweet

Animation can be a powerful way to enhance a user experience. In this lesson, we'll walk through the creation of a card-flip animation, creating a nice visual effect when toggling between the front and back of a div meant to represent a card, like a playing card, or a flashcard. We'll create this effect using a touch of JavaScript and CSS transforms. No framework or library required.

Juan Marco
Juan Marco
~ a year ago

If anybody is wondering how the transition timing function ease works, check out this post.

Will Johnson
Will Johnson
~ a year ago

If anybody is wondering how the transition timing function ease works, check out this post.

Hey @Juan thank you for sharing that resource to help out fellow learners!