MDInput

The MDInput helps you to create different form elements. It uses MUI InputBase in base and you can use all of the props from MUI InputBasefor the MDInput component.


The below codes are editable and you can modify them the way you want directly from your browser, please use the green button or the ctrl + s to save the changes.

Demo

// NextJS Material Dashboard 2 components import MDInput from "/components/MDInput";

Props Information

NameTypeDefaultDescription
errorboolfalseChange the MDInput border color to red, its useful when displaying the error messages.
successboolfalseChange the MDInput border color to green, its useful when displaying the success messages.
HTML5 AttributesYou can also use HTML5 input attributes for the MDInput.
MUI PropsYou can pass all of the MUI InputBase props for the MDInput as well.

Styles

// NextJS Material Dashboard 2 components import MDInput from "/components/MDInput";

Success/Error

// NextJS Material Dashboard 2 components import MDInput from "/components/MDInput";

Sizes

// NextJS Material Dashboard 2 components import MDInput from "/components/MDInput";

Textarea

// NextJS Material Dashboard 2 components import MDInput from "/components/MDInput";

HTML5 Inputs

// NextJS Material Dashboard 2 components import MDInput from "/components/MDInput";