DEV Community

Cover image for Cool JavaScript File Uploaders
Frontend Solutions
Frontend Solutions

Posted on • Updated on

Cool JavaScript File Uploaders

Collection of HTML, CSS and JavaScript File Uploader templates, examples. Hand-Picked from codepen.io.The Collection is 100% free to use.

Read The Original Article Published on Frontend Solutions - 9 JavaScript File Uploaders


1. File Upload & Image Preview

Demo Image: File Upload & Image Preview

Made with: Html / CSS (SCSS) / JS

Created by Matt PRO, Created At October 31, 2016

Responsive : no

Dependencies : jquery.js 3.1.0

Compatible browsers : Chrome, Edge, Firefox, Opera, Safari

Demo & Code
Download


2. File Upload

Demo Image: File Upload

Made with: Html / CSS / JS

Created by Piyush, Created At August 3, 2021

Responsive : no

Dependencies : bootstrap.css 4.4.1, font-awesome.css 5.11.2, bootstrap-fileinput.css 5.2.3, jquery.js 3.4.1, popper.js 1.16.0 , bootstrap.js 4.4.1

Compatible browsers : Chrome, Edge, Firefox, Opera, Safari

Demo & Code
Download


3. Images Uploader (Drag & Browse)

Demo Image: Images Uploader (Drag & Browse)

Made with: Html / CSS / JS

Created by Ali Majid, Created At July 2, 2021

Responsive : no

Dependencies : boxicons.css 2.0.7

Compatible browsers : Chrome, Edge, Firefox, Opera, Safari

Demo & Code
Download


4. File Uploader With Animation

Image description

Made with: Html / CSS (SCSS) / JS

Created by Anton Huck, Created At March 2, 2016

Responsive : no

Dependencies : dropzone.js 4.3.0, jquery.js 2.1.3, font-awesome.css 4.5.0, dropzone.css 4.3.0, animate.css 3.2.3

Compatible browsers : Chrome, Edge, Firefox, Opera, Safari

Demo & Code
Download


5. Drag And Drop File Upload

Demo Image: Drag And Drop File Upload

Made with: Html / CSS / JS

Created by Code Boxx, Created At January 30, 2022

Responsive : no

Dependencies : -

Compatible browsers : Chrome, Edge, Firefox, Opera, Safari

Demo & Code
Download


6. Responsive Animated File Uploader

Demo Image: Responsive Animated File Uploader

Made with: Html / CSS (Sass) / JS

Created by burnaDLX, Created At August 12, 2017

Responsive : yes

Dependencies : ionicons.css 2.0.1

Compatible browsers : Chrome, Edge, Firefox, Opera, Safari

Demo & Code
Download


thanks for reading. you can read the original article Published on Frontend Solutions - 9 JavaScript File Uploaders

Top comments (0)