diff --git a/src/components/forms/TextField.tsx b/src/components/forms/TextField.tsx
index 62f30db47..bdface401 100644
--- a/src/components/forms/TextField.tsx
+++ b/src/components/forms/TextField.tsx
@@ -1,4 +1,4 @@
-import {createContext, useContext, useMemo, useRef} from 'react'
+import React, {createContext, useContext, useMemo, useRef} from 'react'
 import {
   type AccessibilityProps,
   StyleSheet,
@@ -11,6 +11,7 @@ import {
 
 import {HITSLOP_20} from '#/lib/constants'
 import {mergeRefs} from '#/lib/merge-refs'
+import {isWeb} from '#/platform/detection'
 import {
   android,
   applyFonts,
@@ -83,6 +84,20 @@ export function Root({children, isInvalid = false, style}: RootProps) {
     ],
   )
 
+  // Check if any child has multiline prop
+  const hasMultiline = useMemo(() => {
+    let found = false
+    React.Children.forEach(children, child => {
+      if (
+        React.isValidElement(child) &&
+        (child.props as {multiline?: boolean})?.multiline
+      ) {
+        found = true
+      }
+    })
+    return found
+  }, [children])
+
   return (
     <Context.Provider value={context}>
       <View
@@ -91,7 +106,7 @@ export function Root({children, isInvalid = false, style}: RootProps) {
           a.align_center,
           a.relative,
           a.w_full,
-          a.px_md,
+          !(hasMultiline && isWeb) && a.px_md,
           style,
         ]}
         {...web({
@@ -222,6 +237,13 @@ export function createInput(Component: typeof TextInput) {
         marginTop: 2,
         marginBottom: 2,
       }),
+      rest.multiline &&
+        web({
+          resize: 'vertical',
+          fieldSizing: 'content',
+          paddingLeft: 16,
+          paddingRight: 16,
+        }),
       style,
     ])
 
diff --git a/src/style.css b/src/style.css
index d0d5f32d6..b5f493a6b 100644
--- a/src/style.css
+++ b/src/style.css
@@ -389,7 +389,3 @@ input[type='range'][orient='vertical']::-moz-range-thumb {
     opacity: 0;
   }
 }
-
-textarea {
-  resize: vertical !important;
-}