diff --git a/src/components/InputField/InputField.module.css b/src/components/InputField/InputField.module.css
index 91a8536bc..baec7d3d9 100644
--- a/src/components/InputField/InputField.module.css
+++ b/src/components/InputField/InputField.module.css
@@ -33,6 +33,9 @@
   color: var(--eds-theme-color-text-neutral-subtle);
   font: var(--eds-theme-typography-body-sm);
 }
+.input-field__required-text--disabled {
+  color: var(--eds-theme-color-text-disabled);
+}
 
 .input-field--has-fieldNote {
   margin-bottom: var(--eds-size-half);
diff --git a/src/components/InputField/InputField.tsx b/src/components/InputField/InputField.tsx
index b5ec736a0..583b50ee7 100644
--- a/src/components/InputField/InputField.tsx
+++ b/src/components/InputField/InputField.tsx
@@ -165,6 +165,11 @@ export const InputField: InputFieldType = forwardRef(
       disabled && styles['input-field__label--disabled'],
     );
 
+    const requiredTextClassName = clsx(
+      styles['input-field__required-text'],
+      disabled && styles['input-field__required-text--disabled'],
+    );
+
     const inputBodyClassName = clsx(
       styles['input-field__body'],
       fieldNote && styles['input-field--has-fieldNote'],
@@ -188,11 +193,7 @@ export const InputField: InputFieldType = forwardRef(
               </InputLabel>
             )}
             {required && (
-              <Text
-                as="span"
-                className={styles['input-field__required-text']}
-                size="sm"
-              >
+              <Text as="span" className={requiredTextClassName} size="sm">
                 Required
               </Text>
             )}
diff --git a/src/components/InputField/__snapshots__/InputField.test.ts.snap b/src/components/InputField/__snapshots__/InputField.test.ts.snap
index 8be624b05..2ce0e80b9 100644
--- a/src/components/InputField/__snapshots__/InputField.test.ts.snap
+++ b/src/components/InputField/__snapshots__/InputField.test.ts.snap
@@ -1339,7 +1339,7 @@ exports[`<InputField /> RequiredVariants story renders snapshot 1`] = `
           Label text
         </label>
         <span
-          class="text text--sm input-field__required-text"
+          class="text text--sm input-field__required-text input-field__required-text--disabled"
         >
           Required
         </span>
@@ -1376,7 +1376,7 @@ exports[`<InputField /> RequiredVariants story renders snapshot 1`] = `
           Label text
         </label>
         <span
-          class="text text--sm input-field__required-text"
+          class="text text--sm input-field__required-text input-field__required-text--disabled"
         >
           Required
         </span>
diff --git a/src/components/TextArea/TextArea.module.css b/src/components/TextArea/TextArea.module.css
deleted file mode 100644
index b0ff86f45..000000000
--- a/src/components/TextArea/TextArea.module.css
+++ /dev/null
@@ -1,16 +0,0 @@
-@import '../../design-tokens/mixins.css';
-
-/*------------------------------------*\
-    # TEXTAREA 
-\*------------------------------------*/
-
-/**
- * Default input styles 
- */
-.textarea {
-  @mixin inputStyles;
-}
-
-.textarea--disabled:focus {
-  outline: none;
-}
diff --git a/src/components/TextArea/TextArea.tsx b/src/components/TextArea/TextArea.tsx
deleted file mode 100644
index 5106c18bf..000000000
--- a/src/components/TextArea/TextArea.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import clsx from 'clsx';
-import React, { forwardRef } from 'react';
-import styles from './TextArea.module.css';
-
-export interface Props
-  extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
-  /**
-   * CSS class names that can be appended to the component
-   */
-  className?: string;
-  /**
-   * Text default contents of the field
-   */
-  children?: string;
-  /**
-   * Whether the disabled stat is active
-   */
-  disabled?: boolean;
-  /**
-   * Whether the error state is active
-   */
-  isError?: boolean;
-}
-
-/**
- * Base component, applying styles to a <textarea> tag
- */
-export const TextArea = forwardRef<HTMLTextAreaElement, Props>(
-  (
-    {
-      className,
-      children,
-      disabled,
-      defaultValue = '',
-      isError = false,
-      ...other
-    },
-    ref,
-  ) => {
-    const componentClassName = clsx(
-      styles['textarea'],
-      isError && styles['error'],
-      disabled && styles['textarea--disabled'],
-      className,
-    );
-
-    return (
-      <textarea
-        className={componentClassName}
-        defaultValue={children || defaultValue}
-        ref={ref}
-        {...other}
-      ></textarea>
-    );
-  },
-);
diff --git a/src/components/TextArea/index.ts b/src/components/TextArea/index.ts
deleted file mode 100644
index 5b73816df..000000000
--- a/src/components/TextArea/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { TextArea as default } from './TextArea';
diff --git a/src/components/TextareaField/TextareaField.module.css b/src/components/TextareaField/TextareaField.module.css
index ded6d3f7f..be35910ed 100644
--- a/src/components/TextareaField/TextareaField.module.css
+++ b/src/components/TextareaField/TextareaField.module.css
@@ -4,6 +4,17 @@
     # TEXTAREA FIELD
 \*------------------------------------*/
 
+/**
+ * Default input styles 
+ */
+.textarea {
+  @mixin inputStyles;
+}
+
+.textarea--disabled:focus {
+  outline: none;
+}
+
 /**
  * Wraps the Label and the optional/required indicator.
  */
@@ -11,14 +22,25 @@
   display: flex;
   justify-content: space-between;
   margin-bottom: var(--eds-size-half);
-  color: var(--eds-theme-color-form-label);
 }
 
 .textarea-field__overline--no-label {
   justify-content: flex-end;
 }
 
-.textarea-field__overline--disabled {
+.textarea-field__label {
+  color: var(--eds-theme-color-form-label);
+  font: var(--eds-theme-typography-form-label);
+}
+.textarea-field__label--disabled {
+  color: var(--eds-theme-color-text-disabled);
+}
+
+.textarea-field__required-text {
+  color: var(--eds-theme-color-text-neutral-subtle);
+  font: var(--eds-theme-typography-body-sm);
+}
+.textarea-field__required-text--disabled {
   color: var(--eds-theme-color-text-disabled);
 }
 
diff --git a/src/components/TextareaField/TextareaField.tsx b/src/components/TextareaField/TextareaField.tsx
index ef880acd8..16a61a703 100644
--- a/src/components/TextareaField/TextareaField.tsx
+++ b/src/components/TextareaField/TextareaField.tsx
@@ -7,12 +7,11 @@ import type {
   ForwardedRefComponent,
 } from '../../util/utility-types';
 import FieldNote from '../FieldNote';
-import Label from '../Label';
+import InputLabel from '../InputLabel';
 import Text from '../Text';
-import TextArea from '../TextArea';
 import styles from './TextareaField.module.css';
 
-export type Props = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
+type TextareaFieldProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
   /**
    * Text content of the field upon instantiation
    */
@@ -52,10 +51,66 @@ export type Props = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
     }
   >;
 
-type TextareaFieldType = ForwardedRefComponent<HTMLTextAreaElement, Props> & {
+type TextareaFieldType = ForwardedRefComponent<
+  HTMLTextAreaElement,
+  TextareaFieldProps
+> & {
   TextArea?: typeof TextArea;
+  Label?: typeof InputLabel;
 };
 
+type TextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
+  /**
+   * CSS class names that can be appended to the component
+   */
+  className?: string;
+  /**
+   * Text default contents of the field
+   */
+  children?: string;
+  /**
+   * Whether the disabled stat is active
+   */
+  disabled?: boolean;
+  /**
+   * Whether the error state is active
+   */
+  isError?: boolean;
+};
+
+/**
+ * Base component, applying styles to a <textarea> tag
+ */
+const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(
+  (
+    {
+      className,
+      children,
+      disabled,
+      defaultValue = '',
+      isError = false,
+      ...other
+    },
+    ref,
+  ) => {
+    const componentClassName = clsx(
+      styles['textarea'],
+      isError && styles['error'],
+      disabled && styles['textarea--disabled'],
+      className,
+    );
+
+    return (
+      <textarea
+        className={componentClassName}
+        defaultValue={children || defaultValue}
+        ref={ref}
+        {...other}
+      ></textarea>
+    );
+  },
+);
+
 /**
  * `import {TextareaField} from "@chanzuckerberg/eds";`
  *
@@ -106,6 +161,15 @@ export const TextareaField: TextareaFieldType = forwardRef(
       !label && styles['textarea-field__overline--no-label'],
       disabled && styles['textarea-field__overline--disabled'],
     );
+    const labelClassName = clsx(
+      styles['textarea-field__label'],
+      disabled && styles['textarea-field__label--disabled'],
+    );
+
+    const requiredTextClassName = clsx(
+      styles['textarea-field__required-text'],
+      disabled && styles['textarea-field__required-text--disabled'],
+    );
     const fieldLengthCountClassName = clsx(
       textExceedsLength && styles['textarea-field--invalid-length'],
     );
@@ -114,9 +178,13 @@ export const TextareaField: TextareaFieldType = forwardRef(
       <div className={componentClassName}>
         {shouldRenderOverline && (
           <div className={overlineClassName}>
-            {label && <Label htmlFor={idVar} text={label} />}
+            {label && (
+              <InputLabel className={labelClassName} htmlFor={idVar}>
+                {label}
+              </InputLabel>
+            )}
             {required && (
-              <Text as="p" size="sm">
+              <Text as="p" className={requiredTextClassName} size="sm">
                 Required
               </Text>
             )}
@@ -168,3 +236,4 @@ export const TextareaField: TextareaFieldType = forwardRef(
 
 TextareaField.displayName = 'TextareaField';
 TextareaField.TextArea = TextArea;
+TextareaField.Label = InputLabel;
diff --git a/src/components/TextareaField/__snapshots__/TextareaField.test.tsx.snap b/src/components/TextareaField/__snapshots__/TextareaField.test.tsx.snap
index 62e9adf3b..c4261a47b 100644
--- a/src/components/TextareaField/__snapshots__/TextareaField.test.tsx.snap
+++ b/src/components/TextareaField/__snapshots__/TextareaField.test.tsx.snap
@@ -8,11 +8,10 @@ exports[`<TextareaField /> Default story renders snapshot 1`] = `
     class="textarea-field__overline"
   >
     <label
-      class="label"
+      class="label label--lg textarea-field__label"
       for=":r0:"
     >
       Textarea Field
-       
     </label>
   </div>
   <textarea
@@ -49,11 +48,10 @@ exports[`<TextareaField /> UsingChildren story renders snapshot 1`] = `
     class="textarea-field__overline"
   >
     <label
-      class="label"
+      class="label label--lg textarea-field__label"
       for=":r2:"
     >
       Textarea Field
-       
     </label>
   </div>
   <textarea
@@ -89,11 +87,10 @@ exports[`<TextareaField /> WhenDisabled story renders snapshot 1`] = `
     class="textarea-field__overline textarea-field__overline--disabled"
   >
     <label
-      class="label"
+      class="label label--lg textarea-field__label textarea-field__label--disabled"
       for=":r6:"
     >
       Textarea Field
-       
     </label>
   </div>
   <textarea
@@ -131,11 +128,10 @@ exports[`<TextareaField /> WhenError story renders snapshot 1`] = `
     class="textarea-field__overline"
   >
     <label
-      class="label"
+      class="label label--lg textarea-field__label"
       for=":r8:"
     >
       Textarea Field
-       
     </label>
   </div>
   <textarea
@@ -188,11 +184,10 @@ exports[`<TextareaField /> WhenInvalid story renders snapshot 1`] = `
     class="textarea-field__overline"
   >
     <label
-      class="label"
+      class="label label--lg textarea-field__label"
       for=":ra:"
     >
       Textarea Field
-       
     </label>
   </div>
   <textarea
@@ -258,14 +253,13 @@ exports[`<TextareaField /> WhenRequired story renders snapshot 1`] = `
     class="textarea-field__overline"
   >
     <label
-      class="label"
+      class="label label--lg textarea-field__label"
       for=":rc:"
     >
       Textarea Field
-       
     </label>
     <p
-      class="text text--sm"
+      class="text text--sm textarea-field__required-text"
     >
       Required
     </p>
@@ -304,11 +298,10 @@ exports[`<TextareaField /> WithADifferentSize story renders snapshot 1`] = `
     class="textarea-field__overline"
   >
     <label
-      class="label"
+      class="label label--lg textarea-field__label"
       for=":re:"
     >
       Textarea Field
-       
     </label>
   </div>
   <textarea
@@ -344,14 +337,13 @@ exports[`<TextareaField /> WithAMaxLength story renders snapshot 1`] = `
     class="textarea-field__overline"
   >
     <label
-      class="label"
+      class="label label--lg textarea-field__label"
       for=":rg:"
     >
       Textarea Field
-       
     </label>
     <p
-      class="text text--sm"
+      class="text text--sm textarea-field__required-text"
     >
       Required
     </p>
@@ -420,11 +412,10 @@ exports[`<TextareaField /> WithNoDefaultValue story renders snapshot 1`] = `
     class="textarea-field__overline"
   >
     <label
-      class="label"
+      class="label label--lg textarea-field__label"
       for=":r4:"
     >
       Textarea Field
-       
     </label>
   </div>
   <textarea