index.html

<div class="custom-button-container">
    <button class="custom-convert-button" id="custom-convertButton" disabled>Convert to JPG</button>
    <a id="custom-downloadButton" class="custom-download-button" style="display: none;">Download JPG</a>
</div>
<div id="custom-output"></div>
<div class="custom-upload-container">
    <div class="custom-preview-container" id="custom-previewContainer"></div>
    <div class="custom-upload-area" id="custom-uploadfile">
        <img src="https://prepphint.com/wp-content/uploads/2024/06/upload-icon.webp" alt="Upload Icon" class="custom-upload-icon" id="custom-uploadIcon">
        <p id="upload-text">Drag & Drop to upload Files or</p>
        <button class="custom-browse-button">Browse Files</button>
        <input type="file" id="custom-pngInput" accept="image/png" multiple>
    </div>
    <div class="spinner-overlay" id="spinner-overlay">
        <div class="spinner" id="spinner"></div>
    </div>
    <div class="error-message" id="error-message" style="display: none;">Please upload PNG images.</div>
</div>