Project 19/20
A playful animated penguin scene built entirely with HTML and CSS 🐧❄️. This project features a CSS-drawn penguin wearing a shirt, with moving arms, expressive eyes, blush, and a snowy mountain background. It includes dynamic effects, CSS variables, and a fully custom layout with no images or JavaScript — pure CSS creativity!
- ✅ Penguin character built with pure CSS
- ✅ Interactive scaling on click (:active effect)
- ✅ Animated arm wave using @keyframes
- ✅ CSS shirt with text and emoji
- ✅ Layered background with mountains and sun
- ✅ Custom colors via CSS variables
- ✅ Responsive layout using relative units
- HTML5
- CSS3
- Animating body parts with
transform-origin
and@keyframes
- Enhancing interaction with simple
:active
scale effects - Managing color themes and reuse with CSS variables
🚀 For me, this project was more about practice and gaining additional experience,
rather than learning something entirely new.👨💻 Since I’m not a beginner and already familiar with these technologies,
I approached it with confidence — and still, I truly enjoyed working on it.🎯 Overall, I consider this a very valuable and enjoyable experience.
- Ferris Wheel | [Project 18/20] → View Repository
- Personal Portfolio Webpage (Certification Project) | [Project 20/20] → View Repository
🙌 Thanks for checking out my project! More coming soon. Stay tuned 🚀