dark mode html css javascript

Better Bat answered on February 6, 2022 Popularity 10/10 Helpfulness 5/10

answer dark mode html css javascript

related dark mode any site in javascript

related dark mode in js

related dark mode javascript

dark mode html css javascript

Comment

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
  padding: 25px;
  background-color: white;
  color: black;
  font-size: 25px;
}

.dark-mode {
  background-color: black;
  color: white;
}
</style>
</head>
<body>

<h2>Toggle Dark/Light Mode</h2>
<p>Click the button to toggle between dark and light mode for this page.</p>

<button onclick="myFunction()">Toggle dark mode</button>

<script>
function myFunction() {
   var element = document.body;
   element.classList.toggle("dark-mode");
}
</script>

</body>
</html>

Popularity 10/10 Helpfulness 5/10 Language javascript

Source: Grepper

Tags: css html javascript mode

Link to this answer
Share Copy Link

Contributed on Feb 06 2022

Better Bat

0 Answers Avg Quality 2/10

Closely Related Answers

dark mode any site in javascript

Comment

const body = document.body;

body.style.backgroundColor = "#333";
body.style.color = "#ddd";

const elements = document.querySelectorAll("div, section, article, h1, h2, h3, h4, h5, h6, p, span, a, button, input, textarea, li, td, th");
for (const element of elements) {
    element.style.backgroundColor = "#333";
    element.style.color = "#ddd";
}

Popularity 9/10 Helpfulness 6/10 Language javascript

Source: Grepper

Tags: any

Link to this answer
Share Copy Link

Contributed on Feb 10 2023

Adorable Albatross

0 Answers Avg Quality 2/10

dark mode in js

Comment

const body = document.querySelector('body');
function toggleDark() {
  if (body.classList.contains('dark')) {
    body.classList.remove('dark');
    localStorage.setItem("theme", "light");
  } else {
    body.classList.add('dark');
    localStorage.setItem("theme", "dark");
  }
}
if (localStorage.getItem("theme") === "dark"){
body.classList.add('dark');
}

Popularity 9/10 Helpfulness 4/10 Language javascript

Source: Grepper

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Dec 28 2022

Sahibe Alam

0 Answers Avg Quality 2/10

dark mode javascript

Comment

-2

// Enter code directly in the console for instant dark mode.
var allDivs = document.querySelectorAll('div');

for(var i = 0; i < allDivs.length; i++){
  allDivs[i].style['background-color'] = 'black';
  allDivs[i].style['color'] = 'green';
  allDivs[i].style['font-family'] = 'Monospace';
}

Popularity 10/10 Helpfulness 1/10 Language javascript

Source: Grepper

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Jul 27 2022

0xTony143

0 Answers Avg Quality 2/10

dark mode html css javascript

Contents

More Related Answers

dark mode html css javascript

Closely Related Answers

dark mode any site in javascript

dark mode in js

dark mode javascript

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.