CSS animations

Table of Contents

• About the presenter
• Why is CSS so?
• CSS animation examples
• Why?
• Where to start?
• For meeeee

About the presenter

Julia started doing CSS animations after watching Una Kravets about CSS drawings.

Why is CSS so?

• 1900 first cartoon
• 1917 first animation
• 1928 first Disney cartoon
• 1962 first video game
• 1991 computer video game
• 1996 CSS was created

CSS animation examples

1. CSS responsive house - David Khourshid
2. Alix the CSS Husky - David Khourshid
3. CSS-only walking dog - David Khourshid
4. Pure CSS Landscape - An Evening in Southwold - Ben Evans
5. Pure CSS Moka Pot - Ben Evans
6. Christmas cannon - Steve Gardner
7. Pure CSS morphing polyhedra - Ana Tudor
8. Ferris wheel - Amit Sheen
9. Pure eye - Julia Miocene
10. Pure CSS “Tractor” - Julia Miocene
11. Pure CSS Monument Valley II - Julia Miocene
12. ILoveFrontend 2021 workshop - Julia Miocene
13. Masterclass - Julia Miocene
14. Pure CSS Cartoon or Not? - Julia Miocene
15. Sunday CSS #1: The Last of Us - Julia Miocene
16. Sunday CSS #5: Shapes. Part 4/4 - Julia Miocene
17. Fancy loader - Julia Miocene

Why?

• Learn/try new things
• Have fun and prevent burnout
• Gain skills in a nearby area
• Find a creative community
• Push technology forward

Where to start?

• codepen.io/challenges
• cssbattle.dev
• 100daysCSS.com

For meeeee

Twitter like Neomorph UI Kit Pure CSS Figures