Form Control

The Form Control component is a utility that lets you associate a form input with auxiliary components, such as labels, error indicators, or helper text.

FormControl API

Import

import { FormControl } from '@mui/base/FormControl';
// or
import { FormControl } from '@mui/base';

Learn about the difference by reading this guide on minimizing bundle size.

Props

Props of the native component are also available.

children

className

disabled

error

onChange

required

slotProps

slots

value

The ref is forwarded to the root element.

CSS

.null-root

.Mui-disabledSTATE

.Mui-errorSTATE

.null-filled

.Mui-focusedSTATE

.Mui-requiredSTATE

You can override the style of the component using one of these customization options:

With a global class name.
With a rule name as part of the component's styleOverrides property in a custom theme.