Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted over 2 years ago

Responsive Sunnyside Agency Landing Page w/ Custom Dark Mode

animation, bem, sass/scss
Basit Korai•350
@basitkorai
A solution to the Agency landing page challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


Hi, my Frontend Mentor Friends

This is my solution for Sunnyside Agency Landing Page.

The Most Exciting Custom Feature I added is Dark Mode. 🌙 Depending on your device's theme preference, the dark mode will automatically be turned on, or you can toggle it in dev tools. Be sure to turn off any extensions before viewing the site.

More Custom features I added

  • Custom navigation bar animation added 🧭
  • Sticky navigation bar functionality🍡
  • Custom hover underline animations for navigation links 🖇️

My Experience: Creating Dark Mode functionality was fun and overwhelming at the same time for me. This is actually my first time implementing dark mode in a project. If you guys have any other suggestions on dark mode, on how I could make it more efficient, or if there is any other easy way of doing this.

More Info.

  • Scored 93.25% (average - desktop) on Google Pagespeed Insights! 💻
  • Built with Mobile First Workflow 📲

Feel free to bless me with any feedback and help me to make my solution better in any way possible.

Peace out ✌️

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Basit Korai's solution.

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License