Contrast Directory

Practice your CSS, loops, and fetch Javascript skills with this challenge.

What’s included?
  • Figma file
  • Assets (icons, images, etc)
  • file
  • PNG design files for desktop, tablet, and mobile.
    • Contrast - work in progress

      ajhughesdev2 years ago

      There is still a bunch I'd like to implement such as functionality in the hamburger menu, the "sort-by" dropdown filter... I also do not have a backend to accept either form submission on the page but overall I'm happy with the look! I've used PostCSS & Sass but I think I could nix Sass at some point and stick with just PostCSS + plugins. Also, vanilla JavaScript.

      This was fun and challenging!

    • I have tried to finish most of the things in the challenge but I've intentionally skipped the form submission to avoid data cluttering of JSON files.

      Your feedback will be highly appreciated.

      You can follow me on Twitter if you would like to 😊

Receive Codewell Updates
Be the first to know when we release new templates, add new features, or do giveaways!
“I wish I had found Codewell when I was starting to learn frontend. It would have saved me a lot of time!”
George Moller
Twitter Content Creator

“Codewell’s designs are so well thought out! They are a great way to hone your Frontend dev skills.”
Isaac Arnold
Self-taught Web Developer

“Codewell is the perfect place for upcoming frontend developers to practice and perfect their craft.”
Freddy Montes
Author of 99 Tips for Webdev
Share this challenge