🔥 UXResponsiveDesign 🔥

Recreated the following Responsive Design

📺 Watch these CSS videos (Optional)

1. Watch this video about viewport units of measure.
2. Watch this video an introduction to Flex Boxes.
3. Watch this video about Flex Boxes: wrap, justify, and align content.
4. Watch this video about Flex Boxes: child property.

Practice responsive design 🙈 🙉 🙊

Try to recreate the following mockups by using responsive design. The images on the left represent the browser at desktop width, the images on the right represent the same browser but at mobile width. Unsure how to make your CSS/HTML responsive? Look up how to use media queries!

These are three desktop to mobile mockups

🎨🍒🍇🍋 Color Pallet

Take a look at the Design seeds web site find a nice color pallet and implement it to your design.

💻 Demos 📱

First Mockup https://brunno-dasilva.github.io/UXResponsiveDesign/first_mockup/

Second Mockup https://brunno-dasilva.github.io/UXResponsiveDesign/second_mockup/

Third Mockup https://brunno-dasilva.github.io/UXResponsiveDesign/third_mockup/

Fourth Mockup https://brunno-dasilva.github.io/UXResponsiveDesign/fourth_mockup/index.html