From 675ae2aedca395d5e3ce3c9be1b023888fff909c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20Bontems?=
 <67456035+cbontems@users.noreply.github.com>
Date: Thu, 7 Dec 2023 21:12:35 +0100
Subject: [PATCH 1/2] feat(custom-media): add --forcedColors to the custom
 media queries list

---
 src/props.media.css | 2 ++
 src/props.media.js  | 2 ++
 2 files changed, 4 insertions(+)

diff --git a/src/props.media.css b/src/props.media.css
index 134a983d..47b95cd9 100644
--- a/src/props.media.css
+++ b/src/props.media.css
@@ -11,6 +11,8 @@
 @custom-media --highContrast  (prefers-contrast: more);
 @custom-media --lowContrast   (prefers-contrast: less);
 
+@custom-media --forcedColors  (forced-colors: active);
+
 @custom-media --portrait      (orientation: portrait);
 @custom-media --landscape     (orientation: landscape);
 
diff --git a/src/props.media.js b/src/props.media.js
index 64edee88..efd808a5 100644
--- a/src/props.media.js
+++ b/src/props.media.js
@@ -12,6 +12,8 @@ export const CustomMedia = {
   "--highContrast": "(prefers-contrast: more)",
   "--lowContrast": "(prefers-contrast: less)",
 
+  "--forcedColors": "(forced-colors: active)",
+
   "--portrait": "(orientation: portrait)",
   "--landscape": "(orientation: landscape)",
 

From 2209e3ebe706c1dc94dfa13be1a894373ad8fc6c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20Bontems?=
 <67456035+cbontems@users.noreply.github.com>
Date: Fri, 8 Dec 2023 00:37:31 +0100
Subject: [PATCH 2/2] docs(custom-media): add --forcedColors to the Preference
 Vars secction of the docs site

---
 docsite/index.html | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/docsite/index.html b/docsite/index.html
index 5224905a..0eca73b5 100644
--- a/docsite/index.html
+++ b/docsite/index.html
@@ -3365,6 +3365,8 @@ <h5>Preference Vars</h5>
 
               @custom-media --motionOK      (prefers-reduced-motion: no-preference);
               @custom-media --motionNotOK   (prefers-reduced-motion: reduce);
+              
+              @custom-media --forcedColors  (forced-colors: active);
             </code></pre>
           </div>
         </div>