JSFiddle - React, Tailwind, and code Playground

HTML

<input placeholder=" "> <input placeholder=" " value="zzz">

CSS

input {
    border: 0;
    box-shadow: 0 0 0 2px blue;
    background: -webkit-linear-gradient(top, #fff, #ccc);    
    background: -moz-linear-gradient(top, #fff, #ccc);
    background: -o-linear-gradient(top, #fff, #ccc);    
    background: linear-gradient(to bottom, #fff, #ccc);
    padding: 0;
    line-height: 1.8;
    border-radius: 3px;
    text-indent: 3px;
}

:-moz-any-link, input {
    margin: 0 5px 0 0;
    padding: .25em 0;
}

:-moz-placeholder {
    box-shadow: 0 0 0 2px red;
    background: -webkit-linear-gradient(top, #ff8, #cc0);    
    background: -moz-linear-gradient(top, #ff8, #cc0);
    background: -o-linear-gradient(top, #ff8, #cc0);    
    background: linear-gradient(to bottom, #ff8, #cc0);
}


::-webkit-input-placeholder {
    box-shadow: 0 0 0 2px red;    
    background: -webkit-linear-gradient(top, #ff8, #cc0);    
    background: -moz-linear-gradient(top, #ff8, #cc0);
    background: -o-linear-gradient(top, #ff8, #cc0);    
    background: linear-gradient(to bottom, #ff8, #cc0);
    border-radius: 3px;
    position: relative;
}