diff --git a/src/navs/documentation.js b/src/navs/documentation.js
index 36b55b77e..04b8585f7 100644
--- a/src/navs/documentation.js
+++ b/src/navs/documentation.js
@@ -226,7 +226,7 @@ export const documentationNav = {
     pages['will-change'],
   ],
   SVG: [pages['fill'], pages['stroke'], pages['stroke-width']],
-  Accessibility: [pages['screen-readers']],
+  Accessibility: [pages['screen-readers'], pages['forced-colors-adjust']],
   'Official Plugins': [
     pages['typography-plugin'],
     {
diff --git a/src/pages/docs/forced-colors-adjust.mdx b/src/pages/docs/forced-colors-adjust.mdx
new file mode 100644
index 000000000..755532f6b
--- /dev/null
+++ b/src/pages/docs/forced-colors-adjust.mdx
@@ -0,0 +1,20 @@
+---
+title: "Forced Colors Adjust"
+description: "Utilities for controlling whether forced-colors mode applies to an element."
+---
+
+import utilities from 'utilities?plugin=forcedColorsAdjust'
+
+export const classes = { utilities }
+
+## Basic usage
+
+### Opt-out of forced colors
+
+Use `forced-colors-none` to opt an element out of `forced-colors` adjustment:
+
+```html
+<div class="forced-colors-none">
+  <!-- Content that needs to opt out of forced-colors mode -->
+</div>
+```