JSFiddle - React, Tailwind, and code Playground

HTML

<div id="keyConfContainer">
    <div id="keyconfTittle">Modify a keycap</div>
    <div id="keycap">
        <div class="upload">
            <label for="my-input">Upload your image</label>
            <input type="file" id="my-input" name accept="image/*"="files[]" onchange="showMyImage(this)" />
        </div>
        <br/>
        <div id="bgcolor">
            <img id="thumbnil" style="width:100%; margin-top:10px;" src="" alt="" />
        </div>
    </div>
    <div id="keycapconf">
        <div id="options"></div>
        <div id="menu">Blackground-color:
            <input type="color" id="color" />
            <br>Clip art library:
            <!-- implementar la ventana con las imagenes-->
            <br>Upload your image:
            <form action="demo_form.asp">
                <input type="file" name="pic" accept="image/*" value="Upload a image">
                <input type="submit" value="Change">
        </div>
    </div>
</div>

CSS

.upload input {
    display: none;
}
.upload label {
    background: DarkSlateBlue;
    color: white;
    padding: 2px 10px;
}
#keyConfContainer {
    height: 300px;
    width: 487px;
    border: 1px solid #000;
}
#keyconfTittle {
    text-transform: uppercase;
    height: 25px;
    width: 487px;
}
#keycap {
    float: left;
    height: 243px;
    width: 243px;
    border: 1px solid #000;
}
#options {
    height: 25px;
    width: 242px;
    float: right;
}
#menu {
    float: right;
    height: 250px;
    width: 242px;
}
#keycapconf {
    float: right;
    height: 275px;
    width: 242px;
}
</style>

JavaScript

$(document).ready(function () {
    $("#color").change(function () {
        var clr = $(this).val();
        $("#bgcolor").css("background-color", clr);
    });
});

function showMyImage(fileInput) {
    var files = fileInput.files;
    for (var i = 0; i < files.length; i++) {
        var file = files[i];
        var imageType = /image.*/;
        if (!file.type.match(imageType)) {
            continue;
        }
        var img = document.getElementById("thumbnil");
        img.file = file;
        var reader = new FileReader();
        reader.onload = (function (aImg) {
            return function (e) {
                aImg.src = e.target.result;
            };
        })(img);
        reader.readAsDataURL(file);
    }
}