Monday, November 26, 2012

Batch watermark images with this HTML5 web app

There are a few online web sites that can place watermarks on one or many images. However, in order to use those services, the images need to be uploaded to the web server before the water marking process can be done. The canvas element of HTML5 is a rich object for image processing and I used this element to write a web app to perform a similar water marking task locally using a modern browser like Chrome and Firefox or Internet Exporer 10+ without having to upload to a web server.

  1. To run this web app, go to http://dominoc925pages-appspot.com/webapp/watermark_image.html.




  2. Optional. Click Settings and change the Watermark text, font style, size, color, transparency, location, alignment, scale and other properties.
  3. Simply drag and drop the image files (JPEG, PNG, GIF) into the dashed box. Or click the Choose Files button and select one or more image files.



    The image(s) are watermarked.


  4. Just right click on the image and choose Save image as to save out the watermarked image.

No comments: