基于如何通过FormLabel的主题覆盖（也将包括InputLabel）自定义组件的文档，您应该使用createMuiTheme并添加以下覆盖：

const formLabelsTheme = createMuiTheme({
  overrides: {
    MuiFormLabel: {
      asterisk: {
        color: '#db3131',
        '&$error': {
          color: '#db3131'
        },
      }
    }
  }
})

然后，将<form> Package 在<MuiThemeProvider>中，如下所示：

<MuiThemeProvider theme={formLabelsTheme}>
  <form noValidate autoComplete="off">

...
...
...

  </form>
</MuiThemeProvider>

下面是一个forked code sandbox，它演示了这段代码的实际操作。
因为你已经创建了一个主题，你可以把你的覆盖放在那个主题中，但是你需要把你的<form>移动到你已经在代码中的<MuiThemeProvider>中。
生成的表单标签如下所示：

在Mui v5中：

const theme = createTheme({

  components: {
    MuiFormLabel: {
      styleOverrides: {
        asterisk: {color:"red"},
      },
    },
  },

})

根据最新版本的材质UI。即"@mui/material": "^5.0.1"
我们可以这样做：

<FormLabel required>Name:</FormLabel>

在主题中：

import { createTheme } from "@mui/material";

export const theme = createTheme({
  components: {
    MuiFormLabel: {
      styleOverrides: {
        asterisk: {
          color: "#db3131",
          "&$error": {
            color: "#db3131",
          },
        },
      },
    },
  },
});

Alvin的回答展示了如何在您的主题中全局地做到这一点。您也可以通过InputLabel props使用FormLabel asterisk类逐个实现这一点。
下面是我更改的代码中的相关部分。还要注意，星号的默认行为是，如果输入处于“错误”状态，星号将显示为红色。例如，如果您将error属性添加到TextField，星号将为红色，但这对星号之外的样式也有其他影响。

const styles = {
  labelAsterisk: {
    color: "red"
  }
};

<InputLabel
                    FormLabelClasses={{
                      asterisk: this.props.classes.labelAsterisk
                    }}
                    required
                    shrink
                    htmlFor="age-native-simple"
                  >
                    Age
                  </InputLabel>

<TextField
                    required
                    InputLabelProps={{
                      shrink: true,
                      FormLabelClasses: {
                        asterisk: this.props.classes.labelAsterisk
                      }
                    }}
                    id="standard-name"
                    label="Name"
                    margin="normal"
                    helperText="Some important text"
                  />

const StyledApp = withStyles(styles)(App);

//在顶部导入createTheme和ThemeProvider
import { createTheme，ThemeProvider } from '@mui/material/styles';
const abc =（）=〉{

//add the theme at the top of your arrow function

const theme = createTheme({

    components: {
        MuiFormLabel: {
            styleOverrides: {
                asterisk: { color: "red" },
            },
        },
    },

})
return ( // wrap your jsx with <ThemeProvider>

    <ThemeProvider theme={theme}>

        <TextField required
            id="outlined-required"
            label="Full Name"
            type="text"
            size='small'
        />

    </ThemeProvider>

)

}

对于那些正在寻找答案的MUI v5与文本字段概述的变种

const theme = createTheme({
   components:{
     MuiInputLabel:{
          styleOverrides:{
              asterisk:{
                 color:"#d32f2f"
              }
          }
       }
    }
});

我用下面的方式改变了直接使用CSS类属性选项

.MuiFormLabel-asterisk {
    color: red;
}

试试这个简单易行的

render(){
    const name = <p>Name<span style={{ color: "red" } >*</span></p>
    const email = <p>Email<span style={{ color: "red" } >*</span></p>
    // ...
    return (
        <div>
            <TextField type="text" label={name} />//or Input tag
            <TextField type="email" label={email} />//or Input tag
            // ...
        </div>
    )
}