Custom Button

<div id="myUploader" class="mu-uploader">
 <div class="mu-select-btn" style="display:inline-flex; align-items:center; gap:8px;
 background:linear-gradient(135deg,#6366f1,#8b5cf6); padding:12px 24px;
 border-radius:12px; color:#fff; cursor:pointer; font-weight:600;">
 <svg width="20" height="20" ...>...</svg>
 Choose Your Files
 </div>
 <input type="file" class="mu-file-input" multiple style="display:none" />
 ...
</div>

// The mu-select-btn class automatically binds click to open file dialog
var uploader = new MultipleUpload(document.getElementById('myUploader'), {
 uploadUrl: '/api/upload'
});

Replacing the trigger

The browse button is markup with a class name, so it can be replaced with anything — your framework's button component, an icon, an entire card. The file input stays hidden and the click is forwarded to it, which is the standard way around the fact that file inputs cannot be styled.

Keep it a real button

Use a <button> element rather than a styled <div>. Keyboard focus, Enter and Space activation, and the screen-reader announcement all come free with the right element, and every one of them has to be rebuilt by hand with the wrong one.