Custom file upload UI

04 March 2016

From my experience there is a lack of custom File upload UI out there for grabs. During one of my projects I required one, without finding much I created my own.

Uploader

The UI I created focuses heavily on the ability to drag and drop (most users don’t actually know you can drag and drop on the default native file upload).

In addition I have….

  • Styled the file upload button
  • Added an image preview once an image is selected
  • Added a remove image button to clear an selected images

The code is available to download and share on CodePen: http://codepen.io/aaronvanston/pen/yNYOXR

Uploader in use