Joy Shaheb

Posted on Dec 6, 2020 • Edited on Dec 22, 2020

Light/Dark Mode Toggle Button Using 1 variable 2021 || CSS JS

#codepen #webdev #css #tutorial

If you really want your Readers to Read All of your contents, then having a dark mode is a must on your website.

Because, A dark theme reduces the irritation on readers eyes compared to light mode.

Today, we'll make a Scalable dark/light mode toggler button, & we'll do all the calculation's using 1 scss variable.

Codepen 🔥

You can find the full code on Codepen

Youtube Tutorial 🔥

If the codepen is difficult for you then see Step by step Tutorial on Youtube 🔥

Suggestions & Criticisms are Highly Appreciated ❤️️

Youtube / Joy Shaheb
Twitter / JoyShaheb
Instagram / JoyShaheb

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (1)

sithembiso • Dec 23 '20

can you add code that will remember the mode if I chose to refresh the page

ICU vs. i18next: Choosing the Right Format for Your Localization Needs

Eric Allard - Dec 12 '24

Learn how to change background color on scroll with Tailwind CSS and Alpine JS

Michael Andreuzza - Dec 12 '24

Using React as Static Files in Django: Step-by-Step Guide

grbeno - Jan 13

Mastering SQL Joins - Inner, Outer, Cross, and Self-Joins with Examples

Luca Liu - Jan 13

DEV Community