Answers for "how to add icon in input field material ui"

3

material ui textfield with icon button

// imports
import IconButton from "@material-ui/core/IconButton";
import InputAdornment from "@material-ui/core/InputAdornment";
import SearchIcon from "@material-ui/icons/Search";

// render

<TextField
  label="With normal TextField"
  InputProps={{
    endAdornment: (
      <InputAdornment>
        <IconButton>
          <SearchIcon />
        </IconButton>
      </InputAdornment>
    )
  }}
/>
Posted by: Guest on October-15-2020
2

material ui outlined input with icon

endAdornment = {
        <InputAdornment position="start">
          <AccountCircle />
        </InputAdornment>
}
// Or there can be a start Adornment, depending on your requirement
startAdornment = {
        <InputAdornment position="start">
          <AccountCircle />
        </InputAdornment>
}
// Dont forget to import the required MUI modules and icons from the pack
Posted by: Guest on May-27-2021

Code answers related to "how to add icon in input field material ui"

Browse Popular Code Answers by Language