diff --git a/src/styled-text/styled-text.stories.tsx b/src/styled-text/styled-text.stories.tsx
index 9526341..0b599b5 100644
--- a/src/styled-text/styled-text.stories.tsx
+++ b/src/styled-text/styled-text.stories.tsx
@@ -11,7 +11,7 @@ export default {
     baseTextSize: {
       control: {
         type: "select",
-        options: [1, 2],
+        options: [1, 2, 3],
       },
     },
   },
diff --git a/src/styled-text/styled-text.tsx b/src/styled-text/styled-text.tsx
index 8da6405..1e3347f 100644
--- a/src/styled-text/styled-text.tsx
+++ b/src/styled-text/styled-text.tsx
@@ -1,7 +1,7 @@
 import clsx from "clsx";
 import React from "react";
 type Props = {
-  baseTextSize?: 1 | 2;
+  baseTextSize?: 1 | 2 | 3;
   children?: React.ReactNode;
   dangerouslySetInnerHTML?: {
     __html: string;
@@ -25,6 +25,8 @@ export const StyledText = ({
             baseTextSize === 1,
           "prose-p:text-md prose-p:leading-7 prose-p:text-grey-900  prose-li:text-md prose-li:leading-7 prose-li:text-grey-900":
             baseTextSize === 2,
+          "prose-p:text-base prose-p:leading-4 prose-p:text-grey-900  prose-li:text-base prose-li:leading-4 prose-li:text-grey-900":
+            baseTextSize === 3,
         },
         // h styles
         "prose-h2:font-semibold prose-h2:text-3md prose-h2:leading-8 prose-h2:lg:text-xl prose-h2:lg:leading-11 prose-h2:text-grey-900",