Supernifty Image Management

An alpha version of a Javascript image upload component for a content management system I'm building.

Feb 18, 2020

I love the DropzoneJS library, but this time I was looking for a tool that can immediately incorporate a new image into a live layout and provide access to some top level CSS attributes. So I started from scratch. The header of this post features an alpha version of the tool.

Tap the little wrench to try it out.

You can:

  • Drag a new image over the current one to replace it
  • Tap the eyedropper to change the background color
  • Adjust the height of the image container
  • 'Automatic' sets the background to 'cover'
  • 'Advanced' provides access to sizing, positioning and tiling

It incorporates Donald Chan's Browser Image Compression (https://github.com/Donaldcwl/browser-image-compression) to optimize file sizes and adjust for orientation on JPG files.

This is a first stab at the front end, your changes won't be saved and nothing will be written to the server.