CSS Animation: translate3d, backdrop-filter and custom tags

Hello everyone, On this tutorial we are going to learn on how to create a smooth animation using CSS transform translate3d prop, why to use cubic-bezier transition timing function and its benefits. How and why to use custom tags. And if you watch the video by the end I also did a bonus tip using backdrop-filter to have some frost/blur style on background. Topics: 1. Why and how to use the translate3d 2. Why and how to use cubic-bezier 3. Using custom tags 4. Apply color by using currentColor 5. Using backdrop-filter Don’t forget to subscribe ✌️ Source: Demos: Blackhole: Links: Timestamps: 00:00 - preview 01:35 - markup / custom tags 04:30 - shape / currentColor 08:17 - translate3d / animation delay 11:50 - animation keyframes
Back to Top