diff --git a/src/base-field/base-field.tsx b/src/base-field/base-field.tsx
index 737135577..fdab785fa 100644
--- a/src/base-field/base-field.tsx
+++ b/src/base-field/base-field.tsx
@@ -190,6 +190,13 @@ type BaseFieldProps = WithEnhancedClassName &
*/
maxWidth?: BoxProps['maxWidth']
+ /**
+ * The maximum number of characters that the input field can accept.
+ * When this limit is reached, the input field will not accept any more characters.
+ * The counter element will turn red when the number of characters is within 10 of the maximum limit.
+ */
+ maxLength?: number
+
/**
* Used internally by components composed using `BaseField`. It is not exposed as part of
* the public props of such components.
diff --git a/src/text-field/text-field.stories.mdx b/src/text-field/text-field.stories.mdx
index d2fcef945..498939447 100644
--- a/src/text-field/text-field.stories.mdx
+++ b/src/text-field/text-field.stories.mdx
@@ -324,3 +324,25 @@ Hence, the description is never needed when the field is not focused anyway.
+
+## Max length
+
+The `maxLength` prop is used to limit the number of characters that the user can input. When the user tries to input more characters than the maximum allowed, the field won't accept the input.
+
+export function WithMaxLengthExample() {
+ const [value, setValue] = React.useState('Doist')
+ return (
+ setValue(event.currentTarget.value)}
+ />
+ )
+}
+
+
diff --git a/src/text-field/text-field.tsx b/src/text-field/text-field.tsx
index 7ddf583b2..4071c76d8 100644
--- a/src/text-field/text-field.tsx
+++ b/src/text-field/text-field.tsx
@@ -13,6 +13,12 @@ interface TextFieldProps
type?: TextFieldType
startSlot?: React.ReactElement | string | number
endSlot?: React.ReactElement | string | number
+ /**
+ * The maximum number of characters that the input field can accept.
+ * When this limit is reached, the input field will not accept any more characters.
+ * The counter element will turn red when the number of characters is within 10 of the maximum limit.
+ */
+ maxLength?: number
}
const TextField = React.forwardRef(function TextField(