diff --git a/packages/ui/.storybook/global.css b/packages/ui/.storybook/global.css
index 2f17748c8..59cdd7a98 100644
--- a/packages/ui/.storybook/global.css
+++ b/packages/ui/.storybook/global.css
@@ -2,107 +2,108 @@
 @tailwind components;
 @tailwind utilities;
 
-/* BOM fonts */
-@font-face {
-  src: url('/fonts/lineto-brown-pro-light.woff2') format('woff2'),
-    url('/fonts/lineto-brown-pro-light.woff') format('woff');
-  font-family: 'Brown Pro';
-  font-weight: 300;
-  font-style: normal;
-}
-@font-face {
-  src: url('/fonts/lineto-brown-pro-regular.woff2') format('woff2'),
-    url('/fonts/lineto-brown-pro-regular.woff') format('woff');
-  font-family: 'Brown Pro';
-  font-weight: 400;
-  font-style: normal;
-}
-@font-face {
-  src: url('/fonts/lineto-brown-pro-bold.woff2') format('woff2'),
-    url('/fonts/lineto-brown-pro-bold.woff') format('woff');
-  font-family: 'Brown Pro';
-  font-weight: 700;
-  font-style: normal;
-}
+@layer base {
+  /* BOM fonts */
+  @font-face {
+    src: url('/fonts/lineto-brown-pro-light.woff2') format('woff2'),
+      url('/fonts/lineto-brown-pro-light.woff') format('woff');
+    font-family: 'Brown Pro';
+    font-weight: 300;
+    font-style: normal;
+  }
+  @font-face {
+    src: url('/fonts/lineto-brown-pro-regular.woff2') format('woff2'),
+      url('/fonts/lineto-brown-pro-regular.woff') format('woff');
+    font-family: 'Brown Pro';
+    font-weight: 400;
+    font-style: normal;
+  }
+  @font-face {
+    src: url('/fonts/lineto-brown-pro-bold.woff2') format('woff2'),
+      url('/fonts/lineto-brown-pro-bold.woff') format('woff');
+    font-family: 'Brown Pro';
+    font-weight: 700;
+    font-style: normal;
+  }
 
-/* BSA fonts */
-@font-face {
-  src: url('/fonts/Aller_Lt.woff2') format('woff2'), url('/fonts/Aller_Lt.woff') format('woff');
-  font-family: 'Aller';
-  font-weight: 300;
-  font-style: normal;
-}
-@font-face {
-  src: url('/fonts/Aller_Bd.woff2') format('woff2'), url('/fonts/Aller_Bd.woff') format('woff');
-  font-family: 'Aller';
-  font-weight: 700;
-  font-style: normal;
-}
-
-/* RAMS fonts */
-@font-face {
-  src: url('/fonts/source-sans-pro-v14-latin-regular.woff2') format('woff2'),
-    url('/fonts/source-sans-pro-v14-latin-regular.woff') format('woff');
-  font-family: 'Source Sans Pro';
-  font-weight: normal;
-  font-style: normal;
-}
-@font-face {
-  src: url('/fonts/source-sans-pro-v14-latin-600.woff2') format('woff2'),
-    url('/fonts/source-sans-pro-v14-latin-600.woff') format('woff');
-  font-family: 'Source Sans Pro';
-  font-weight: 600;
-  font-style: normal;
-}
-@font-face {
-  src: url('/fonts/source-sans-pro-v14-latin-700.woff2') format('woff2'),
-    url('/fonts/source-sans-pro-v14-latin-700.woff') format('woff');
-  font-family: 'Source Sans Pro';
-  font-weight: 700;
-  font-style: normal;
-}
+  /* BSA fonts */
+  @font-face {
+    src: url('/fonts/Aller_Lt.woff2') format('woff2'), url('/fonts/Aller_Lt.woff') format('woff');
+    font-family: 'Aller';
+    font-weight: 300;
+    font-style: normal;
+  }
+  @font-face {
+    src: url('/fonts/Aller_Bd.woff2') format('woff2'), url('/fonts/Aller_Bd.woff') format('woff');
+    font-family: 'Aller';
+    font-weight: 700;
+    font-style: normal;
+  }
 
-/* STG fonts */
-@font-face {
-  src: url('/fonts/dragonbold-bold-webfont.woff2') format('woff2'),
-    url('/fonts/dragonbold-bold-webfont.woff') format('woff');
-  font-family: 'Dragon Bold';
-  font-weight: 400;
-  font-style: normal;
-}
+  /* RAMS fonts */
+  @font-face {
+    src: url('/fonts/source-sans-pro-v14-latin-regular.woff2') format('woff2'),
+      url('/fonts/source-sans-pro-v14-latin-regular.woff') format('woff');
+    font-family: 'Source Sans Pro';
+    font-weight: normal;
+    font-style: normal;
+  }
+  @font-face {
+    src: url('/fonts/source-sans-pro-v14-latin-600.woff2') format('woff2'),
+      url('/fonts/source-sans-pro-v14-latin-600.woff') format('woff');
+    font-family: 'Source Sans Pro';
+    font-weight: 600;
+    font-style: normal;
+  }
+  @font-face {
+    src: url('/fonts/source-sans-pro-v14-latin-700.woff2') format('woff2'),
+      url('/fonts/source-sans-pro-v14-latin-700.woff') format('woff');
+    font-family: 'Source Sans Pro';
+    font-weight: 700;
+    font-style: normal;
+  }
 
-/* WBC fonts */
-@font-face {
-  src: url('/fonts/Westpac-Bold-v2.007.woff2') format('woff2'), url('/fonts/Westpac-Bold-v2.007.woff') format('woff');
-  font-family: 'Westpac';
-  font-weight: 400;
-  font-style: normal;
-}
+  /* STG fonts */
+  @font-face {
+    src: url('/fonts/dragonbold-bold-webfont.woff2') format('woff2'),
+      url('/fonts/dragonbold-bold-webfont.woff') format('woff');
+    font-family: 'Dragon Bold';
+    font-weight: 400;
+    font-style: normal;
+  }
 
-/* WBG fonts */
-@font-face {
-  src: url('/fonts/montserrat-v14-latin-300.woff2') format('woff2'),
-    url('/fonts/montserrat-v14-latin-300.woff') format('woff');
-  font-family: 'Montserrat';
-  font-weight: 300;
-  font-style: normal;
-}
-@font-face {
-  src: url('/fonts/montserrat-v14-latin-regular.woff2') format('woff2'),
-    url('/fonts/montserrat-v14-latin-regular.woff') format('woff');
-  font-family: 'Montserrat';
-  font-weight: 400;
-  font-style: normal;
-}
-@font-face {
-  src: url('/fonts/montserrat-v14-latin-700.woff2') format('woff2'),
-    url('/fonts/montserrat-v14-latin-700.woff') format('woff');
-  font-family: 'Montserrat';
-  font-weight: 700;
-  font-style: normal;
-}
+  /* WBC fonts */
+  @font-face {
+    src: url('/fonts/Westpac-Bold-v2.007.woff2') format('woff2'), url('/fonts/Westpac-Bold-v2.007.woff') format('woff');
+    font-family: 'Westpac';
+    font-weight: 400;
+    font-style: normal;
+  }
 
+  /* WBG fonts */
+  @font-face {
+    src: url('/fonts/montserrat-v14-latin-300.woff2') format('woff2'),
+      url('/fonts/montserrat-v14-latin-300.woff') format('woff');
+    font-family: 'Montserrat';
+    font-weight: 300;
+    font-style: normal;
+  }
+  @font-face {
+    src: url('/fonts/montserrat-v14-latin-regular.woff2') format('woff2'),
+      url('/fonts/montserrat-v14-latin-regular.woff') format('woff');
+    font-family: 'Montserrat';
+    font-weight: 400;
+    font-style: normal;
+  }
+  @font-face {
+    src: url('/fonts/montserrat-v14-latin-700.woff2') format('woff2'),
+      url('/fonts/montserrat-v14-latin-700.woff') format('woff');
+    font-family: 'Montserrat';
+    font-weight: 700;
+    font-style: normal;
+  }
 
-body {
-  @apply typography-body-10;
+  body {
+    @apply typography-body-11;
+  }
 }
diff --git a/packages/ui/src/components/error-message/error-message.styles.ts b/packages/ui/src/components/error-message/error-message.styles.ts
index 2e0f5e28c..84946e97c 100644
--- a/packages/ui/src/components/error-message/error-message.styles.ts
+++ b/packages/ui/src/components/error-message/error-message.styles.ts
@@ -2,8 +2,9 @@ import { tv } from 'tailwind-variants';
 
 export const styles = tv({
   slots: {
-    base: 'typography-body-10 flex items-center text-danger',
+    base: 'typography-body-11 flex items-center text-danger',
     list: 'mb-2 flex flex-col gap-1',
-    icon: 'mr-[0.5rem] mt-[mr-0.25rem] align-top',
+    // below should be em rather than rem based on old GEL
+    icon: 'mr-[0.5em] align-top',
   },
 });
diff --git a/packages/ui/src/components/form-hint/form-hint.styles.ts b/packages/ui/src/components/form-hint/form-hint.styles.ts
index 8b8100350..5bf07200f 100644
--- a/packages/ui/src/components/form-hint/form-hint.styles.ts
+++ b/packages/ui/src/components/form-hint/form-hint.styles.ts
@@ -2,7 +2,7 @@ import { tv } from 'tailwind-variants';
 
 export const styles = tv(
   {
-    base: 'typography-body-10 mb-2 text-muted',
+    base: 'typography-body-11 mb-2 text-muted',
     variants: {
       spacing: {
         medium: '-mt-1 mb-2',
diff --git a/packages/ui/src/components/form-label/form-label.styles.ts b/packages/ui/src/components/form-label/form-label.styles.ts
index 906bd1be5..1271c6ee0 100644
--- a/packages/ui/src/components/form-label/form-label.styles.ts
+++ b/packages/ui/src/components/form-label/form-label.styles.ts
@@ -2,7 +2,7 @@ import { tv } from 'tailwind-variants';
 
 export const styles = tv(
   {
-    base: 'typography-body-9 block font-medium',
+    base: 'typography-body-9 leading-loose block font-medium',
     variants: {
       spacing: {
         medium: '',
diff --git a/packages/ui/src/components/form/form.component.tsx b/packages/ui/src/components/form/form.component.tsx
index fca05f742..7387ddc71 100644
--- a/packages/ui/src/components/form/form.component.tsx
+++ b/packages/ui/src/components/form/form.component.tsx
@@ -14,9 +14,9 @@ const FormContext = createContext<FormContextValue | null>(null);
 
 export const useFormContext = () => useContext(FormContext) || {};
 
-export function Form({ children, size = 'medium', spacing = 'medium', inline = false, ...props }: FormProps) {
+export function Form({ children, spacing = 'medium', inline = false, ...props }: FormProps) {
   return (
-    <FormContext.Provider value={{ inline, size, spacing }}>
+    <FormContext.Provider value={{ inline, spacing }}>
       <form {...props}>{children}</form>
     </FormContext.Provider>
   );
diff --git a/packages/ui/src/components/form/form.stories.tsx b/packages/ui/src/components/form/form.stories.tsx
index 36732cc86..2c3163a40 100644
--- a/packages/ui/src/components/form/form.stories.tsx
+++ b/packages/ui/src/components/form/form.stories.tsx
@@ -59,10 +59,11 @@ export const Default: Story = {
         <hr />
 
         <h2 className="typography-body-7 my-4 font-bold">Large size with large spacing</h2>
-        <Form size="large" spacing="large">
+        <Form spacing="large">
           <Form.Section>
             <Form.ChitChat>
-              Hello, I’m the friendly conversational text component. I live at the top of the form pod if required.
+              Spacing increases space after label, hint and form group. Sizing can be changed via props on the component
+              that needs to be bigger i.e. input.
             </Form.ChitChat>
           </Form.Section>
 
@@ -71,14 +72,14 @@ export const Default: Story = {
               <Form.Label htmlFor="example-large-1">This is a label</Form.Label>
               <Form.Hint>This is a hint</Form.Hint>
               <Form.ErrorMessage message="This is an error message" />
-              <Input name="example-large-1" />
+              <Input name="example-large-1" size="large" />
             </Form.Group>
 
             <Form.Group>
               <Form.Label htmlFor="example-large-2">This is a label</Form.Label>
               <Form.Hint>This is a hint</Form.Hint>
               <Form.ErrorMessage message="This is an error message" />
-              <Input name="example-large-2" />
+              <Input name="example-large-2" size="large" />
             </Form.Group>
           </Form.Section>
 
@@ -87,7 +88,7 @@ export const Default: Story = {
               <Form.Label htmlFor="example-large-3">This is a label</Form.Label>
               <Form.Hint>This is a hint</Form.Hint>
               <Form.ErrorMessage message="This is an error message" />
-              <Input name="example-large-3" />
+              <Input name="example-large-3" size="large" />
             </Form.Group>
           </Form.Section>
         </Form>
@@ -116,27 +117,25 @@ export const MultipleErrors: Story = {
 /**
  * > All sizes Story
  */
-export const AllSizes: Story = {
+export const Size: Story = {
   args: {},
   render: () => {
     return (
       <div className="flex flex-col gap-3">
-        {(['small', 'medium'] as const).map(size => (
-          <Form size={size}>
-            <h3>Form with size: {size}</h3>
-            <Form.Label>This is a label</Form.Label>
-            <Form.Hint>This is a hint</Form.Hint>
-            <Form.ErrorMessage message="This is an error message" />
-            <Input />
-          </Form>
-        ))}
+        <Form>
+          <h3>Sizing is currently handled on the child level. See example of size prop on Input component in code.</h3>
+          <Form.Label>This is a label</Form.Label>
+          <Form.Hint>This is a hint</Form.Hint>
+          <Form.ErrorMessage message="This is an error message" />
+          <Input size="large" />
+        </Form>
       </div>
     );
   },
 };
 
 /**
- * > All spacings Story
+ * > All spacings Story. Increases space between label, hint and form groups
  */
 export const AllSpacings: Story = {
   args: {},
@@ -145,7 +144,7 @@ export const AllSpacings: Story = {
       <div className="flex flex-col gap-3">
         {(['medium', 'large'] as const).map(size => (
           <Form spacing={size}>
-            <h3>Form with Spacing:{size}</h3>
+            <h3>Form with Spacing:{size}. Sets spacing between label, hint and form groups.</h3>
             <Form.Label>This is a label</Form.Label>
             <Form.Hint>This is a hint</Form.Hint>
             <Form.ErrorMessage message="This is an error message" />
diff --git a/packages/ui/src/components/form/form.types.ts b/packages/ui/src/components/form/form.types.ts
index 5d8aea236..956035e26 100644
--- a/packages/ui/src/components/form/form.types.ts
+++ b/packages/ui/src/components/form/form.types.ts
@@ -5,10 +5,6 @@ export type FormContextValue = {
    * Whether form is inline
    */
   inline?: boolean;
-  /**
-   * Size of Form
-   */
-  size?: 'small' | 'medium' | 'large';
   /**
    * Spacing of Form
    */
diff --git a/packages/ui/src/css/global.css b/packages/ui/src/css/global.css
index cba1b297d..6f73ea04a 100644
--- a/packages/ui/src/css/global.css
+++ b/packages/ui/src/css/global.css
@@ -2,6 +2,8 @@
 @tailwind components;
 @tailwind utilities;
 
-body {
-  @apply typography-body-10;
+@layer base {
+  body {
+    @apply typography-body-11;
+  }
 }
diff --git a/packages/ui/src/stories/foundation/typography.stories.tsx b/packages/ui/src/stories/foundation/typography.stories.tsx
index 3fb9b6f79..4f907db5a 100644
--- a/packages/ui/src/stories/foundation/typography.stories.tsx
+++ b/packages/ui/src/stories/foundation/typography.stories.tsx
@@ -1,6 +1,6 @@
 import { type Meta, StoryFn } from '@storybook/react';
 
-import { Table } from '../../components/index.js';
+import { Link, Table } from '../../components/index.js';
 
 const meta: Meta = {
   title: 'Foundation/Typography',
@@ -91,3 +91,59 @@ export const BodyFont = () => {
     </Table>
   );
 };
+
+/**
+ * Line height
+ */
+export const LineHeight = () => {
+  const lineHeights = [
+    { className: 'leading-normal', lineHeight: '1.4' },
+    { className: 'leading-tight', lineHeight: '1.2' },
+    { className: 'leading-loose', lineHeight: '1.428571429' },
+  ];
+  return (
+    <div>
+      <p className="mb-2">
+        The pre-Next version of GEL had a fall-back line height of 1.428571429 for things inside the body, the reasoning
+        for this can be found{' '}
+        <Link
+          href="https://stackoverflow.com/questions/19982651/why-does-bootstrap-set-the-line-height-property-to-1-428571429"
+          type="inline"
+        >
+          here
+        </Link>
+        . A typography type has been added and the leading style in tailwind (with 14px font) has been extended to
+        include this value for use to match the older version of GEL. The default tailwind values for normal and tight
+        have also been updated and included in the table.
+      </p>
+      <Table>
+        <Table.Caption>GEL 'loose' line-height</Table.Caption>
+        <Table.Header>
+          <Table.HeaderRow>
+            <Table.HeaderCell>Token</Table.HeaderCell>
+            <Table.HeaderCell>Value</Table.HeaderCell>
+            <Table.HeaderCell>Tailwind class</Table.HeaderCell>
+          </Table.HeaderRow>
+        </Table.Header>
+        <Table.Body>
+          <Table.Row key="typography-11">
+            <Table.Cell>
+              <span className="typography-body-11">body-11</span>
+            </Table.Cell>
+            <Table.Cell>fontSize: 0.875rem (14px); lineHeight: 1.428571429</Table.Cell>
+            <Table.Cell>typography-body-11</Table.Cell>
+          </Table.Row>
+          {lineHeights.map(i => (
+            <Table.Row key={i.className}>
+              <Table.Cell>
+                <span className={i.className}>{i.className.replace('leading-', '')}</span>
+              </Table.Cell>
+              <Table.Cell>lineHeight: {i.lineHeight}</Table.Cell>
+              <Table.Cell>{i.className}</Table.Cell>
+            </Table.Row>
+          ))}
+        </Table.Body>
+      </Table>
+    </div>
+  );
+};
diff --git a/packages/ui/src/tailwind/__mocks__/utils.constants.ts b/packages/ui/src/tailwind/__mocks__/utils.constants.ts
index a412aa55e..099de7490 100644
--- a/packages/ui/src/tailwind/__mocks__/utils.constants.ts
+++ b/packages/ui/src/tailwind/__mocks__/utils.constants.ts
@@ -40,6 +40,7 @@ export const EXPECTED_SPACING = {
 export const EXPECTED_FONT_SIZES_VARS = {
   'body-1': '3.75rem',
   'body-10': '0.875rem',
+  'body-11': '0.875rem',
   'body-2': '3.375rem',
   'body-3': '3rem',
   'body-4': '2.625rem',
@@ -50,6 +51,7 @@ export const EXPECTED_FONT_SIZES_VARS = {
   'body-9': '1rem',
   'brand-1': '3.75rem',
   'brand-10': '0.875rem',
+  'brand-11': '0.875rem',
   'brand-2': '3.375rem',
   'brand-3': '3rem',
   'brand-4': '2.625rem',
diff --git a/packages/ui/src/tailwind/constants/typography.ts b/packages/ui/src/tailwind/constants/typography.ts
index d3a6f2f5a..3ac29abb0 100644
--- a/packages/ui/src/tailwind/constants/typography.ts
+++ b/packages/ui/src/tailwind/constants/typography.ts
@@ -53,4 +53,8 @@ export const FONT_SIZES = {
     fontSize: '0.875rem',
     lineHeight: 'normal',
   },
+  11: {
+    fontSize: '0.875rem',
+    lineHeight: 'loose',
+  },
 };
diff --git a/packages/ui/src/tailwind/tailwind-plugin.ts b/packages/ui/src/tailwind/tailwind-plugin.ts
index 50c3f79fe..ae606dcc7 100644
--- a/packages/ui/src/tailwind/tailwind-plugin.ts
+++ b/packages/ui/src/tailwind/tailwind-plugin.ts
@@ -48,6 +48,8 @@ export const WestpacUIKitBasePlugin = plugin(
         lineHeight: {
           tight: '1.2',
           normal: '1.4',
+          // See https://stackoverflow.com/questions/19982651/why-does-bootstrap-set-the-line-height-property-to-1-428571429 for below line height reasoning
+          loose: '1.428571429',
         },
         borderWidth: {
           5: '0.3125rem',
@@ -125,6 +127,10 @@ export const WestpacUIKitBasePlugin = plugin(
           fontSize: '0.875rem',
           lineHeight: 'normal',
         },
+        11: {
+          fontSize: '0.875rem',
+          lineHeight: 'loose',
+        },
       },
       formControl: {
         base: 'no-inner-spin-button box-border w-fit appearance-none overflow-visible rounded border bg-white align-middle text-text transition placeholder:font-light placeholder:text-text-50 placeholder:opacity-100 focus:focus-outline disabled:form-control-disabled',