diff --git a/.changeset/forty-seas-worry.md b/.changeset/forty-seas-worry.md
new file mode 100644
index 0000000000..a88c15df53
--- /dev/null
+++ b/.changeset/forty-seas-worry.md
@@ -0,0 +1,5 @@
+---
+'@backstage/canon': patch
+---
+
+Fix styling for the title4 prop on the Heading component in Canon.
diff --git a/canon-docs/src/app/(docs)/components/heading/page.mdx b/canon-docs/src/app/(docs)/components/heading/page.mdx
index e09bae9945..a5eb488411 100644
--- a/canon-docs/src/app/(docs)/components/heading/page.mdx
+++ b/canon-docs/src/app/(docs)/components/heading/page.mdx
@@ -59,6 +59,7 @@ appearance of the heading.
     <Heading variant="title2">Title 2</Heading>
     <Heading variant="title3">Title 3</Heading>
     <Heading variant="title4">Title 4</Heading>
+    <Heading variant="title5">Title 5</Heading>
 </Flex>`}
 />
 
@@ -78,6 +79,17 @@ heading.
   </Heading>`}
 />
 
+### Custom render
+
+You can also use the `render` prop to render the heading as a different element.
+
+<Snippet
+  py={2}
+  open
+  preview={<HeadingSnippet story="CustomRender" />}
+  code={`<Heading render={<h4 />}>Custom render</Heading>`}
+/>
+
 ### Responsive
 
 You can also use the `variant` prop to change the appearance of the text based
diff --git a/canon-docs/src/app/(docs)/components/text/page.mdx b/canon-docs/src/app/(docs)/components/text/page.mdx
index 85a783f4f3..b1af7fa0d7 100644
--- a/canon-docs/src/app/(docs)/components/text/page.mdx
+++ b/canon-docs/src/app/(docs)/components/text/page.mdx
@@ -117,6 +117,16 @@ text.
   </Text>`}
 />
 
+### Custom render
+
+You can also use the `render` prop to render the text as a different element.
+
+<Snippet
+  open
+  preview={<TextSnippet story="CustomRender" />}
+  code={`<Text render={<span />}>Custom render</Text>`}
+/>
+
 ### Responsive
 
 You can also use the `variant` prop to change the appearance of the text based
diff --git a/packages/canon/css/components.css b/packages/canon/css/components.css
index bce8e71a6c..0cfbae85c3 100644
--- a/packages/canon/css/components.css
+++ b/packages/canon/css/components.css
@@ -515,7 +515,7 @@
 }
 
 .canon-Heading[data-variant="title4"] {
-  font-size: var(--canon-font-size-title4);
+  font-size: var(--canon-font-size-6);
   font-weight: var(--canon-font-weight-bold);
 }
 
diff --git a/packages/canon/css/heading.css b/packages/canon/css/heading.css
index 96d6f13fac..e5645e14a9 100644
--- a/packages/canon/css/heading.css
+++ b/packages/canon/css/heading.css
@@ -27,7 +27,7 @@
 }
 
 .canon-Heading[data-variant="title4"] {
-  font-size: var(--canon-font-size-title4);
+  font-size: var(--canon-font-size-6);
   font-weight: var(--canon-font-weight-bold);
 }
 
diff --git a/packages/canon/css/styles.css b/packages/canon/css/styles.css
index 3107c83908..3309933497 100644
--- a/packages/canon/css/styles.css
+++ b/packages/canon/css/styles.css
@@ -9739,7 +9739,7 @@
 }
 
 .canon-Heading[data-variant="title4"] {
-  font-size: var(--canon-font-size-title4);
+  font-size: var(--canon-font-size-6);
   font-weight: var(--canon-font-weight-bold);
 }
 
diff --git a/packages/canon/src/components/Heading/Heading.stories.tsx b/packages/canon/src/components/Heading/Heading.stories.tsx
index bb241b5aae..956118ddeb 100644
--- a/packages/canon/src/components/Heading/Heading.stories.tsx
+++ b/packages/canon/src/components/Heading/Heading.stories.tsx
@@ -46,6 +46,7 @@ export const AllVariants: Story = {
       <Heading variant="title2">Title 2</Heading>
       <Heading variant="title3">Title 3</Heading>
       <Heading variant="title4">Title 4</Heading>
+      <Heading variant="title5">Title 5</Heading>
     </Flex>
   ),
 };
diff --git a/packages/canon/src/components/Heading/styles.css b/packages/canon/src/components/Heading/styles.css
index 1644da09df..ce3da94f7f 100644
--- a/packages/canon/src/components/Heading/styles.css
+++ b/packages/canon/src/components/Heading/styles.css
@@ -43,7 +43,7 @@
 }
 
 .canon-Heading[data-variant='title4'] {
-  font-size: var(--canon-font-size-title4);
+  font-size: var(--canon-font-size-6);
   font-weight: var(--canon-font-weight-bold);
 }