Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/victoriamcn/penguin-animation

Animation Challenge with freeCodeCamp
https://github.com/victoriamcn/penguin-animation

css-animations css3 freecodecamp-challenge html5

Last synced: about 10 hours ago
JSON representation

Animation Challenge with freeCodeCamp

Awesome Lists containing this project

README

        

# Note from Victoria

In December 2022, I was curious about software and started [freeCodeCamp's](https://www.freecodecamp.org/) Responsive Web Design course. This project, along with the [Taylor-Swift-Tribute-Page project](https://github.com/victoriamcn/Taylor-Swift-Tribute-Page/tree/main), are apart of that course. Long story short, these projects are what started my tech journey. While I don't update them and they are static one page sites written in vanilla HTML and CSS, I keep them here as a testament to how far I've come.

---

# Penguin Animation Challenge

🐧
🐧
👋
👋

## Preview
![alt text](./penguin-animation.PNG)

## Description

This animation was a freeCodeCamp challenge and made 100% with CSS.

## Instructions

You can transform HTML elements to create appealing designs that draw your reader's eye. You can use transforms to rotate elements, scale them, and more. In this course, you'll build a penguin. You'll use CSS transforms to position and resize the parts of your penguin, create a background, and animate your work.

## Badges
![freeCodeCamp](https://img.shields.io/badge/freeCodeCamp-0A0A23.svg?style=for-the-badge&logo=freeCodeCamp&logoColor=white)
![HTML5](https://img.shields.io/badge/html5-%23E34F26.svg?style=for-the-badge&logo=html5&logoColor=white)
![CSS3](https://img.shields.io/badge/css3-%231572B6.svg?style=for-the-badge&logo=css3&logoColor=white)