A simple, accessible dark mode toggle built with HTML, CSS, and JavaScript.
Supports system preferences, remembers user settings via localStorage, and uses smooth visual transitions.
- 🌙 Toggle between dark & light themes
- 💾 Persists user preference with
localStorage - 🧠 Respects system
prefers-color-scheme - 📱 Responsive and mobile-friendly layout
- ♿ Accessible toggle button with focus styles
- 🎨 Smooth transitions using CSS custom properties
-
Clone the repo:
git clone https://github.com/your-username/dark-mode-toggle.git cd dark-mode-toggle -
Open index.html in your browser.
- HTML5
- CSS3 – custom properties, transitions, media queries
- Vanilla JavaScript
- How to implement theme switching with CSS custom properties
- Using localStorage to persist user preferences
- Improving accessibility with ARIA and focus outlines
Built by @n4aika
