TCMF
0
I have one <input type='date' class='form-control'> date input for a form. Because I am using form-control from bootstrap 5, the date picker is set as the default white color, the same as the form.
I have searched for multiple ways to change the date picker's color but still nothing.
Code snippet: https://codepen.io/TCMF/pen/YzLrBYE
Try setting the CSS using the id or class selector.
#date {
background-color: #abcdef;
}<link href="https://bootswatch.com/5/cyborg/bootstrap.min.css" rel="stylesheet">
<div class="container form-group col-7">
<label for>Date: </label>
<input type="date" class="form-control" id="date" required name="date" >
</div>::-webkit-calendar-picker-indicator {
filter: invert(1);
}<link href="https://bootswatch.com/5/cyborg/bootstrap.min.css" rel="stylesheet">
<div class="container form-group col-7">
<label for>Date: </label>
<input type="date" class="form-control" id="date" required name="date" >
</div>