diff --git a/packages/ui-form-field/src/FormField/README.md b/packages/ui-form-field/src/FormField/README.md
index 04a165ed11..96ee70b224 100644
--- a/packages/ui-form-field/src/FormField/README.md
+++ b/packages/ui-form-field/src/FormField/README.md
@@ -9,7 +9,7 @@ components. In most cases it shouldn't be used directly.
 ---
 type: example
 ---
-<FormField id="foo" label="Opacity" width="200px">
-  <input style={{display: 'block', width: '100%'}}/>
+<FormField id="_foo123" label="Opacity" width="200px">
+  <input style={{display: 'block', width: '100%'}} id="_foo123"/>
 </FormField>
 ```
diff --git a/packages/ui-form-field/src/FormField/props.ts b/packages/ui-form-field/src/FormField/props.ts
index 6155d91264..7dd1ea137f 100644
--- a/packages/ui-form-field/src/FormField/props.ts
+++ b/packages/ui-form-field/src/FormField/props.ts
@@ -36,7 +36,8 @@ import type { FormMessage } from '../FormPropTypes'
 type FormFieldOwnProps = {
   label: React.ReactNode
   /**
-   * the id of the input (to link it to its label for a11y)
+   * the id of the input (to link it to its label for a11y).
+   * Applied as the `for` HTML prop on the label.
    */
   id: string
   /**