From 67e7aec16e95db8f3f152d500d0a35bae8b4020b Mon Sep 17 00:00:00 2001
From: abdelrhmanahmed <abdelrhmanahmedd2018@gmail.com>
Date: Sun, 27 Sep 2026 01:35:27 +0300
Subject: [PATCH 1/5] test(utilities): add test suite for content-visibility
 utilities

---
 packages/tailwindcss/src/utilities.test.ts | 34 ++++++++++++++++++++++
 1 file changed, 34 insertions(+)

diff --git a/packages/tailwindcss/src/utilities.test.ts b/packages/tailwindcss/src/utilities.test.ts
index 66b051d57961..b3fe54a7c44f 100644
--- a/packages/tailwindcss/src/utilities.test.ts
+++ b/packages/tailwindcss/src/utilities.test.ts
@@ -92,6 +92,40 @@ test('visibility', async () => {
   ).toEqual('')
 })
 
+test('content-visibility', async () => {
+  expect(
+    await run([
+      'content-visibility-auto',
+      'content-visibility-hidden',
+      'content-visibility-visible',
+    ]),
+  ).toMatchInlineSnapshot(`
+    "
+    .content-visibility-auto {
+      content-visibility: auto;
+    }
+
+    .content-visibility-hidden {
+      content-visibility: hidden;
+    }
+
+    .content-visibility-visible {
+      content-visibility: visible;
+    }
+    "
+  `)
+  expect(
+    await run([
+      '-content-visibility-auto',
+      '-content-visibility-hidden',
+      '-content-visibility-visible',
+      'content-visibility-auto/foo',
+      'content-visibility-hidden/foo',
+      'content-visibility-visible/foo',
+    ]),
+  ).toEqual('')
+})
+
 test('position', async () => {
   expect(await run(['static', 'fixed', 'absolute', 'relative', 'sticky'])).toMatchInlineSnapshot(`
     "

From 975c5c3de177c6f74138c54e9d24c98b030fc142 Mon Sep 17 00:00:00 2001
From: abdelrhmanahmed <abdelrhmanahmedd2018@gmail.com>
Date: Sun, 27 Sep 2026 01:35:51 +0300
Subject: [PATCH 2/5] feat(utilities): add property order entry for
 content-visibility

---
 packages/tailwindcss/src/property-order.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/tailwindcss/src/property-order.ts b/packages/tailwindcss/src/property-order.ts
index bf9f0791acdf..f66e95316f99 100644
--- a/packages/tailwindcss/src/property-order.ts
+++ b/packages/tailwindcss/src/property-order.ts
@@ -50,6 +50,7 @@ export default [
 
   'box-sizing',
   'display',
+  'content-visibility',
 
   'field-sizing',
   'aspect-ratio',

From 62ff0a684083de60fa86be598d54e27e6512eaa3 Mon Sep 17 00:00:00 2001
From: abdelrhmanahmed <abdelrhmanahmedd2018@gmail.com>
Date: Sun, 27 Sep 2026 01:36:30 +0300
Subject: [PATCH 3/5] feat(utilities): implement content-visibility utilities
 (auto, hidden, visible)

---
 packages/tailwindcss/src/utilities.ts | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/packages/tailwindcss/src/utilities.ts b/packages/tailwindcss/src/utilities.ts
index 477559d7ea67..ae1f86f63845 100644
--- a/packages/tailwindcss/src/utilities.ts
+++ b/packages/tailwindcss/src/utilities.ts
@@ -624,6 +624,13 @@ export function createUtilities(theme: Theme) {
   staticUtility('invisible', [['visibility', 'hidden']])
   staticUtility('collapse', [['visibility', 'collapse']])
 
+  /**
+   * @css `content-visibility`
+   */
+  staticUtility('content-visibility-auto', [['content-visibility', 'auto']])
+  staticUtility('content-visibility-hidden', [['content-visibility', 'hidden']])
+  staticUtility('content-visibility-visible', [['content-visibility', 'visible']])
+
   /**
    * @css `position`
    */

From eec42a35a044437d72d4f12c3fd52c6e52a54aac Mon Sep 17 00:00:00 2001
From: abdelrhmanahmed <abdelrhmanahmedd2018@gmail.com>
Date: Sun, 27 Sep 2026 01:36:52 +0300
Subject: [PATCH 4/5] docs(utilities): document content-visibility utilities in
 changelog

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e5e6f6f89805..81965600214b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 
 - Add `@tailwindcss/turbopack` package to run Tailwind CSS with Next.js ([20367](https://github.com/tailwindlabs/tailwindcss/pull/20367))
+- Add `content-visibility` utilities (`content-visibility-auto`, `content-visibility-hidden`, `content-visibility-visible`) for rendering performance optimization
 
 ### Fixed
 

From fd3c481d28f727c14d32d79c95b64d170a264e50 Mon Sep 17 00:00:00 2001
From: abdelrhmanahmed <abdelrhmanahmedd2018@gmail.com>
Date: Sun, 27 Sep 2026 02:39:09 +0300
Subject: [PATCH 5/5] docs(changelog): link PR #20520 in changelog entry

---
 CHANGELOG.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 81965600214b..b960fd12e778 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,7 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 
 - Add `@tailwindcss/turbopack` package to run Tailwind CSS with Next.js ([20367](https://github.com/tailwindlabs/tailwindcss/pull/20367))
-- Add `content-visibility` utilities (`content-visibility-auto`, `content-visibility-hidden`, `content-visibility-visible`) for rendering performance optimization
+- Add `content-visibility` utilities (`content-visibility-auto`, `content-visibility-hidden`, `content-visibility-visible`) for rendering performance optimization ([#20520](https://github.com/tailwindlabs/tailwindcss/pull/20520))
 
 ### Fixed