Изменить цвет текста заполнителя в выпадающем списке выбора - Material-ui

Question

У меня есть компонент выбора материала и пользовательского интерфейса, который предоставляет пользователю раскрывающийся список опций.Текст местозаполнителя отображается как «опция выбора», чтобы сообщить пользователю, какой вариант выбрать.Это показано светло-серым текстом, но из-за того, что цвет текста настолько светлый, дальтоникам может быть трудно читать.Из-за этого я хочу сделать текст темнее, но не знаю, как именно.Я не хочу делать заполнитель одним из вариантов в раскрывающемся списке, если это возможно.

Код для выбранного компонента:

<Select 
  options = {options}
  isMulti
  placeholder= "Select Options"
  value = {this.selectedOptions"
  onChange={this.changeH}
  className = SelectOptionsDropDown
/>

Стиль в файле .css:

.SelectOptionsDropDown {
  text-align: center;
  margin: 10px;
 }

Этот стиль полностью работает

Answer 1

Вы можете использовать ::placeholder, как показано ниже:

.SelectOptionsDropDown::placeholder{
    color: red;
  }

Обратите внимание, это не поддерживается в IE, отметьте здесь .