jPipette II, jQuery plugin to retrieve any color from your site

HavaLite CMS

A new liteweight Content Management System (CMS)

jPipette II, jQuery plugin to retrieve any color from your site

JPipette v.2.0.1. allows
- you to pick a color from a canvas screenshot made by Html2Canvas and save these colors for further usage.
- a static color palette can be added as an array in your option.
- and you can also create a thumbnail of your finished page design as Base64/png image.

jPipette is made by Havalite CMS, and licensed under MIT style license, FREE to use, alter, copy, sell, and especially ENHANCE


Add following files in the head part of your site:
  1. jQuery & jQuery ui
  2. html2Canvas.js
  3. jpipette.js & jpipette.css

Eexample code:

    // html
    <input type="text" name="myInput">
    // JavaScript

The Options:

colorFormat: 'RGB', // RGB or HEX 
showPalette: true, // Boolean
palette: ['fff', 'ccc', 'C0C0C0',..., '663366'], // array of color values
screenshot: 300 // screenshot width or set to False to remove icon

Browser Compatibility

Jpipette is tested only on HTML5 capable browsers, such as: Chrome, Firefox, Safari (Sorry IE is a pain)

The Trick

There is no straight way to get the color of every element on a website except by converting the whole site to one image by using html5 Canvas. The plugin Html2Canvas was a great help for me to make this possible.


The only problem is when using external images. These might be blocked by the browser and cant be seen in the canvas conversion. Also the methode by loading external images will take a lot of time to manage. So make sure all images are saved in the right place.

See a DEMO ..... Download the zipFile

comments powered by Disqus


    Leave a Reply

    Contact Info

    Phone: +49 941 26175

    Address: Ayman Teryaki,
    Prüfeninger Str. 48,
    93047 Regensburg, Germany

    Want more info - go to our contact page or visit Google+


    Stay up to date. Subscribe via RSS, Facebook, Twitter or Email

    Recent Comments