MUI V5 Textfield - Change border color?

Question

using Material UI V5 and i can't change the border color of my TextField with the sx prop.

Changing the color of the label and input works fine, but not with border color.

<TextField
        sx={{ 
          input: { color: 'white' } ,
          label: {color: 'white'},
          borderColor: 'white',
          border: {color: 'white'},
        }}

Any ideas?

Answer 1

The TextField is a weird one, the border is actually defined on the fieldset element. The following should style that.

<TextField 
  sx={{
    fieldset: { borderColor: "red" }
  }}

Here is a screen capture of the TextField HTML to help show the fieldset element I'm talking about.