diff --git a/src/docs/adding-custom-styles.mdx b/src/docs/adding-custom-styles.mdx
index ee3b83e00..a85fd795f 100644
--- a/src/docs/adding-custom-styles.mdx
+++ b/src/docs/adding-custom-styles.mdx
@@ -16,7 +16,7 @@ If you want to change things like your color palette, spacing scale, typography
 @theme {
   --font-display: "Satoshi", "sans-serif";
 
-  --breakpoint-3xl: 1920px;
+  --breakpoint-3xl: 120rem;
 
   --color-avocado-100: oklch(0.99 0 0);
   --color-avocado-200: oklch(0.98 0.04 113.22);
diff --git a/src/docs/functions-and-directives.mdx b/src/docs/functions-and-directives.mdx
index 877e4e8b8..5dae779ca 100644
--- a/src/docs/functions-and-directives.mdx
+++ b/src/docs/functions-and-directives.mdx
@@ -25,7 +25,7 @@ Use the `@theme` directive to define your project's custom design tokens, like f
 @theme {
   --font-display: "Satoshi", "sans-serif";
 
-  --breakpoint-3xl: 1920px;
+  --breakpoint-3xl: 120rem;
 
   --color-avocado-100: oklch(0.99 0 0);
   --color-avocado-200: oklch(0.98 0.04 113.22);
diff --git a/src/docs/upgrade-guide.mdx b/src/docs/upgrade-guide.mdx
index d1749d4bb..a1bad9fb8 100644
--- a/src/docs/upgrade-guide.mdx
+++ b/src/docs/upgrade-guide.mdx
@@ -567,7 +567,7 @@ When using a prefix, you should still configure your theme variables as if you a
 @theme {
   --font-display: "Satoshi", "sans-serif";
 
-  --breakpoint-3xl: 1920px;
+  --breakpoint-3xl: 120rem;
 
   --color-avocado-100: oklch(0.99 0 0);
   --color-avocado-200: oklch(0.98 0.04 113.22);
@@ -583,7 +583,7 @@ The generated CSS variables _will_ include a prefix to avoid conflicts with any
 :root {
   --tw-font-display: "Satoshi", "sans-serif";
 
-  --tw-breakpoint-3xl: 1920px;
+  --tw-breakpoint-3xl: 120rem;
 
   --tw-color-avocado-100: oklch(0.99 0 0);
   --tw-color-avocado-200: oklch(0.98 0.04 113.22);