JSFiddle - React, Tailwind, and code Playground

by inser

HTML

<div>
    <input type="text" /><span class="color"></span>
</div>

CSS

input {
    border: 1px solid #7bc1f7;    
    outline: none;
    padding: 3px 8px 3px 3px;
    width: 30px;
    box-shadow: inset -5px 0 0 #7bc1f7;
    border-radius: 2px;
    font-size: 0.7em;
}

JavaScript

$(function() {
    $('input').change(function() {
        $(this).css('box-shadow', 'inset -5px 0 0 #' + $(this).val());
    });
});