JSFiddle - React, Tailwind, and code Playground

HTML

<input type="file" class="custom-file-inpu" />

CSS

.custom-file-input::-webkit-file-upload-button {
  visibility: hidden;
}
.custom-file-input::before {
  content: 'UPLOAD';
  display: inline-block;
  background: -webkit-linear-gradient(top, black, red);
  border: 1px solid #999;
  border-radius: 3px;
  padding: 5px;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  font-size: 10pt;
 color:#fff;
}
.custom-file-input:hover::before {
  border-color: #fff;
}
.custom-file-input:active::before {
color:#666;
  background: -webkit-linear-gradient(top, bclack, red);
}