The perfect inset box shadow input field for my project.

just_another_input_inset.css

input {
    background: #fff;
    color: #525865;
    border-radius: 4px;
    border: 1px solid #d1d1d1;
    box-shadow: inset 1px 2px 8px rgba( 0, 0, 0, 0.07);
    font-family: inherit;
    font-size: 1em;
    line-height: 1.45;
    outline: none;
    padding: 0.6em 1.45em 0.75em;
    -webkit-transition: .18s ease-out;
    -moz-transition: .18s ease-out;
    -o-transition: .18s ease-out;
    transition: .18s ease-out;
}

input:hover {
    box-shadow: inset 1px 2px 8px rgba( 0, 0, 0, 0.02);
}

input:focus {
    color: #4b515d;
    border: 1px solid #B8B6B6;
    box-shadow: none;
}