دارک مود دارم ولی با رفرش برمیگرده به حالت دیفالت

سلام.
کد زیر رو توی head صفحه قرار بدید.

<script>
            if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
                document.documentElement.classList.add('dark')
            } else {
                document.documentElement.classList.remove('dark')
            }
        </script>

مقدار localStorage.theme همیشه یا مقداری که کاربر تنظیم کرده یا مقداری که به صورت پیش فرض سیستم هست را نگه میداره.

@hadikhanian
قالب من پیشفرض استایلش دارک هست من با دکمه دارک مود به body کلاس light میدم تا تغییرات اعمال شه
حالا با کدی که شما فرستادین کار نکرد

انتظار ارائه دوره آموزشی از کاربران اینجا نداشته باش لطفا.
مشکل شما ذخیره سازی اطلاعات در کوکی (لوکال استوریج) بود که دوستمون توضیح دادن.
کدتون رو طبق چیزی که میخواید تغییر بدید.
پیاده روی هم فراموش نشه!!!

درود خوبی...
کد زیر:
HTML :

 <div class="form-check form-switch text-center">
            <label class="form-check-label">تاریک / روشن</label>
            <input class="form-check-input" type="checkbox" role="switch" id="darkSwitch" checked>
</div>

CSS:

[data-theme="dark"] {
  background-color: #111 !important;
  color: #eee;
}

[data-theme="dark"] .bg-black {
  background-color: #fff !important;
}

[data-theme="dark"] .bg-dark {
  background-color: #eee !important;
}

[data-theme="dark"] .bg-light {
  background-color: #222 !important;
}

[data-theme="dark"] .bg-white {
  background-color: #000 !important;
}

[data-theme="dark"] .bg-blue {
  background-color: #222 !important;
}

[data-theme="dark"] .card {
  background-color: #222 !important;
}

[data-theme="dark"] .text-bg-light {
  color: #fff !important;
}

[data-theme="dark"] .value {
  color: #fff !important;
}

[data-theme="dark"] .text-muted {
  color: #a4a6a7 !important;
}

[data-theme="dark"] .btn-light {
  background-color: #222 !important;
  color: #fff !important;
}

JavaScript:

var darkSwitch = document.getElementById("darkSwitch");
window.addEventListener("load", function () {
  if (darkSwitch) {
    initTheme();
    darkSwitch.addEventListener("change", function () {
      resetTheme();
    });
  }
});

function initTheme() {
  var darkThemeSelected =
    localStorage.getItem("darkSwitch") !== null &&
    localStorage.getItem("darkSwitch") === "dark";
  darkSwitch.checked = darkThemeSelected;
  darkThemeSelected
    ? document.body.setAttribute("data-theme", "dark")
    : document.body.removeAttribute("data-theme");
}

function resetTheme() {
  if (darkSwitch.checked) {
    document.body.setAttribute("data-theme", "dark");
    localStorage.setItem("darkSwitch", "dark");
  } else {
    document.body.removeAttribute("data-theme");
    localStorage.removeItem("darkSwitch");
  }
}

پیوند زیر:
https://github.com/coliff/dark-mode-switch

توی پروژه ام به کار بردم و کار می کند.

@endworld
شیر مادر حلالت