DEV Community

Cover image for Submission for Frontend Challenge Earth-Day-Edition: Elements of Earth: CSS Card animation
Sundus Hussain
Sundus Hussain

Posted on • Edited on

Submission for Frontend Challenge Earth-Day-Edition: Elements of Earth: CSS Card animation

This is a submission for Frontend Challenge v24.04.17, CSS Art: Earth Day 2024

AIMING FOR DEV SHOP GIFT(TEE)

Inspiration
The inspiration for this CSS animation project is drawn from the various elements of earth (soil, water, fire, air, and space).

Demo

Below given is live link for the submission.
Live Link: https://sundus-hussain.github.io/Dev_Earth_day/

Source Code : https://github.com/Sundus-hussain/Dev_Earth_day

Journey

  1. The journey begins with finding the right concept.
  2. This design embraces a whimsical yet sophisticated aesthetic, revealing hidden treasures with every click.
  3. Witness creativity blossoming in every pixel, inviting exploration and discovery at every click.
  4. This design is created keeping in mind about the color contrast and opacity of the images(I am still doubtful about it.... hope you like it!!!), and screen reader compatibility.
  5. Responsive design ensures a flawless viewing experience across devices, from desktops to smartphones.

image links:(https://www.craiyon.com/image/sKXNCYtIR5GwfYl4bfKIZg , https://www.istockphoto.com/photo/burning-earth-gm174702179-9948965 , https://sm.mashable.com/mashable_in/photo/default/gw-copy_87rn.jpg, https://w0.peakpx.com/wallpaper/740/461/HD-wallpaper-earth-view-from-space-earth-space-digital-universe.jpg , https://t4.ftcdn.net/jpg/05/55/32/99/360_F_555329972_7CNEDOvl34YykCyeoRe8dMbF5yNTcDRE.jpg, https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR125PDJbp3L8zOWWTIfke2E4kft5TzVpBsq3LyeJePs2LKkBN5)

Thank you!

Top comments (8)

Collapse
 
sana_sheikh_01 profile image
SANA

Beautiful work Sundus

Collapse
 
sundus profile image
Sundus Hussain

Thanks SANA

Collapse
 
rebeccapeltz1 profile image
Rebecca Peltz

Beautiful. I didn't realize we could add to the HTML. It was a challenge styling with the HTML provided.

Collapse
 
sundus profile image
Sundus Hussain

Thank you.

Collapse
 
sarahokolo profile image
sahra 💫

Just beautiful, I love the cards animation really much😊✨

Collapse
 
sundus profile image
Sundus Hussain

Thank you sahra

Collapse
 
sundus profile image
Sundus Hussain

Thank you so much for the likes and comment.

Collapse
 
saratongo profile image
Sara

nice