diff --git a/README.md b/README.md
index 22db97c5..794834cd 100644
--- a/README.md
+++ b/README.md
@@ -44,6 +44,7 @@ A collection of tips to help take your CSS skills pro.
 1. [Set `font-size` on Form Elements for a Better Mobile Experience](#set-font-size-on-form-elements-for-a-better-mobile-experience)
 1. [Use Pointer Events to Control Mouse Events](#use-pointer-events-to-control-mouse-events)
 1. [Set `display: none` on Line Breaks Used as Spacing](#set-display-none-on-line-breaks-used-as-spacing)
+1. [Detect Whether the User Prefers Light Theme or Dark Theme](#detect-whether-the-user-prefers-light-theme-or-dark-theme)
 
 
 ### Use a CSS Reset
@@ -622,6 +623,32 @@ br + br {
 <sup>[back to table of contents](#table-of-contents)</sup>
 
 
+### Detect Whether the User Prefers Light Theme or Dark Theme
+
+With The `prefers-color-scheme` Media Feature You Can Detect What Color Sheme Does the User Prefer
+
+It Checks if the User Has Their System Settings Set To Light Mode or Dark Mode
+
+```css
+/* These Styles Will Apply if User Has Set Their System Settings to Dark Mode */
+@media (prefers-color-scheme: dark) {
+  .element {
+    color: #fff;
+    background-color: #232323;
+  }
+}
+/* These Styles Will Apply if User Has Set Their System Settings to Light Mode */
+@media (prefers-color-scheme: light) {
+  .element {
+    color: #232323;
+    background-color: #fff;
+  }
+}
+```
+
+<sup>[back to table of contents](#table-of-contents)</sup>
+
+
 ## Support
 
 Current versions of Chrome, Firefox, Safari, Opera, Edge, and IE11.