diff --git a/packages/apollo-wind/src/components/ui/quick-form-field/quick-form-field.divergence.test.tsx b/packages/apollo-wind/src/components/ui/quick-form-field/quick-form-field.divergence.test.tsx
index 49cc0e577..28ddadf8f 100644
--- a/packages/apollo-wind/src/components/ui/quick-form-field/quick-form-field.divergence.test.tsx
+++ b/packages/apollo-wind/src/components/ui/quick-form-field/quick-form-field.divergence.test.tsx
@@ -246,6 +246,28 @@ describe('QuickFormField — divergences from apollo-wind', () => {
       expect(container.querySelector('[role="group"]')).toHaveAttribute('data-layout', 'grow');
     });
 
+    // jsdom has no layout: a row is 20px and the content height is mocked.
+    it('starts one line tall and grows with its content', () => {
+      const { rerender } = render(
+        <QuickFormField locked={false} fieldType="textarea" value="" onValueChange={vi.fn()} />
+      );
+      const textarea = screen.getByPlaceholderText('Text area value') as HTMLTextAreaElement;
+      expect(textarea).toHaveAttribute('rows', '1');
+      expect(textarea.style.minHeight).toBe('20px');
+
+      vi.spyOn(HTMLElement.prototype, 'scrollHeight', 'get').mockReturnValue(60);
+      rerender(
+        <QuickFormField
+          locked={false}
+          fieldType="textarea"
+          value={'a\nb\nc'}
+          onValueChange={vi.fn()}
+        />
+      );
+      expect(textarea.style.height).toBe('60px');
+      vi.restoreAllMocks();
+    });
+
     it('keeps an expression on the one-line input', () => {
       const { container } = render(
         <QuickFormField
diff --git a/packages/apollo-wind/src/components/ui/quick-form-field/quick-form-field.tsx b/packages/apollo-wind/src/components/ui/quick-form-field/quick-form-field.tsx
index d308a959c..a7cbc757e 100644
--- a/packages/apollo-wind/src/components/ui/quick-form-field/quick-form-field.tsx
+++ b/packages/apollo-wind/src/components/ui/quick-form-field/quick-form-field.tsx
@@ -362,8 +362,14 @@ export function QuickFormField({
         onBlur={onValueBlur}
       />
     ) : fieldType === 'textarea' ? (
-      // Grows with its content up to the ceiling, then scrolls.
-      <InputGroupTextarea {...textInputProps} minRows={3} maxRows={8} />
+      // Starts one line tall like a text field, then grows with its content up to 8 rows.
+      <InputGroupTextarea
+        {...textInputProps}
+        rows={1}
+        minRows={1}
+        maxRows={8}
+        className="py-[3px] future:py-0.5"
+      />
     ) : (
       <InputGroupInput
         {...textInputProps}