1

I'm trying to change TextField placeholder style, I followed another answer and I came up with this as follows:

import "./styles.css";
import TextField from "@mui/material/TextField";

export default function App() {
  return (
    <div className="App">
      <TextField
        inputProps={{
          placeholder: "Placeholder",
          style: {
            color: "blue",
            fontWeight: "bold"
          }
        }}
      />
    </div>
  );
}

So I'm able to change placeholder's color, but my problem is that whatever I do, it still looks like if the color was missing some alpha (as you can see in this sandbox example).

I tried setting it with rgba full opacity, but no success.

I know its atypical for placeholder to have full opacity, but I really would like to style it by myself.

tmarwen
  • 14,219
  • 4
  • 40
  • 59
Mitchy
  • 33
  • 4

0 Answers0