diff --git a/.changeset/tasty-toes-smile.md b/.changeset/tasty-toes-smile.md
new file mode 100644
index 0000000000000..f302bf97f8591
--- /dev/null
+++ b/.changeset/tasty-toes-smile.md
@@ -0,0 +1,6 @@
+---
+'@node-core/ui-components': patch
+---
+
+Widen the article layout to 120rem on 3xl screens and give the extra space to the
+metabar, so table of contents entries no longer wrap.
diff --git a/packages/ui-components/src/Containers/Article/index.module.css b/packages/ui-components/src/Containers/Article/index.module.css
index 8d3dccdfd9a8f..0dd9ce4655dbe 100644
--- a/packages/ui-components/src/Containers/Article/index.module.css
+++ b/packages/ui-components/src/Containers/Article/index.module.css
@@ -7,7 +7,8 @@
     ml:grid-rows-[1fr]
     ml:overflow-visible
     ml:[grid-template-areas:'sidebar_main''sidebar_footer']
-    3xl:grid-cols-[--spacing(80)_1fr_--spacing(80)]
+    3xl:grid-cols-[--spacing(80)_1fr_--spacing(144)]
+    3xl:max-w-12xl
     mx-auto
     block
     w-full
diff --git a/packages/ui-components/src/Containers/Footer/index.module.css b/packages/ui-components/src/Containers/Footer/index.module.css
index 77b36eb06e26c..c285c5571f862 100644
--- a/packages/ui-components/src/Containers/Footer/index.module.css
+++ b/packages/ui-components/src/Containers/Footer/index.module.css
@@ -13,6 +13,7 @@
 
   .innerContainer {
     @apply max-w-10xl
+      3xl:max-w-12xl
       mx-auto
       flex
       flex-col
diff --git a/packages/ui-components/src/Containers/NavBar/index.module.css b/packages/ui-components/src/Containers/NavBar/index.module.css
index 78c1932d413c3..e445929b15c7e 100644
--- a/packages/ui-components/src/Containers/NavBar/index.module.css
+++ b/packages/ui-components/src/Containers/NavBar/index.module.css
@@ -11,6 +11,7 @@
 
   .innerContainer {
     @apply max-w-10xl
+      3xl:max-w-12xl
       xl:mx-auto
       xl:flex
       xl:h-16