# Adding cookies on webpages for persistent dark mode.

**URL:** <https://forum.kirupa.com/t/adding-cookies-on-webpages-for-persistent-dark-mode/642599>\
**Category:** web dev\
**Created:** [April 27, 2020, 1:21pm UTC](https://forum.kirupa.com/t/adding-cookies-on-webpages-for-persistent-dark-mode/642599 "2020-04-27T13:21:07Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![samiuljoy](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/samiuljoy/32/11565_2.png) [@samiuljoy](https://forum.kirupa.com/u/samiuljoy)\
**Post date:** [April 27, 2020, 1:21pm UTC](https://forum.kirupa.com/t/adding-cookies-on-webpages-for-persistent-dark-mode/642599/1 "2020-04-27T13:21:07Z")

</div>

**Hello there! I hope in times like these, you’re safe.**  
I have been struggling to achieve persistence dark mode while navigating two pages. The page contents turn back to default color while from navigating from pages. I’m an absolute novice/beginner in javascript. This is my two page sample html [gist.github.com/samiuljoy](https://gist.github.com/samiuljoy/f76c8944f8b7b3eecc57cf86ae4ad0ef)  
Could you please help me to add persistent dark mode among these two html pages.  
Greatly appreciate this website, keep up the good work c:

---

<div class="post-metadata">

**Author:** ![Wayne](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/wayne/32/16501_2.png) [@Wayne](https://forum.kirupa.com/u/Wayne)\
**Post date:** [April 27, 2020, 8:23pm UTC](https://forum.kirupa.com/t/adding-cookies-on-webpages-for-persistent-dark-mode/642599/2 "2020-04-27T20:23:03Z")

</div>

You are not storing a value in sessionStorage or cookie. The value get reset after page refresh.

---

<div class="post-metadata">

**Author:** ![Wayne](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/wayne/32/16501_2.png) [@Wayne](https://forum.kirupa.com/u/Wayne)\
**Post date:** [April 27, 2020, 8:25pm UTC](https://forum.kirupa.com/t/adding-cookies-on-webpages-for-persistent-dark-mode/642599/3 "2020-04-27T20:25:28Z")

</div>

Learn more about how to save and load cookies

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [April 27, 2020, 10:50pm UTC](https://forum.kirupa.com/t/adding-cookies-on-webpages-for-persistent-dark-mode/642599/4 "2020-04-27T22:50:55Z")

</div>

I would suggest `localStorqge` over `sessionStorage`, for `localStorage` persists your selection across multiple browser instances: [https://www.kirupa.com/things\_to\_do\_with\_data/web\_storage.htm](https://www.kirupa.com/things_to_do_with_data/web_storage.htm)

I will try to provide a longer answer this evening, but combining a storage solution with a JS check that sets a dark mode class at the root HTML layer might do the trick.
