HTML/CSS - 25

swstack < 1 min read

HTML/CSS - 25: Dark Mode & Theming

Learn how to implement beautiful dark mode with system preference detection and toggle buttons.

✦ HTML Editor

▶ Live Output

👀 Show Solution

:root {
  --bg: #000;
  --text: #00ff9d;
}

body {
  background: var(--bg);
  color: var(--text);
}

#toggle {
  padding: 12px 24px;
  background: #111;
  color: #00ff9d;
  border: 2px solid #00ff9d;
}