Change color of the calendar icon in Semantic ui react input

Question

I'm using semantic ui react for my date input. I need to change the calendar icon color of the input. Is it possible ? here is my code

<Input
  id="fromDate"
  name="fromDate"
  type="date"
  value={state.fromDate}
  onChange={onHandleChange}
  placeholder="Date"
  className="custom-date-input"
 />

Answer 1

I am not sure if there is a better way to do it with other specific colors, but you can use filters on it. You just have to select it with CSS .custom-date-input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(); } like this. Also, here is a link of codesandbox where I implemented it, there I tried to get the color you have in the placeholder with filters. So take a look at it, and I hope it helps you.