Best jQuery Color Picker Plugins & Tutorials with Demo
I wanted a colorpicker that didn’t require images, and that had an API that made sense to me as a developer who has worked with color in a number of applications. I had tried a number of existing plugins, but decided to try and make a smaller, simpler one.
Let me introduce the first Product Designer here on jQueryRain. You can use this plugin for any type of product. Use it as T-Shirt Designer, Business Card Designer, Device Designer….no limits!
You do not need any vectors files for the plugin, you just set png images for your elements and you tell the plugin which element can be colorized by the user. If its can be colorized, the image will be converted in a HTML5 canvas element.
- Converts png files in HTML5 canvas for colorization
- Let the user add custom texts to the product
- Add unlimited motives
- Colorizable elements by static colors or colorpicker
- Let the user drag, move, remove or rotate the element
- Great API to integrate it in any Shop System
- Add unlimited custom fonts to the font dropdown, you only need the woff file of your font
A simple lite jQuery color picker plugin with a swatch to remember the last 10 colors chosen, that uses html5 markup.
Unlike many other colorpickers out there, colorjoe is truly scaleable. It is based on CSS and does not depend on external images. As a result, you can tweak its size to fit your purposes. Supports touch and AMD module definition as well.
colorjoe was somewhat inspired by ColorJack and RightJS Colorpicker. Unlike those it actually scales pretty well. Essentially this means that you’ll be able to define its actual dimensions and layout using a bit of CSS. This way the widget fits well responsive layouts.
In addition it’s relatively easy to implement missing functionality (RGB fields, whatnot) thanks to the simple API it provides.
A little jQuery plugin paint app that allows you to draw an image using some basic tools providing ability to load and save the images drawn. This is based on HTML5 canvas and will require a browser with support for canvas to run.
This is a fantastic jQuery paint plugin from websanova that allows for some basic drawing functionality. It comes with the ability to load and save images and features the websanvoa color picker plugin as well. A great one of a kind plugin.
jQuery MiniColors is a simple, compact color picker that complements a text or a hidden input control.The plugin adds a trigger next to the input which is customizable via CSS. The included icon is a modified version of the UI color picker icon included in the Fugue icon set.
When the trigger is clicked or when the input gains focus, the color picker appears. Users can either type in a hex-color or select one using the control. The control disappears when the user clicks anywhere outside of the selector or tabs out of the input. If specified, a callback is fired whenever the color value changes.
A color picker coded using Raphael and jQuery. The wheel is drawn using the Raphael js library. jQuery is used to assist with events.
The wheel size is set on creation. It supports a small set of callbacks.
This one is a jQuery color picker plugin that can be used to add a color picker into any webpage. The color picker is related to an existing element, for instance a text field, and updates the value of the element when a color is chosen.
ExColor is a jQuery plugin for enabling users to select colors from a Photoshop-like color picker. It is attached to input fields and can be activated by simply calling a single-line function.