diff --git a/docs/data/toolpad/studio/components/text-field/TextFieldIsRequired.js b/docs/data/toolpad/studio/components/text-field/TextFieldIsRequired.js
new file mode 100644
index 00000000000..81020443d26
--- /dev/null
+++ b/docs/data/toolpad/studio/components/text-field/TextFieldIsRequired.js
@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { TextField } from '@toolpad/studio-components';
+
+export default function TextFieldIsRequired() {
+  return (
+    <TextField
+      label="Name"
+      size="small"
+      placeholder="Enter name"
+      isRequired
+      sx={{ width: 280 }}
+    />
+  );
+}
diff --git a/docs/data/toolpad/studio/components/text-field/TextFieldMaxLength.js b/docs/data/toolpad/studio/components/text-field/TextFieldMaxLength.js
new file mode 100644
index 00000000000..9e42266bb39
--- /dev/null
+++ b/docs/data/toolpad/studio/components/text-field/TextFieldMaxLength.js
@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { TextField } from '@toolpad/studio-components';
+
+export default function TextFieldMaxLength() {
+  return (
+    <TextField
+      label="Zip code"
+      size="small"
+      maxLength="6"
+      placeholder="Enter zip code"
+      sx={{ width: 280 }}
+    />
+  );
+}
diff --git a/docs/data/toolpad/studio/components/text-field/TextFieldMinLength.js b/docs/data/toolpad/studio/components/text-field/TextFieldMinLength.js
new file mode 100644
index 00000000000..cff2e9f2b7a
--- /dev/null
+++ b/docs/data/toolpad/studio/components/text-field/TextFieldMinLength.js
@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { TextField } from '@toolpad/studio-components';
+
+export default function TextFieldMinLength() {
+  return (
+    <TextField
+      label="Password"
+      size="small"
+      minLength="6"
+      placeholder="Enter password"
+      password
+      isRequired
+      sx={{ width: 280 }}
+    />
+  );
+}
diff --git a/docs/data/toolpad/studio/components/text-field/text-field.md b/docs/data/toolpad/studio/components/text-field/text-field.md
index 91bbb8b3312..f77fdd9b699 100644
--- a/docs/data/toolpad/studio/components/text-field/text-field.md
+++ b/docs/data/toolpad/studio/components/text-field/text-field.md
@@ -69,17 +69,29 @@ Disabled property shows the state of the component so that end user is aware tha
 
 ## Validation
 
+The validation props offer the option to create an interactive text field component for various scenarios. These are available as a checkbox configurations in the Toolpad Studio editor.
+
 ### isRequired
 
-isRequired is useful when the action can't be perfomed without a user provided text value.
+The `isRequired` prop is useful to display an error message when a value is not provided. It can be used for mandatory fields.
+
+{{"demo": "TextFieldIsRequired.js", "hideToolbar": true}}
 
 ### minLength
 
-A validation check on the minimum length of the input.
+Shows an error message according to the minimum required length for the provided text value. It can be used to ensure that a provided password is long enough, for example.
+
+In the demo below, the input must be more than 6 characters long, otherwise a validation error is shown.
+
+{{"demo": "TextFieldMinLength.js", "hideToolbar": true}}
 
 ### maxLength
 
-A validation check on the maximum length of the input.
+Shows an error message according to the maximum required length for the provided text value. In combination with other props, it can be used to enforce the length of zip codes or phone numbers, for example.
+
+In the demo below, the input must be no more than 6 characters long, otherwise a validation error is shown.
+
+{{"demo": "TextFieldMaxLength.js", "hideToolbar": true}}
 
 ## API