diff --git a/.changeset/empty-boats-care.md b/.changeset/empty-boats-care.md
new file mode 100644
index 00000000000..5c3980891db
--- /dev/null
+++ b/.changeset/empty-boats-care.md
@@ -0,0 +1,9 @@
+---
+"@razorpay/blade": minor
+---
+
+fix(Blade): add `size` prop to Text component and update tokens
+
+This PR updates the typography tokens scale for mobile devices to create better visual hierarchy which we received as feedback from other teams as well.
+
+It also adds a new `size` prop to `Text` component for `variant='body'` 
diff --git a/packages/blade/src/components/Button/BaseButton/BaseButton.tsx b/packages/blade/src/components/Button/BaseButton/BaseButton.tsx
index a8d1175a348..319285178bc 100644
--- a/packages/blade/src/components/Button/BaseButton/BaseButton.tsx
+++ b/packages/blade/src/components/Button/BaseButton/BaseButton.tsx
@@ -1,6 +1,5 @@
 import { useEffect } from 'react';
 import styled from 'styled-components';
-
 import type { ReactElement } from 'react';
 import StyledBaseButton from './StyledBaseButton';
 import type { ButtonTypography, ButtonMinHeight } from './buttonTokens';
@@ -17,7 +16,6 @@ import type { Theme } from '~components/BladeProvider';
 import type { SpinnerSize } from '~components/Spinner/spinnerTokens';
 import type { BaseTextProps } from '~components/Typography/BaseText';
 import type { IconComponent, IconProps, IconSize } from '~components/Icons';
-import type { TypographyPlatforms } from '~tokens/global/typography';
 import type { DurationString, EasingString } from '~tokens/global/motion';
 import type { BorderRadiusValues, BorderWidthValues, SpacingValues } from '~tokens/theme/theme';
 import { makeAccessible, usePrevious, makeSize, makeSpace, makeBorderSize, getIn } from '~utils';
@@ -138,7 +136,7 @@ const getProps = ({
   hasIcon,
   iconPosition,
 }: {
-  buttonTypographyTokens: ButtonTypography[TypographyPlatforms];
+  buttonTypographyTokens: ButtonTypography;
   children?: string;
   isDisabled: boolean;
   hasIcon: boolean;
@@ -271,8 +269,7 @@ const BaseButton = ({
   accessibilityLabel,
 }: BaseButtonProps): ReactElement => {
   const disabled = isLoading || isDisabled;
-  const { theme, platform } = useTheme();
-  const buttonTypographyTokens = buttonTypography[platform];
+  const { theme } = useTheme();
   if (!Icon && !children?.trim()) {
     throw new Error(
       `[Blade: BaseButton]: At least one of icon or text is required to render a button.`,
@@ -316,7 +313,7 @@ const BaseButton = ({
     motionDuration,
     motionEasing,
   } = getProps({
-    buttonTypographyTokens,
+    buttonTypographyTokens: buttonTypography,
     children,
     isDisabled: disabled,
     size,
diff --git a/packages/blade/src/components/Button/BaseButton/__tests__/__snapshots__/BaseButton.native.test.tsx.snap b/packages/blade/src/components/Button/BaseButton/__tests__/__snapshots__/BaseButton.native.test.tsx.snap
index 979d8516cad..7be4a2989b2 100644
--- a/packages/blade/src/components/Button/BaseButton/__tests__/__snapshots__/BaseButton.native.test.tsx.snap
+++ b/packages/blade/src/components/Button/BaseButton/__tests__/__snapshots__/BaseButton.native.test.tsx.snap
@@ -89,7 +89,7 @@ exports[`<BaseButton /> should render button with default properties 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -98,7 +98,7 @@ exports[`<BaseButton /> should render button with default properties 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -206,7 +206,7 @@ exports[`<BaseButton /> should render button with full width 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -215,7 +215,7 @@ exports[`<BaseButton /> should render button with full width 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -374,7 +374,7 @@ exports[`<BaseButton /> should render button with icon with default iconPosition
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -383,7 +383,7 @@ exports[`<BaseButton /> should render button with icon with default iconPosition
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -542,7 +542,7 @@ exports[`<BaseButton /> should render button with icon with left iconPosition 1`
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -551,7 +551,7 @@ exports[`<BaseButton /> should render button with icon with left iconPosition 1`
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -659,7 +659,7 @@ exports[`<BaseButton /> should render button with icon with right iconPosition 1
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -668,7 +668,7 @@ exports[`<BaseButton /> should render button with icon with right iconPosition 1
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -965,7 +965,7 @@ exports[`<BaseButton /> should render disabled button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -974,7 +974,7 @@ exports[`<BaseButton /> should render disabled button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1082,7 +1082,7 @@ exports[`<BaseButton /> should render disabled information intent high contrast
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1091,7 +1091,7 @@ exports[`<BaseButton /> should render disabled information intent high contrast
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1199,7 +1199,7 @@ exports[`<BaseButton /> should render disabled information intent low contrast b
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1208,7 +1208,7 @@ exports[`<BaseButton /> should render disabled information intent low contrast b
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1316,7 +1316,7 @@ exports[`<BaseButton /> should render disabled negative intent high contrast but
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1325,7 +1325,7 @@ exports[`<BaseButton /> should render disabled negative intent high contrast but
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1433,7 +1433,7 @@ exports[`<BaseButton /> should render disabled negative intent low contrast butt
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1442,7 +1442,7 @@ exports[`<BaseButton /> should render disabled negative intent low contrast butt
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1550,7 +1550,7 @@ exports[`<BaseButton /> should render disabled neutral intent high contrast butt
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1559,7 +1559,7 @@ exports[`<BaseButton /> should render disabled neutral intent high contrast butt
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1667,7 +1667,7 @@ exports[`<BaseButton /> should render disabled neutral intent low contrast butto
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1676,7 +1676,7 @@ exports[`<BaseButton /> should render disabled neutral intent low contrast butto
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1784,7 +1784,7 @@ exports[`<BaseButton /> should render disabled notice intent high contrast butto
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1793,7 +1793,7 @@ exports[`<BaseButton /> should render disabled notice intent high contrast butto
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1901,7 +1901,7 @@ exports[`<BaseButton /> should render disabled notice intent low contrast button
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1910,7 +1910,7 @@ exports[`<BaseButton /> should render disabled notice intent low contrast button
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -2018,7 +2018,7 @@ exports[`<BaseButton /> should render disabled positive intent high contrast but
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -2027,7 +2027,7 @@ exports[`<BaseButton /> should render disabled positive intent high contrast but
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -2135,7 +2135,7 @@ exports[`<BaseButton /> should render disabled positive intent low contrast butt
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -2144,7 +2144,7 @@ exports[`<BaseButton /> should render disabled positive intent low contrast butt
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -2252,7 +2252,7 @@ exports[`<BaseButton /> should render disabled secondary variant button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -2261,7 +2261,7 @@ exports[`<BaseButton /> should render disabled secondary variant button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -2369,7 +2369,7 @@ exports[`<BaseButton /> should render disabled tertiary variant button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -2378,7 +2378,7 @@ exports[`<BaseButton /> should render disabled tertiary variant button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -2486,7 +2486,7 @@ exports[`<BaseButton /> should render information intent high contrast button 1`
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -2495,7 +2495,7 @@ exports[`<BaseButton /> should render information intent high contrast button 1`
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -2603,7 +2603,7 @@ exports[`<BaseButton /> should render information intent low contrast button 1`]
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -2612,7 +2612,7 @@ exports[`<BaseButton /> should render information intent low contrast button 1`]
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -2720,7 +2720,7 @@ exports[`<BaseButton /> should render large size button 1`] = `
       fontSize="17px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="18px"
       style={
         Array [
           Object {
@@ -2729,7 +2729,7 @@ exports[`<BaseButton /> should render large size button 1`] = `
             "fontSize": 17,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 18,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -2837,7 +2837,7 @@ exports[`<BaseButton /> should render medium size button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -2846,7 +2846,7 @@ exports[`<BaseButton /> should render medium size button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -2954,7 +2954,7 @@ exports[`<BaseButton /> should render negative intent high contrast button 1`] =
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -2963,7 +2963,7 @@ exports[`<BaseButton /> should render negative intent high contrast button 1`] =
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -3071,7 +3071,7 @@ exports[`<BaseButton /> should render negative intent low contrast button 1`] =
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -3080,7 +3080,7 @@ exports[`<BaseButton /> should render negative intent low contrast button 1`] =
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -3188,7 +3188,7 @@ exports[`<BaseButton /> should render neutral intent high contrast button 1`] =
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -3197,7 +3197,7 @@ exports[`<BaseButton /> should render neutral intent high contrast button 1`] =
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -3305,7 +3305,7 @@ exports[`<BaseButton /> should render neutral intent low contrast button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -3314,7 +3314,7 @@ exports[`<BaseButton /> should render neutral intent low contrast button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -3422,7 +3422,7 @@ exports[`<BaseButton /> should render notice intent high contrast button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -3431,7 +3431,7 @@ exports[`<BaseButton /> should render notice intent high contrast button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -3539,7 +3539,7 @@ exports[`<BaseButton /> should render notice intent low contrast button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -3548,7 +3548,7 @@ exports[`<BaseButton /> should render notice intent low contrast button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -3656,7 +3656,7 @@ exports[`<BaseButton /> should render positive intent high contrast button 1`] =
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -3665,7 +3665,7 @@ exports[`<BaseButton /> should render positive intent high contrast button 1`] =
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -3773,7 +3773,7 @@ exports[`<BaseButton /> should render positive intent low contrast button 1`] =
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -3782,7 +3782,7 @@ exports[`<BaseButton /> should render positive intent low contrast button 1`] =
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -3890,7 +3890,7 @@ exports[`<BaseButton /> should render secondary variant button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -3899,7 +3899,7 @@ exports[`<BaseButton /> should render secondary variant button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -4124,7 +4124,7 @@ exports[`<BaseButton /> should render tertiary variant button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -4133,7 +4133,7 @@ exports[`<BaseButton /> should render tertiary variant button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
diff --git a/packages/blade/src/components/Button/BaseButton/__tests__/__snapshots__/BaseButton.web.test.tsx.snap b/packages/blade/src/components/Button/BaseButton/__tests__/__snapshots__/BaseButton.web.test.tsx.snap
index f29f7842314..f0e6deebcd6 100644
--- a/packages/blade/src/components/Button/BaseButton/__tests__/__snapshots__/BaseButton.web.test.tsx.snap
+++ b/packages/blade/src/components/Button/BaseButton/__tests__/__snapshots__/BaseButton.web.test.tsx.snap
@@ -4266,7 +4266,7 @@ exports[`<BaseButton /> should render small size button 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 1.25rem;
+  line-height: 1rem;
   text-align: center;
 }
 
@@ -4524,7 +4524,7 @@ exports[`<BaseButton /> should render xsmall size button 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 1.25rem;
+  line-height: 1rem;
   text-align: center;
 }
 
diff --git a/packages/blade/src/components/Button/BaseButton/buttonTokens.ts b/packages/blade/src/components/Button/BaseButton/buttonTokens.ts
index 6ccd436b090..adca8db08f6 100644
--- a/packages/blade/src/components/Button/BaseButton/buttonTokens.ts
+++ b/packages/blade/src/components/Button/BaseButton/buttonTokens.ts
@@ -1,58 +1,34 @@
 import type { BaseButtonProps } from './BaseButton';
-import type { ThemeTokens } from '~tokens/theme/theme';
-import type { TypographyPlatforms } from '~tokens/global/typography';
+import type { Theme } from '~components/BladeProvider';
 import type { IconProps } from '~components/Icons';
 import type { SpinnerProps } from '~components/Spinner/Spinner';
 
 export type ButtonMinHeight = 28 | 32 | 36 | 48;
 
 export type ButtonTypography = {
-  [Key in TypographyPlatforms]: {
-    fonts: {
-      size: Record<
-        NonNullable<BaseButtonProps['size']>,
-        keyof ThemeTokens['typography'][Key]['fonts']['size']
-      >;
-    };
-    lineHeights: Record<
-      NonNullable<BaseButtonProps['size']>,
-      keyof ThemeTokens['typography'][Key]['lineHeights']
-    >;
+  fonts: {
+    size: Record<NonNullable<BaseButtonProps['size']>, keyof Theme['typography']['fonts']['size']>;
   };
+  lineHeights: Record<
+    NonNullable<BaseButtonProps['size']>,
+    keyof Theme['typography']['lineHeights']
+  >;
 };
 
 const typography: ButtonTypography = {
-  onDesktop: {
-    fonts: {
-      size: {
-        xsmall: 75,
-        small: 75,
-        medium: 100,
-        large: 200,
-      },
-    },
-    lineHeights: {
-      xsmall: 'l',
-      small: 'l',
-      medium: 'l',
-      large: 's',
+  fonts: {
+    size: {
+      xsmall: 75,
+      small: 75,
+      medium: 100,
+      large: 200,
     },
   },
-  onMobile: {
-    fonts: {
-      size: {
-        xsmall: 50,
-        small: 50,
-        medium: 100,
-        large: 200,
-      },
-    },
-    lineHeights: {
-      xsmall: 's',
-      small: 's',
-      medium: 'm',
-      large: 'm',
-    },
+  lineHeights: {
+    xsmall: 's',
+    small: 's',
+    medium: 'l',
+    large: 'm',
   },
 };
 
@@ -65,7 +41,7 @@ const minHeight: Record<NonNullable<BaseButtonProps['size']>, ButtonMinHeight> =
 
 const buttonPadding: Record<
   NonNullable<BaseButtonProps['size']>,
-  Record<'top' | 'bottom' | 'left' | 'right', keyof ThemeTokens['spacing']>
+  Record<'top' | 'bottom' | 'left' | 'right', keyof Theme['spacing']>
 > = {
   xsmall: {
     top: 0,
@@ -110,7 +86,7 @@ const buttonSizeToSpinnerSizeMap: Record<
   large: 'medium',
 };
 
-const textPadding: Record<NonNullable<BaseButtonProps['size']>, keyof ThemeTokens['spacing']> = {
+const textPadding: Record<NonNullable<BaseButtonProps['size']>, keyof Theme['spacing']> = {
   xsmall: 1,
   small: 1,
   medium: 2,
diff --git a/packages/blade/src/components/Button/Button/__tests__/__snapshots__/Button.native.test.tsx.snap b/packages/blade/src/components/Button/Button/__tests__/__snapshots__/Button.native.test.tsx.snap
index 532457d0d67..c56ee39e204 100644
--- a/packages/blade/src/components/Button/Button/__tests__/__snapshots__/Button.native.test.tsx.snap
+++ b/packages/blade/src/components/Button/Button/__tests__/__snapshots__/Button.native.test.tsx.snap
@@ -89,7 +89,7 @@ exports[`<Button /> should render button with default properties 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -98,7 +98,7 @@ exports[`<Button /> should render button with default properties 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -206,7 +206,7 @@ exports[`<Button /> should render button with full width 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -215,7 +215,7 @@ exports[`<Button /> should render button with full width 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -374,7 +374,7 @@ exports[`<Button /> should render button with icon with default iconPosition 1`]
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -383,7 +383,7 @@ exports[`<Button /> should render button with icon with default iconPosition 1`]
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -491,7 +491,7 @@ exports[`<Button /> should render button with icon with right iconPosition 1`] =
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -500,7 +500,7 @@ exports[`<Button /> should render button with icon with right iconPosition 1`] =
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -659,7 +659,7 @@ exports[`<Button /> should render disabled button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -668,7 +668,7 @@ exports[`<Button /> should render disabled button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -776,7 +776,7 @@ exports[`<Button /> should render disabled secondary variant button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -785,7 +785,7 @@ exports[`<Button /> should render disabled secondary variant button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -893,7 +893,7 @@ exports[`<Button /> should render disabled tertiary variant button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -902,7 +902,7 @@ exports[`<Button /> should render disabled tertiary variant button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1010,7 +1010,7 @@ exports[`<Button /> should render large size button 1`] = `
       fontSize="17px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="18px"
       style={
         Array [
           Object {
@@ -1019,7 +1019,7 @@ exports[`<Button /> should render large size button 1`] = `
             "fontSize": 17,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 18,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1127,7 +1127,7 @@ exports[`<Button /> should render medium size button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1136,7 +1136,7 @@ exports[`<Button /> should render medium size button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1244,7 +1244,7 @@ exports[`<Button /> should render secondary variant button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1253,7 +1253,7 @@ exports[`<Button /> should render secondary variant button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
@@ -1478,7 +1478,7 @@ exports[`<Button /> should render tertiary variant button 1`] = `
       fontSize="15px"
       fontStyle="normal"
       fontWeight={700}
-      lineHeight="16px"
+      lineHeight="24px"
       style={
         Array [
           Object {
@@ -1487,7 +1487,7 @@ exports[`<Button /> should render tertiary variant button 1`] = `
             "fontSize": 15,
             "fontStyle": "normal",
             "fontWeight": "700",
-            "lineHeight": 16,
+            "lineHeight": 24,
             "textAlign": "center",
             "textDecorationLine": "none",
           },
diff --git a/packages/blade/src/components/Button/Button/__tests__/__snapshots__/Button.web.test.tsx.snap b/packages/blade/src/components/Button/Button/__tests__/__snapshots__/Button.web.test.tsx.snap
index d75da825bcd..da1deb652b5 100644
--- a/packages/blade/src/components/Button/Button/__tests__/__snapshots__/Button.web.test.tsx.snap
+++ b/packages/blade/src/components/Button/Button/__tests__/__snapshots__/Button.web.test.tsx.snap
@@ -1417,7 +1417,7 @@ exports[`<Button /> should render small size button 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 1.25rem;
+  line-height: 1rem;
   text-align: center;
 }
 
@@ -1675,7 +1675,7 @@ exports[`<Button /> should render xsmall size button 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 1.25rem;
+  line-height: 1rem;
   text-align: center;
 }
 
diff --git a/packages/blade/src/components/Typography/BaseText/__tests__/__snapshots__/BaseText.native.test.tsx.snap b/packages/blade/src/components/Typography/BaseText/__tests__/__snapshots__/BaseText.native.test.tsx.snap
index a75eee7ef82..a03a0b109f6 100644
--- a/packages/blade/src/components/Typography/BaseText/__tests__/__snapshots__/BaseText.native.test.tsx.snap
+++ b/packages/blade/src/components/Typography/BaseText/__tests__/__snapshots__/BaseText.native.test.tsx.snap
@@ -7,7 +7,7 @@ exports[`<BaseText /> should render regular text 1`] = `
   fontSize="11px"
   fontStyle="normal"
   fontWeight={400}
-  lineHeight="16px"
+  lineHeight="18px"
   style={
     Array [
       Object {
@@ -16,7 +16,7 @@ exports[`<BaseText /> should render regular text 1`] = `
         "fontSize": 11,
         "fontStyle": "normal",
         "fontWeight": "400",
-        "lineHeight": 16,
+        "lineHeight": 18,
         "textAlign": "left",
         "textDecorationLine": "none",
       },
@@ -36,7 +36,7 @@ exports[`<BaseText /> should render text in italics style with line-through 1`]
   fontSize="11px"
   fontStyle="italic"
   fontWeight={400}
-  lineHeight="16px"
+  lineHeight="18px"
   style={
     Array [
       Object {
@@ -45,7 +45,7 @@ exports[`<BaseText /> should render text in italics style with line-through 1`]
         "fontSize": 11,
         "fontStyle": "italic",
         "fontWeight": "400",
-        "lineHeight": 16,
+        "lineHeight": 18,
         "textAlign": "left",
         "textDecorationLine": "line-through",
       },
diff --git a/packages/blade/src/components/Typography/BaseText/__tests__/__snapshots__/BaseText.web.test.tsx.snap b/packages/blade/src/components/Typography/BaseText/__tests__/__snapshots__/BaseText.web.test.tsx.snap
index f2890ad2c3b..d99a601f750 100644
--- a/packages/blade/src/components/Typography/BaseText/__tests__/__snapshots__/BaseText.web.test.tsx.snap
+++ b/packages/blade/src/components/Typography/BaseText/__tests__/__snapshots__/BaseText.web.test.tsx.snap
@@ -9,7 +9,7 @@ exports[`<BaseText /> should render regular text 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 1.125rem;
+  line-height: 1rem;
   text-align: left;
 }
 
@@ -36,7 +36,7 @@ exports[`<BaseText /> should render text as paragraph element 1`] = `
   font-style: italic;
   -webkit-text-decoration-line: line-through;
   text-decoration-line: line-through;
-  line-height: 1.125rem;
+  line-height: 1rem;
   text-align: left;
 }
 
@@ -63,7 +63,7 @@ exports[`<BaseText /> should render text in italics style with line-through 1`]
   font-style: italic;
   -webkit-text-decoration-line: line-through;
   text-decoration-line: line-through;
-  line-height: 1.125rem;
+  line-height: 1rem;
   text-align: left;
 }
 
diff --git a/packages/blade/src/components/Typography/Heading/Heading.tsx b/packages/blade/src/components/Typography/Heading/Heading.tsx
index e90484bbda7..c9555de18ca 100644
--- a/packages/blade/src/components/Typography/Heading/Heading.tsx
+++ b/packages/blade/src/components/Typography/Heading/Heading.tsx
@@ -61,22 +61,22 @@ const getProps = <T extends { variant: HeadingVariant }>({
 
   if (variant === 'small') {
     props.fontSize = 200;
-    props.lineHeight = 'xl';
+    props.lineHeight = '2xl';
     props.as = isPlatformWeb ? 'h6' : undefined;
   } else if (variant === 'medium') {
     props.fontSize = 300;
-    props.lineHeight = '2xl';
+    props.lineHeight = '3xl';
     props.as = isPlatformWeb ? 'h5' : undefined;
   } else if (variant === 'large') {
     props.fontSize = 400;
-    props.lineHeight = '2xl';
+    props.lineHeight = '3xl';
     props.as = isPlatformWeb ? 'h4' : undefined;
   } else if (variant === 'subheading') {
     if (weight === 'regular') {
       throw new Error(`[Blade: Heading]: weight cannot be 'regular' when variant is 'subheading'`);
     }
     props.fontSize = 75;
-    props.lineHeight = 'm';
+    props.lineHeight = 's';
     props.as = isPlatformWeb ? 'h6' : undefined;
   }
 
diff --git a/packages/blade/src/components/Typography/Heading/__tests__/__snapshots__/Heading.native.test.tsx.snap b/packages/blade/src/components/Typography/Heading/__tests__/__snapshots__/Heading.native.test.tsx.snap
index 9824cd745bd..84f66dd4d33 100644
--- a/packages/blade/src/components/Typography/Heading/__tests__/__snapshots__/Heading.native.test.tsx.snap
+++ b/packages/blade/src/components/Typography/Heading/__tests__/__snapshots__/Heading.native.test.tsx.snap
@@ -155,7 +155,7 @@ exports[`<Heading /> should render Heading with variant "subheading" and weight
   accessibilityRole="header"
   color="hsla(217, 18%, 45%, 1)"
   fontFamily="Lato"
-  fontSize="14px"
+  fontSize="12px"
   fontStyle="normal"
   fontWeight={700}
   lineHeight="16px"
@@ -164,7 +164,7 @@ exports[`<Heading /> should render Heading with variant "subheading" and weight
       Object {
         "color": "hsla(217, 18%, 45%, 1)",
         "fontFamily": "Lato",
-        "fontSize": 14,
+        "fontSize": 12,
         "fontStyle": "normal",
         "fontWeight": "700",
         "lineHeight": 16,
diff --git a/packages/blade/src/components/Typography/Heading/__tests__/__snapshots__/Heading.web.test.tsx.snap b/packages/blade/src/components/Typography/Heading/__tests__/__snapshots__/Heading.web.test.tsx.snap
index ed76087d182..2d6ab106413 100644
--- a/packages/blade/src/components/Typography/Heading/__tests__/__snapshots__/Heading.web.test.tsx.snap
+++ b/packages/blade/src/components/Typography/Heading/__tests__/__snapshots__/Heading.web.test.tsx.snap
@@ -36,7 +36,7 @@ exports[`<Heading /> should render Heading with variant "large" 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 1.5rem;
+  line-height: 1.75rem;
   text-align: left;
 }
 
@@ -63,7 +63,7 @@ exports[`<Heading /> should render Heading with variant "medium" 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 1.5rem;
+  line-height: 1.75rem;
   text-align: left;
 }
 
@@ -144,7 +144,7 @@ exports[`<Heading /> should render Heading with variant "subheading" and weight
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 1.125rem;
+  line-height: 1rem;
   text-align: left;
 }
 
diff --git a/packages/blade/src/components/Typography/Text/Text.stories.tsx b/packages/blade/src/components/Typography/Text/Text.stories.tsx
index 03e08ee74af..c075a4e5c58 100644
--- a/packages/blade/src/components/Typography/Text/Text.stories.tsx
+++ b/packages/blade/src/components/Typography/Text/Text.stories.tsx
@@ -54,6 +54,7 @@ const TextStoryMeta: Meta<TextProps<{ variant: 'body' | 'caption' }>> = {
   args: {
     variant: 'body',
     weight: 'regular',
+    size: 'medium',
     type: 'normal',
     children:
       'Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc',
diff --git a/packages/blade/src/components/Typography/Text/Text.tsx b/packages/blade/src/components/Typography/Text/Text.tsx
index 235710caf1d..09f77824be9 100644
--- a/packages/blade/src/components/Typography/Text/Text.tsx
+++ b/packages/blade/src/components/Typography/Text/Text.tsx
@@ -19,11 +19,13 @@ type TextVariant = 'body' | 'caption';
 type TextBodyVariant = TextCommonProps & {
   variant?: Extract<TextVariant, 'body'>;
   weight?: keyof Theme['typography']['fonts']['weight'];
+  size?: 'small' | 'medium';
 };
 
 type TextCaptionVariant = TextCommonProps & {
   variant?: Extract<TextVariant, 'caption'>;
   weight?: keyof Pick<Theme['typography']['fonts']['weight'], 'regular'>;
+  size?: 'medium';
 };
 
 /**
@@ -48,8 +50,9 @@ const getProps = <T extends { variant: TextVariant }>({
   variant,
   type,
   weight,
+  size,
   contrast,
-}: Pick<TextProps<T>, 'type' | 'variant' | 'weight' | 'contrast'>): Omit<
+}: Pick<TextProps<T>, 'type' | 'variant' | 'weight' | 'size' | 'contrast'>): Omit<
   BaseTextProps,
   'children'
 > &
@@ -67,16 +70,20 @@ const getProps = <T extends { variant: TextVariant }>({
   };
 
   if (variant === 'body') {
-    props.fontSize = 100;
-    props.fontStyle = 'normal';
-    props.lineHeight = 'l';
+    if (size === 'small') {
+      props.fontSize = 75;
+      props.lineHeight = 's';
+    }
   } else if (variant === 'caption') {
     if (weight === 'bold') {
       throw new Error(`[Blade: Text]: weight cannot be 'bold' when variant is 'caption'`);
     }
-    props.fontSize = 25;
-    props.fontStyle = 'italic';
+    if (size === 'small') {
+      throw new Error(`[Blade: Text]: size cannot be 'small' when variant is 'caption'`);
+    }
+    props.fontSize = 50;
     props.lineHeight = 's';
+    props.fontStyle = 'italic';
   }
 
   return props;
@@ -103,6 +110,7 @@ const StyledText = styled(BaseText)(({ truncateAfterLines }) => {
 const Text = <T extends { variant: TextVariant }>({
   variant = 'body',
   weight = 'regular',
+  size = 'medium',
   type = 'normal',
   contrast = 'low',
   truncateAfterLines,
@@ -110,7 +118,7 @@ const Text = <T extends { variant: TextVariant }>({
 }: TextProps<T>): ReactElement => {
   const props: Omit<BaseTextProps, 'children'> & TextForwardedAs = {
     truncateAfterLines,
-    ...getProps({ variant, type, weight, contrast }),
+    ...getProps({ variant, type, weight, size, contrast }),
   };
   return <StyledText {...props}>{children}</StyledText>;
 };
diff --git a/packages/blade/src/components/Typography/Text/__tests__/Text.native.test.tsx b/packages/blade/src/components/Typography/Text/__tests__/Text.native.test.tsx
index 9ead2ea08e4..2e9ff1b50d1 100644
--- a/packages/blade/src/components/Typography/Text/__tests__/Text.native.test.tsx
+++ b/packages/blade/src/components/Typography/Text/__tests__/Text.native.test.tsx
@@ -46,6 +46,35 @@ describe('<Text />', () => {
     expect(toJSON()).toMatchSnapshot();
   });
 
+  it('should render Text with variant "body" and size "small"', () => {
+    const displayText = 'Displaying some text';
+    const { toJSON, getByText } = renderWithTheme(
+      <Text type="normal" variant="body" weight="bold" truncateAfterLines={3} size="small">
+        {displayText}
+      </Text>,
+    );
+    expect(getByText('Displaying some text')).toBeTruthy();
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  it('should throw error when variant is "caption" and size "small" is passed', () => {
+    try {
+      const displayText = 'Displaying some text';
+      renderWithTheme(
+        // @ts-expect-error testing failure case when size='small' is passed with variant='caption'
+        <Text type="normal" variant="caption" truncateAfterLines={3} size="small">
+          {displayText}
+        </Text>,
+      );
+    } catch (error: unknown) {
+      if (error instanceof Error) {
+        expect(error.message).toEqual(
+          `[Blade: Text]: size cannot be 'small' when variant is 'caption'`,
+        );
+      }
+    }
+  });
+
   it('should throw error when variant is "caption" but weight "bold" is passed', () => {
     try {
       const displayText = 'Displaying some text';
diff --git a/packages/blade/src/components/Typography/Text/__tests__/Text.web.test.tsx b/packages/blade/src/components/Typography/Text/__tests__/Text.web.test.tsx
index c12f13b3b9c..517e64fe9f3 100644
--- a/packages/blade/src/components/Typography/Text/__tests__/Text.web.test.tsx
+++ b/packages/blade/src/components/Typography/Text/__tests__/Text.web.test.tsx
@@ -42,6 +42,34 @@ describe('<Text />', () => {
     expect(container).toMatchSnapshot();
   });
 
+  it('should render Text with variant "body" and size "small"', () => {
+    const displayText = 'Displaying some text';
+    const { container } = renderWithTheme(
+      <Text type="normal" variant="body" weight="bold" truncateAfterLines={3} size="small">
+        {displayText}
+      </Text>,
+    );
+    expect(container).toMatchSnapshot();
+  });
+
+  it('should throw error when variant is "caption" and size "small" is passed', () => {
+    try {
+      const displayText = 'Displaying some text';
+      renderWithTheme(
+        // @ts-expect-error testing failure case when size='small' is passed with variant='caption'
+        <Text type="normal" variant="caption" truncateAfterLines={3} size="small">
+          {displayText}
+        </Text>,
+      );
+    } catch (error: unknown) {
+      if (error instanceof Error) {
+        expect(error.message).toEqual(
+          `[Blade: Text]: size cannot be 'small' when variant is 'caption'`,
+        );
+      }
+    }
+  });
+
   it('should throw error when variant is "caption" but weight "bold" is passed', () => {
     try {
       const displayText = 'Displaying some text';
diff --git a/packages/blade/src/components/Typography/Text/__tests__/__snapshots__/Text.native.test.tsx.snap b/packages/blade/src/components/Typography/Text/__tests__/__snapshots__/Text.native.test.tsx.snap
index 22a49db355c..9fb7964905d 100644
--- a/packages/blade/src/components/Typography/Text/__tests__/__snapshots__/Text.native.test.tsx.snap
+++ b/packages/blade/src/components/Typography/Text/__tests__/__snapshots__/Text.native.test.tsx.snap
@@ -96,6 +96,39 @@ exports[`<Text /> should render Text with variant "body" and contrast "high" 1`]
 </Text>
 `;
 
+exports[`<Text /> should render Text with variant "body" and size "small" 1`] = `
+<Text
+  color="hsla(217, 56%, 17%, 1)"
+  fontFamily="Lato"
+  fontSize="12px"
+  fontStyle="normal"
+  fontWeight={700}
+  lineHeight="16px"
+  numberOfLines={3}
+  style={
+    Array [
+      Object {
+        "color": "hsla(217, 56%, 17%, 1)",
+        "fontFamily": "Lato",
+        "fontSize": 12,
+        "fontStyle": "normal",
+        "fontWeight": "700",
+        "lineHeight": 16,
+        "textAlign": "left",
+        "textDecorationLine": "none",
+      },
+      Object {
+        "numberOfLines": 3,
+      },
+    ]
+  }
+  textAlign="left"
+  textDecorationLine="none"
+>
+  Displaying some text
+</Text>
+`;
+
 exports[`<Text /> should render Text with variant "caption" 1`] = `
 <Text
   color="hsla(217, 56%, 17%, 1)"
diff --git a/packages/blade/src/components/Typography/Text/__tests__/__snapshots__/Text.web.test.tsx.snap b/packages/blade/src/components/Typography/Text/__tests__/__snapshots__/Text.web.test.tsx.snap
index ab3c3aaec7b..66b20f11b29 100644
--- a/packages/blade/src/components/Typography/Text/__tests__/__snapshots__/Text.web.test.tsx.snap
+++ b/packages/blade/src/components/Typography/Text/__tests__/__snapshots__/Text.web.test.tsx.snap
@@ -97,6 +97,41 @@ exports[`<Text /> should render Text with variant "body" and contrast "high" 1`]
 </div>
 `;
 
+exports[`<Text /> should render Text with variant "body" and size "small" 1`] = `
+.c0 {
+  color: hsla(217,56%,17%,1);
+  font-family: Lato,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
+  font-size: 0.75rem;
+  font-weight: 700;
+  font-style: normal;
+  -webkit-text-decoration-line: none;
+  text-decoration-line: none;
+  line-height: 1rem;
+  text-align: left;
+}
+
+.c1 {
+  overflow: hidden;
+  display: -webkit-box;
+  line-clamp: 3;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
+
+<div>
+  <p
+    class="c0 c1"
+    color="hsla(217, 56%, 17%, 1)"
+    font-family="Lato, -apple-system, BlinkMacSystemFont, \\"Segoe UI\\", Roboto, Helvetica, sans-serif, \\"Apple Color Emoji\\", \\"Segoe UI Emoji\\", \\"Segoe UI Symbol\\""
+    font-size="0.75rem"
+    font-style="normal"
+    font-weight="700"
+  >
+    Displaying some text
+  </p>
+</div>
+`;
+
 exports[`<Text /> should render Text with variant "caption" 1`] = `
 .c0 {
   color: hsla(217,56%,17%,1);
diff --git a/packages/blade/src/components/Typography/Title/__tests__/__snapshots__/Title.native.test.tsx.snap b/packages/blade/src/components/Typography/Title/__tests__/__snapshots__/Title.native.test.tsx.snap
index a102a571578..c2f1e7ef0f2 100644
--- a/packages/blade/src/components/Typography/Title/__tests__/__snapshots__/Title.native.test.tsx.snap
+++ b/packages/blade/src/components/Typography/Title/__tests__/__snapshots__/Title.native.test.tsx.snap
@@ -5,19 +5,19 @@ exports[`<Title /> should render Title with default properties 1`] = `
   accessibilityRole="header"
   color="hsla(217, 56%, 17%, 1)"
   fontFamily="Lato"
-  fontSize="24px"
+  fontSize="22px"
   fontStyle="normal"
   fontWeight={700}
-  lineHeight="30px"
+  lineHeight="32px"
   style={
     Array [
       Object {
         "color": "hsla(217, 56%, 17%, 1)",
         "fontFamily": "Lato",
-        "fontSize": 24,
+        "fontSize": 22,
         "fontStyle": "normal",
         "fontWeight": "700",
-        "lineHeight": 30,
+        "lineHeight": 32,
         "textAlign": "left",
         "textDecorationLine": "none",
       },
@@ -35,19 +35,19 @@ exports[`<Title /> should render Title with variant "large" 1`] = `
   accessibilityRole="header"
   color="hsla(217, 18%, 45%, 1)"
   fontFamily="Lato"
-  fontSize="35px"
+  fontSize="29px"
   fontStyle="normal"
   fontWeight={700}
-  lineHeight="38px"
+  lineHeight="40px"
   style={
     Array [
       Object {
         "color": "hsla(217, 18%, 45%, 1)",
         "fontFamily": "Lato",
-        "fontSize": 35,
+        "fontSize": 29,
         "fontStyle": "normal",
         "fontWeight": "700",
-        "lineHeight": 38,
+        "lineHeight": 40,
         "textAlign": "left",
         "textDecorationLine": "none",
       },
@@ -65,19 +65,19 @@ exports[`<Title /> should render Title with variant "medium" 1`] = `
   accessibilityRole="header"
   color="hsla(216, 16%, 60%, 1)"
   fontFamily="Lato"
-  fontSize="27px"
+  fontSize="24px"
   fontStyle="normal"
   fontWeight={700}
-  lineHeight="30px"
+  lineHeight="32px"
   style={
     Array [
       Object {
         "color": "hsla(216, 16%, 60%, 1)",
         "fontFamily": "Lato",
-        "fontSize": 27,
+        "fontSize": 24,
         "fontStyle": "normal",
         "fontWeight": "700",
-        "lineHeight": 30,
+        "lineHeight": 32,
         "textAlign": "left",
         "textDecorationLine": "none",
       },
@@ -95,19 +95,19 @@ exports[`<Title /> should render Title with variant "small" 1`] = `
   accessibilityRole="header"
   color="hsla(217, 56%, 17%, 1)"
   fontFamily="Lato"
-  fontSize="24px"
+  fontSize="22px"
   fontStyle="normal"
   fontWeight={700}
-  lineHeight="30px"
+  lineHeight="32px"
   style={
     Array [
       Object {
         "color": "hsla(217, 56%, 17%, 1)",
         "fontFamily": "Lato",
-        "fontSize": 24,
+        "fontSize": 22,
         "fontStyle": "normal",
         "fontWeight": "700",
-        "lineHeight": 30,
+        "lineHeight": 32,
         "textAlign": "left",
         "textDecorationLine": "none",
       },
@@ -125,19 +125,19 @@ exports[`<Title /> should render Title with variant "small" and contrast "high"
   accessibilityRole="header"
   color="hsla(0, 0%, 100%, 1)"
   fontFamily="Lato"
-  fontSize="24px"
+  fontSize="22px"
   fontStyle="normal"
   fontWeight={700}
-  lineHeight="30px"
+  lineHeight="32px"
   style={
     Array [
       Object {
         "color": "hsla(0, 0%, 100%, 1)",
         "fontFamily": "Lato",
-        "fontSize": 24,
+        "fontSize": 22,
         "fontStyle": "normal",
         "fontWeight": "700",
-        "lineHeight": 30,
+        "lineHeight": 32,
         "textAlign": "left",
         "textDecorationLine": "none",
       },
diff --git a/packages/blade/src/components/Typography/Title/__tests__/__snapshots__/Title.web.test.tsx.snap b/packages/blade/src/components/Typography/Title/__tests__/__snapshots__/Title.web.test.tsx.snap
index 44d312a9bae..588d7171865 100644
--- a/packages/blade/src/components/Typography/Title/__tests__/__snapshots__/Title.web.test.tsx.snap
+++ b/packages/blade/src/components/Typography/Title/__tests__/__snapshots__/Title.web.test.tsx.snap
@@ -9,7 +9,7 @@ exports[`<Title /> should render Title with default properties 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 2.375rem;
+  line-height: 2.5rem;
   text-align: left;
 }
 
@@ -63,7 +63,7 @@ exports[`<Title /> should render Title with variant "medium" 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 2.375rem;
+  line-height: 2.5rem;
   text-align: left;
 }
 
@@ -90,7 +90,7 @@ exports[`<Title /> should render Title with variant "small" 1`] = `
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 2.375rem;
+  line-height: 2.5rem;
   text-align: left;
 }
 
@@ -117,7 +117,7 @@ exports[`<Title /> should render Title with variant "small" and contrast "high"
   font-style: normal;
   -webkit-text-decoration-line: none;
   text-decoration-line: none;
-  line-height: 2.375rem;
+  line-height: 2.5rem;
   text-align: left;
 }
 
diff --git a/packages/blade/src/components/Typography/_decisions/decisions.md b/packages/blade/src/components/Typography/_decisions/decisions.md
index 5bb44aae2b3..a37def3f7c1 100644
--- a/packages/blade/src/components/Typography/_decisions/decisions.md
+++ b/packages/blade/src/components/Typography/_decisions/decisions.md
@@ -108,6 +108,7 @@ Another option would be having a `size` prop that would lead us to have a "large
   <Text
     variant=" medium | large | caption"
     weight="regular | bold"
+    size="small | medium"
     type="normal | subtle | subdued | muted | placeholder"
     contrast="low | high"
     truncateAfterLines={3}
diff --git a/packages/blade/src/tokens/global/typography.ts b/packages/blade/src/tokens/global/typography.ts
index af939e12b5c..f0ea02a59a5 100644
--- a/packages/blade/src/tokens/global/typography.ts
+++ b/packages/blade/src/tokens/global/typography.ts
@@ -6,6 +6,13 @@ type FontWeight = {
   bold: 700;
 };
 
+/**
+ * For font size and line-heights we can’t say from xl to 2xl the value will necessary increase.
+ * it might decrease or remain same because these are alias tokens and we need aliases for cross platform.
+ * so for example xl on mobile can be 32px and on desktop xl can be 34px,
+ * similarly 2xl on mobile can be 34px but on desktop doesn’t necessarily mean 2xl will be more than xl(34px) it can be 32 as well since visually they make better hierarchy.
+ */
+
 export type FontSize = {
   /** desktop: 9(px/rem/pt)
    *
@@ -19,12 +26,12 @@ export type FontSize = {
   25: number;
   /** desktop: 11(px/rem/pt)
    *
-   * mobile: 12(px/rem/pt)
+   * mobile: 11(px/rem/pt)
    */
   50: number;
   /** desktop: 12(px/rem/pt)
    *
-   * mobile: 14(px/rem/pt)
+   * mobile: 12(px/rem/pt)
    */
   75: number;
   /** desktop: 14(px/rem/pt)
@@ -54,27 +61,27 @@ export type FontSize = {
   500: number;
   /** desktop: 25(px/rem/pt)
    *
-   * mobile: 24(px/rem/pt)
+   * mobile: 22(px/rem/pt)
    */
   600: number;
   /** desktop: 28(px/rem/pt)
    *
-   * mobile: 27(px/rem/pt)
+   * mobile: 24(px/rem/pt)
    */
   700: number;
   /** desktop: 32(px/rem/pt)
    *
-   * mobile: 29(px/rem/pt)
+   * mobile: 28(px/rem/pt)
    */
   800: number;
   /** desktop: 36(px/rem/pt)
    *
-   * mobile: 32(px/rem/pt)
+   * mobile: 29(px/rem/pt)
    */
   900: number;
   /** desktop: 40(px/rem/pt)
    *
-   * mobile: 35(px/rem/pt)
+   * mobile: 29(px/rem/pt)
    */
   1000: number;
 };
@@ -96,9 +103,9 @@ export type Typography = {
      * mobile: 16(px/rem/pt)
      */
     s: number;
-    /** desktop: 18(px/rem/pt)
+    /** desktop: 16(px/rem/pt)
      *
-     * mobile: 16(px/rem/pt)
+     * mobile: 18(px/rem/pt)
      */
     m: number;
     /** desktop: 20(px/rem/pt)
@@ -108,12 +115,12 @@ export type Typography = {
     l: number;
     /** desktop: 24(px/rem/pt)
      *
-     * mobile: 24(px/rem/pt)
+     * mobile: 28(px/rem/pt)
      */
     xl: number;
     /** desktop: 24(px/rem/pt)
      *
-     * mobile: 28(px/rem/pt)
+     * mobile: 24(px/rem/pt)
      */
     '2xl': number;
     /** desktop: 28(px/rem/pt)
@@ -121,9 +128,9 @@ export type Typography = {
      * mobile: 28(px/rem/pt)
      */
     '3xl': number;
-    /** desktop: 38(px/rem/pt)
+    /** desktop: 40(px/rem/pt)
      *
-     * mobile: 30(px/rem/pt)
+     * mobile: 32(px/rem/pt)
      */
     '4xl': number;
     /** desktop: 42(px/rem/pt)
@@ -133,7 +140,7 @@ export type Typography = {
     '5xl': number;
     /** desktop: 60(px/rem/pt)
      *
-     * mobile: 38(px/rem/pt)
+     * mobile: 40(px/rem/pt)
      */
     '6xl': number;
   };
@@ -172,12 +179,12 @@ const typography: TypographyWithPlatforms = {
     },
     lineHeights: {
       s: 16,
-      m: 18,
+      m: 16,
       l: 20,
       xl: 24,
       '2xl': 24,
       '3xl': 28,
-      '4xl': 38,
+      '4xl': 40,
       '5xl': 42,
       '6xl': 60,
     },
@@ -191,18 +198,18 @@ const typography: TypographyWithPlatforms = {
       size: {
         10: 10,
         25: 11,
-        50: 12,
-        75: 14,
+        50: 11,
+        75: 12,
         100: 15,
         200: 17,
         300: 18,
         400: 20,
         500: 22,
-        600: 24,
-        700: 27,
-        800: 29,
-        900: 32,
-        1000: 35,
+        600: 22,
+        700: 24,
+        800: 28,
+        900: 29,
+        1000: 29,
       },
       weight: {
         ...fontWeight,
@@ -210,14 +217,14 @@ const typography: TypographyWithPlatforms = {
     },
     lineHeights: {
       s: 16,
-      m: 16,
+      m: 18,
       l: 24,
-      xl: 24,
-      '2xl': 28,
+      xl: 28,
+      '2xl': 24,
       '3xl': 28,
-      '4xl': 30,
+      '4xl': 32,
       '5xl': 30,
-      '6xl': 38,
+      '6xl': 40,
     },
     // letterSpacings: {},
   },
diff --git a/packages/blade/src/utils/makeTypographySize/makeTypographySize.native.test.ts b/packages/blade/src/utils/makeTypographySize/makeTypographySize.native.test.ts
index 32f43b2a44b..29399813ba9 100644
--- a/packages/blade/src/utils/makeTypographySize/makeTypographySize.native.test.ts
+++ b/packages/blade/src/utils/makeTypographySize/makeTypographySize.native.test.ts
@@ -9,6 +9,6 @@ describe('makeTypographySize', () => {
 
   it('should return the line-height value in `px`', () => {
     const lineHeight = makeTypographySize(typography.onMobile.lineHeights.m);
-    expect(lineHeight).toEqual('16px');
+    expect(lineHeight).toEqual('18px');
   });
 });
diff --git a/packages/blade/src/utils/makeTypographySize/makeTypographySize.web.test.ts b/packages/blade/src/utils/makeTypographySize/makeTypographySize.web.test.ts
index 4a1b290e346..478e4de59cd 100644
--- a/packages/blade/src/utils/makeTypographySize/makeTypographySize.web.test.ts
+++ b/packages/blade/src/utils/makeTypographySize/makeTypographySize.web.test.ts
@@ -9,6 +9,6 @@ describe('makeTypographySize', () => {
 
   it('should return the line-height value in `rem`', () => {
     const lineHeight = makeTypographySize(typography.onDesktop.lineHeights.m);
-    expect(lineHeight).toEqual('1.125rem');
+    expect(lineHeight).toEqual('1rem');
   });
 });