Edit in JSFiddle

function toggleTheme(theme) {
    const body = document.body;
    body.classList.remove('dark', 'light')
    if (theme == 'dark') {
        body.classList.add('dark')
    } else {
        body.classList.add('light')
    }
}

<h1> “Your eyes can deceive you. Don’t trust them.” – Obi-Wan Kenobi</h1>

<button onClick="toggleTheme('light')">Light mode</button>

<button onClick="toggleTheme('dark')">Dark Mode</button>

body.light {
  background-color: #f5f5f5;
  color: #222222;
}

body.dark {
  background-color: #222222;
  color: #f5f5f5;
}

body {
  padding: 20px;
  margin: 0;
  border: 0;
  background-color: #f5f5f5;
  transition: all 0.3s;
}

h1 {
  color: inherit;
  font-size: 25px; 
}