diff --git a/scss/_dark.scss b/scss/_dark.scss
index ae2fd1f45..3de52352f 100644
--- a/scss/_dark.scss
+++ b/scss/_dark.scss
@@ -1,6 +1,6 @@
 // stylelint-disable declaration-no-important
 
-body.theme-dark {
+@mixin dark-mode {
   color: #afbdd1;
   background: $dark;
 
@@ -29,3 +29,12 @@ body.theme-dark {
   }
 }
 
+body.theme-dark {
+  @include dark-mode;
+}
+
+@media (prefers-color-scheme: dark) {
+  body {
+    @include dark-mode;
+  }
+}
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 87a4e2e63..cf2799199 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -262,6 +262,8 @@ $yiq-contrasted-threshold: 200 !default;
 
 $card-border-color: $border-color !default;
 $list-group-border-color: $border-color !default;
+$list-group-action-color: inherit !default;
+
 $body-color: $dark !default;
 
 $input-disabled-bg: $gray-100 !default;
diff --git a/scss/ui/_examples.scss b/scss/ui/_examples.scss
index 423c900b6..00eeb1022 100644
--- a/scss/ui/_examples.scss
+++ b/scss/ui/_examples.scss
@@ -6,7 +6,7 @@
 }
 
 .example-bg {
-  background: $body-bg;
+  background: $min-black;
 }
 
 .example + .highlight {