diff --git a/packages/documentation/src/components/Markdown/renderers.module.scss b/packages/documentation/src/components/Markdown/renderers.module.scss
index a00ad795b9..80601ef6d1 100644
--- a/packages/documentation/src/components/Markdown/renderers.module.scss
+++ b/packages/documentation/src/components/Markdown/renderers.module.scss
@@ -1,3 +1,7 @@
+.heading {
+  word-break: break-word;
+}
+
 .task {
   list-style: none;
   margin-left: -2.5rem;
diff --git a/packages/documentation/src/components/Markdown/renderers.tsx b/packages/documentation/src/components/Markdown/renderers.tsx
index f358a3ad1d..248d0171d8 100644
--- a/packages/documentation/src/components/Markdown/renderers.tsx
+++ b/packages/documentation/src/components/Markdown/renderers.tsx
@@ -80,7 +80,12 @@ export const renderers: MarkdownRenderers = {
 
     const id = useSluggedId(tokens);
     return (
-      <Typography id={id} type={type} suppressHydrationWarning>
+      <Typography
+        id={id}
+        type={type}
+        className={styles.heading}
+        suppressHydrationWarning
+      >
         {children}
       </Typography>
     );