Skip to content

Added Dark Mode Toggle Using HTML, CSS, and JavaScript#23

Open
KHUSHI-SINGH-star wants to merge 2 commits intoHimanshusk1:mainfrom
KHUSHI-SINGH-star:main
Open

Added Dark Mode Toggle Using HTML, CSS, and JavaScript#23
KHUSHI-SINGH-star wants to merge 2 commits intoHimanshusk1:mainfrom
KHUSHI-SINGH-star:main

Conversation

@KHUSHI-SINGH-star
Copy link

🌙 Feature: Dark Mode Toggle

Implemented a dark mode feature to enhance accessibility and improve user experience during night-time or low-light use.

Issue No:
#13

💡 Highlights:

  • Toggle button added to switch between light and dark themes.
  • Uses JavaScript to dynamically apply CSS class changes.
  • Includes smooth background and text color transitions.
  • Respects layout responsiveness across devices.

🔧 Technologies Used:

  • HTML
  • CSS (custom properties for themes)
  • JavaScript (theme toggle logic)

🙋‍♀️ Contributor:
I'm a GSoC’25 contributor and passionate about frontend development.
I would love to contribute more UI/UX enhancements.
Kindly review this PR and assign the related issue to me.


✅ Let me know if any improvements or changes are needed.

@vercel
Copy link

vercel bot commented Jul 30, 2025

Someone is attempting to deploy a commit to the Himanshu Singh Kyariya's projects Team on Vercel.

A member of the Team first needs to authorize it.

@vercel
Copy link

vercel bot commented Jul 31, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
gurukul_dream_foundation ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jul 31, 2025 5:44am

@Himanshusk1
Copy link
Owner

Hi @KHUSHI-SINGH-star 👋

Thank you for your contribution! 🌙 The dark mode toggle is a great addition and it's awesome to see smooth transitions and responsiveness already in place.

That said, could you please enhance the overall dark theme appearance a bit more? Currently, after toggling, some UI elements (like backgrounds, text contrasts, or section highlights) don’t look as polished and may affect readability or aesthetics.

A few suggestions to consider:

Adjust background and foreground contrast for better visual hierarchy.
Refine color palette to make it more cohesive (especially buttons, cards, and hover states).
Ensure sufficient contrast ratio for accessibility (you can use tools like WebAIM Contrast Checker).

Looking forward to the improved version! Let me know if you need any feedback along the way 😊
Also, assigning you to the related issue now.

Thanks again for your efforts!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants