Edit in JSFiddle

<span>* Before </span>
<input type="date" class="before">
<span>~</span>
<input type="date" class="before">
<br><br>
<span>* After </span>
<input type="date" class="after">
<span>~</span>
<input type="date" class="after">
<!-- https://stackoverflow.com/questions/65409348/html-input-date-how-to-decrease-space-between-date-and-icon -->

input[type="date"] {
  width:50px;
}
input[type="date"]::before {
  display:none;
}
input[type="date"].after::-webkit-calendar-picker-indicator{
    margin-left: 0px;
}