diff --git a/components/ui/Step.tsx b/components/ui/Step.tsx
index b89aa076c..1159785b1 100644
--- a/components/ui/Step.tsx
+++ b/components/ui/Step.tsx
@@ -28,7 +28,7 @@ function TitleTag({ size, title }) {
           id={id}
           color="default"
           weight="semi-bold"
-          size="3"
+          size="4"
           mb="2"
         >
           {title}
@@ -49,8 +49,33 @@ function TitleTag({ size, title }) {
         </Heading>
       );
     }
+    case "h4": {
+      return (
+        <Heading
+          as="h4"
+          id={id}
+          color="default"
+          weight="semi-bold"
+          size="2"
+          mb="2"
+        >
+          {title}
+        </Heading>
+      );
+    }
     default:
-      return null;
+      return (
+        <Heading
+          as="h2"
+          id={id}
+          color="default"
+          weight="semi-bold"
+          size="4"
+          mb="2"
+        >
+          {title}
+        </Heading>
+      );
   }
 }
 
diff --git a/content/integrations/chat/slack/sending-a-direct-message.mdx b/content/integrations/chat/slack/sending-a-direct-message.mdx
index 152d61482..54b48a721 100644
--- a/content/integrations/chat/slack/sending-a-direct-message.mdx
+++ b/content/integrations/chat/slack/sending-a-direct-message.mdx
@@ -278,7 +278,7 @@ export async function fetchUserId(email: string): Promise<string> {
 We'll break this function down step-by-step:
 
 <Steps titleSize="h4">
-  <Step title="Get the `access_token` stored in Knock for the user's tenant">
+  <Step title="Get the access_token stored in Knock for the user's tenant">
     Since your users have already connected their Slack workspace to Knock, you can use the `knockClient.objects.getChannelData` method to get the `access_token` for the user's tenant. Tenants in Knock are stored in a system-reserved object collection called `$tenants`.
 
     ```javascript