diff --git a/packages/components/src/components/Checkbox/Checkbox.module.scss b/packages/components/src/components/Checkbox/Checkbox.module.scss
index 6822ed374b..0df22cddd2 100644
--- a/packages/components/src/components/Checkbox/Checkbox.module.scss
+++ b/packages/components/src/components/Checkbox/Checkbox.module.scss
@@ -1,6 +1,9 @@
 @use "@/styles/mixins/focus";
+@use "@/styles/mixins/formControl";
 
 .checkbox {
+  @include formControl.formHiddenInputScrollBehaviorFix;
+
   .input {
     display: flex;
     flex-direction: row;
diff --git a/packages/components/src/components/CheckboxButton/CheckboxButton.module.scss b/packages/components/src/components/CheckboxButton/CheckboxButton.module.scss
index 7b96ce8fbf..e4bd2cd7c4 100644
--- a/packages/components/src/components/CheckboxButton/CheckboxButton.module.scss
+++ b/packages/components/src/components/CheckboxButton/CheckboxButton.module.scss
@@ -1,6 +1,8 @@
-@use "../../styles/mixins/formControl";
+@use "@/styles/mixins/formControl";
 
 .checkboxButton {
+  @include formControl.formHiddenInputScrollBehaviorFix;
+
   align-self: normal;
   width: fit-content;
 
diff --git a/packages/components/src/components/FileField/FileField.module.scss b/packages/components/src/components/FileField/FileField.module.scss
new file mode 100644
index 0000000000..a782fe7f31
--- /dev/null
+++ b/packages/components/src/components/FileField/FileField.module.scss
@@ -0,0 +1,5 @@
+@use "@/styles/mixins/formControl";
+
+.FileField {
+  @include formControl.formHiddenInputScrollBehaviorFix;
+}
diff --git a/packages/components/src/components/FileField/FileField.tsx b/packages/components/src/components/FileField/FileField.tsx
index 26382e4fb7..d6aff767e4 100644
--- a/packages/components/src/components/FileField/FileField.tsx
+++ b/packages/components/src/components/FileField/FileField.tsx
@@ -11,6 +11,8 @@ import { PropsContextProvider } from "@/lib/propsContext";
 import { useObjectRef } from "@react-aria/utils";
 import { addAwaitedArrayBuffer } from "@mittwald/flow-core";
 import { useFieldComponent } from "@/lib/hooks/useFieldComponent";
+import styles from "./FileField.module.scss";
+import clsx from "clsx";
 
 export interface FileFieldProps
   extends
@@ -73,7 +75,10 @@ export const FileField = flowComponent("FileField", (props) => {
   };
 
   return (
-    <div {...fieldProps}>
+    <div
+      {...fieldProps}
+      className={clsx(fieldProps.className, styles.FileField)}
+    >
       <FieldErrorContext.Provider value={formValidationState.displayValidation}>
         <FieldErrorCaptureContext>
           <PropsContextProvider props={fieldPropsContext}>
diff --git a/packages/components/src/components/FileField/components/FileInput.module.scss b/packages/components/src/components/FileField/components/FileInput.module.scss
index 15327c0aea..f848afd1e6 100644
--- a/packages/components/src/components/FileField/components/FileInput.module.scss
+++ b/packages/components/src/components/FileField/components/FileInput.module.scss
@@ -1,11 +1,3 @@
-.FileInput {
-  opacity: 0;
-  height: 0;
-  width: 0;
-  position: absolute;
-  pointer-events: none;
-}
-
 .trigger {
   order: 2;
 }
diff --git a/packages/components/src/components/FileField/components/FileInput.tsx b/packages/components/src/components/FileField/components/FileInput.tsx
index a434fd01d1..911d1d78a5 100644
--- a/packages/components/src/components/FileField/components/FileInput.tsx
+++ b/packages/components/src/components/FileField/components/FileInput.tsx
@@ -5,6 +5,7 @@ import { useObjectRef } from "@react-aria/utils";
 import type { PropsContext } from "@/lib/propsContext";
 import { PropsContextProvider } from "@/lib/propsContext";
 import styles from "./FileInput.module.scss";
+import { useVisuallyHidden } from "react-aria";
 
 export type FileInputOnChangeHandler = (files: FileList | null) => void;
 
@@ -21,6 +22,7 @@ export const FileInput: FC<FileInputProps> = (props) => {
   const { children, isDisabled, onChange, isReadOnly, ref, ...restInputProps } =
     props;
   const inputRef = useObjectRef(ref);
+  const { visuallyHiddenProps } = useVisuallyHidden();
 
   const handlePress = () => {
     if (inputRef.current?.value) {
@@ -48,7 +50,7 @@ export const FileInput: FC<FileInputProps> = (props) => {
       {children}
       <Aria.Input
         {...restInputProps}
-        className={styles.FileInput}
+        {...visuallyHiddenProps}
         type="file"
         ref={inputRef}
         onChange={handleChange}
diff --git a/packages/components/src/components/Switch/Switch.module.scss b/packages/components/src/components/Switch/Switch.module.scss
index 9aa567190e..d45d4f704b 100644
--- a/packages/components/src/components/Switch/Switch.module.scss
+++ b/packages/components/src/components/Switch/Switch.module.scss
@@ -1,6 +1,9 @@
 @use "@/styles/mixins/focus";
+@use "@/styles/mixins/formControl";
 
 .switch {
+  @include formControl.formHiddenInputScrollBehaviorFix;
+
   display: flex;
   align-items: center;
   column-gap: var(--switch--label-to-track-spacing);
diff --git a/packages/components/src/components/TextArea/TextArea.tsx b/packages/components/src/components/TextArea/TextArea.tsx
index 6448c737a0..83177890e8 100644
--- a/packages/components/src/components/TextArea/TextArea.tsx
+++ b/packages/components/src/components/TextArea/TextArea.tsx
@@ -45,6 +45,7 @@ export const TextArea = flowComponent("TextArea", (props) => {
     showCharacterCount,
     className,
     onChange,
+    isReadOnly,
     ...rest
   } = useControlledHostValueProps(props);
 
@@ -79,6 +80,10 @@ export const TextArea = flowComponent("TextArea", (props) => {
   );
 
   const handleChange = (v: string) => {
+    if (isReadOnly) {
+      return;
+    }
+
     if (showCharacterCount) {
       setCharactersCount(v.length);
     }
@@ -165,12 +170,15 @@ export const TextArea = flowComponent("TextArea", (props) => {
         <FieldErrorCaptureContext>{children}</FieldErrorCaptureContext>
         <Aria.TextArea
           rows={rows}
+          {...(isReadOnly ? { "data-readonly": true } : {})}
+          aria-readonly={isReadOnly}
           aria-hidden={props["aria-hidden"]}
           placeholder={placeholder}
           className={inputClassName}
           ref={localRef}
           onChange={updateHeight}
           style={{
+            caretColor: isReadOnly ? "transparent" : undefined,
             minHeight: getHeight(rows),
             maxHeight: verticallyResizable
               ? undefined
diff --git a/packages/components/src/styles/mixins/formControl.scss b/packages/components/src/styles/mixins/formControl.scss
index 11bca181ca..91b47185c1 100644
--- a/packages/components/src/styles/mixins/formControl.scss
+++ b/packages/components/src/styles/mixins/formControl.scss
@@ -7,6 +7,12 @@
   @include formInteractionStates;
 }
 
+@mixin formHiddenInputScrollBehaviorFix {
+  // required for correct scroll behavior
+  // see https://react-aria.adobe.com/VisuallyHidden
+  position: relative;
+}
+
 @mixin formBorder {
   border-width: var(--form-control--border-width);
   border-style: var(--form-control--border-style);