What can you do with a single CSS keyframe? A metric ton.
0:00 - 50% keyframes are magic
0:49 - Animation is easier than you think
2:17 - Why at 50%?
6:51 - Trick 1 Shake
12:00 - Trick 2 Pulse
23:25 - Trick 3 Glitch
27:55 - Trick 4 Flip
32:45 - Trick 5 Fill
41:20 - Trick 6 Sheen
44:25 - Trick 7 Emphasize
46:50 - Trick 8 Censor
48:35 - Trick 900 Tony Hawk
Links
Bad at CSS - https://twitter.com/badatcss
Adam Twitter - https://twitter.com/argyleink
David Twitter - https://twitter.com/_davideast
Codepen Demo: https://codepen.io/davideast/pen/MWxvzjm
Open Props: https://open-props.style
05/31/24 • 52 min
Generate a badge
Get a badge for your website that links back to this episode
<a href="https://goodpods.com/podcasts/bad-at-css-495798/single-keyframe-tricks-are-magic-65658656"> <img src="https://storage.googleapis.com/goodpods-images-bucket/badges/generic-badge-1.svg" alt="listen to single keyframe tricks are magic on goodpods" style="width: 225px" /> </a>
Copy